本人有若干成套学习视频, 可试看! 可试看! 可试看, 重要的事情说三遍 包含Java, 数据结构与算法, iOS, 安卓, python, flutter等等, 如有需要, 联系微信tsaievan.
在xib上设置view的圆角其实很简单.
在`xib`上设置`view`的圆角
就这么两步就妥妥的了, 但是如果是这种不规则的圆角呢? 如下图所示:
Snip20190226_2.png
如果是用纯代码的话设置button的圆角的话, 实际上就是button的layer层的mask属性赋值一个CAShapeLayer, 而这个CAShapeLayer的路径就是我们设置的贝塞尔曲线, 代码如下:
_yf_cornerRadius = _yf_cornerRadius ? : 10.0f;
///< cornerRadii : 每个角椭圆的半径
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(_yf_cornerRadius, _yf_cornerRadius)];
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = self.bounds;
maskLayer.path = maskPath.CGPath;
self.layer.mask = maskLayer;
但是, 我们如何直接在xib上设置这种不规则圆角呢?
这就需要我们用到两个关键字: IB_DESIGNABLE, IBInspectable
IB_DESIGNABLE是写在类名前面的,
IBInspectable是写在属性前面的:
IB_DESIGNABLE
@interface CYFRoundedButton : UIButton
@property (nonatomic, assign) IBInspectable NSUInteger style;
@property (nonatomic, assign) IBInspectable CGFloat yf_cornerRadius;
@end
IB_DESIGNABLE标识后: 在xib的设置界面就会出现下图所示的情形:
`IB_DESIGNABLE `标识后
这样就可以实时地展示这个自定义view的图形
IBInspectable标识后, 我们就可以使用自定义的属性:
自定义属性
这样, 只要碰到这种不规则圆角的button, 我们就可以直接在xib上使用自定义button, 然后自己设置自定义的圆角属性和圆角模式, 代码我们只要写一遍即可:
.h文件
IB_DESIGNABLE
@interface CYFRoundedButton : UIButton
@property (nonatomic, assign) IBInspectable NSUInteger style;
@property (nonatomic, assign) IBInspectable CGFloat yf_cornerRadius;
@end
.m文件
@implementation CYFRoundedButton
- (void)makeCorner {
UIRectCorner corners;
switch (self.style) {
case 0:
corners = UIRectCornerBottomLeft;
break;
case 1:
corners = UIRectCornerTopRight;
break;
case 2:
corners = UIRectCornerTopLeft;
break;
case 3:
corners = UIRectCornerTopRight;
break;
case 4:
corners = UIRectCornerBottomLeft | UIRectCornerBottomRight;
break;
case 5:
corners = UIRectCornerTopLeft | UIRectCornerTopRight;
break;
case 6:
corners = UIRectCornerBottomLeft | UIRectCornerTopLeft;
break;
case 7:
corners = UIRectCornerBottomRight | UIRectCornerTopRight;
break;
case 8:
corners = UIRectCornerBottomRight | UIRectCornerTopRight | UIRectCornerTopLeft;
break;
case 9:
corners = UIRectCornerBottomRight | UIRectCornerTopRight | UIRectCornerBottomLeft;
break;
default:
corners = UIRectCornerAllCorners;
break;
}
_yf_cornerRadius = _yf_cornerRadius ? : 10.0f;
///< cornerRadii : 每个角椭圆的半径
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(_yf_cornerRadius, _yf_cornerRadius)];
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = self.bounds;
maskLayer.path = maskPath.CGPath;
self.layer.mask = maskLayer;
}
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
[self setupUIOnce];
}
return self;
}
- (instancetype)initWithCoder:(NSCoder *)aDecoder {
if (self = [super initWithCoder:aDecoder]) {
[self setupUIOnce];
}
return self;
}
- (void)setupUIOnce {
[self makeCorner];
}
- (void)layoutSubviews {
[super layoutSubviews];
[self makeCorner];
}
@end
以上!
