XIB下控件邊框相關設置

在講XIB之前首先說下代碼的方式那怎么設置

//設置邊框顏色和寬度
self.myView.layer.borderColor = [UIColor redColor].CGColor;
self.myView.layer.borderWidth = 2;
//設置圓角
self.myView.layer.masksToBounds = YES;
self.myView.layer.cornerRadius = 10; (寬高都是20的話就是純圓)

通過xib快速設置圓角
是利用User Defined Runtime Attributes 進行設置


設置圓角.png

身份檢查器
詳細步驟介紹
點擊UI控件
點擊 Xcode 右側上方身份檢查器(左起第三個按鈕)
找到 Runtime Attributes 屬性,通過Key Path 和 Value 進行設置
設置圓角需要到的Key Path:
layer.cornerRadius ,注意該 key 對應 Value 的 type 應該設置為 String
layer.masksToBounds ,注意該 key 對應 Value 的 type 應該設置為 Boolean , 當右側出現對號時為YES
注意:經過測試,UILabel 必須設置設置 masksToBounds 這一鍵值對,才會出現圓角效果;UIButton、UIView、UIImageView 只需設置 layer.cornerRadius 這一鍵值對就可實現圓角效果

Xib 為控件設置邊框效果
所用方法和上面所講Xib設置圓角基本相同,唯一不同的就是設置 key Path 鍵值對

layer.borderWidth ,注意該 key 對應 Value 的 type 應該設置為 Number
layer. borderXibColor , 注意該 key 對應 Value 的 type 應該設置為 Color

不過不知道你有沒有注意到 layer.borderColor 對應值得類型:Color;經常用代碼進行邊框設置的你,一定記得我們設置的顏色類型為CGColor,不錯問題就出在了這上面
按照上述方法我們設置的邊框顏色為 UIColor 類型,當然不會起作用了啊。
(如果代碼設置那個顏色或提示出一段橋接代碼)

這時下面就給出一種簡便的解決方法,我們只需要為 CALayer 創建一個分類就可以了,具體代碼如下:
CALayer+xibConfig.h

#import <QuartzCore/QuartzCore.h>
#import <UIKit/UIKit.h>
@interface CALayer (xibConfig)
@property(nonatomic, weak) UIColor * borderXibColor;
@end

CALayer+xibConfig.m

#import "CALayer+xibConfig.h"
@implementation CALayer (xibConfig)

-(void)setBorderXibColor:(UIColor*)color
{
    self.borderColor = color.CGColor;
}

-(UIColor*)borderXibColor
{
    return [UIColor colorWithCGColor:self.borderColor];
}

注意:當我們使用Xib設置控件圓角、邊框的時候,如果將key Path寫錯,系統不會報錯,但是運行不會實現理想的效果


我是楚簡約,感謝您的閱讀,

喜歡就點個贊唄,“?喜歡”,

鼓勵又不花錢,你在看,我就繼續寫~

非簡書用戶,可以點右上角的三個“...”,然后"在Safari中打開”,就可以點贊咯~


到此為止.記錄下容易忘的細節同大家分享!!!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺ios動畫全貌。在這里你可以看...
    每天刷兩次牙閱讀 8,573評論 6 30
  • xib中為各種控件設置圓角 通過代碼的方式設置 通過xib快速設置圓角利用User Defined Runtime...
    斷劍閱讀 30,492評論 12 22
  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺iOS動畫全貌。在這里你可以看...
    F麥子閱讀 5,147評論 5 13
  • 轉載:http://www.lxweimin.com/p/32fcadd12108 每個UIView有一個伙伴稱為l...
    F麥子閱讀 6,318評論 0 13
  • 首先,說一下如何在xib中設置Button的邊框及圓角效果:選中要設置的Button, 切換到圖中對應位置,點擊加...
    Kingsleeeey閱讀 5,722評論 0 1