iOS技术资料iOS开发杂货铺iOS

iOS 在控件上添加虚线边框

2017-03-15  本文已影响2695人  闹钟先生的闹钟

以按钮为例子,实现虚线按钮:

    CAShapeLayer *border = [CAShapeLayer layer];
    
    //虚线的颜色
    border.strokeColor = [UIColor redColor].CGColor;
    //填充的颜色
    border.fillColor = [UIColor clearColor].CGColor;
    
    //设置路径
    border.path = [UIBezierPath bezierPathWithRect:self.lineButton.bounds].CGPath;
    
    border.frame = self.lineButton.bounds;
    //虚线的宽度
    border.lineWidth = 1.f;
    
    
    //设置线条的样式
    //    border.lineCap = @"square";
    //虚线的间隔
    border.lineDashPattern = @[@4, @2];
    
    [self.lineButton.layer addSublayer:border];
效果1

到这里基本已经OK了,但是突然发现我要的是有圆角的按钮,那就去添加圆角

    border.cornerRadius = 5.f;
    
    border.masksToBounds = YES;

然而效果是这样子的,四个角变的很奇怪


效果2

以为要在控件上添加圆角

    self.lineButton.layer.cornerRadius = 5.f;
    self.lineButton.layer.masksToBounds = YES;

然而效果依然很奇怪。


效果3

最后找资料终于得到实现效果 需要把bezierPathWithRect 替换成 bezierPathWithRoundedRect 就可以了

最终

下面全部代码

    CAShapeLayer *border = [CAShapeLayer layer];
    
    //虚线的颜色
    border.strokeColor = [UIColor redColor].CGColor;
    //填充的颜色
    border.fillColor = [UIColor clearColor].CGColor;
    
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:self.lineButton.bounds cornerRadius:5];
    
    //设置路径
    border.path = path.CGPath;
    
    border.frame = self.lineButton.bounds;
    //虚线的宽度
    border.lineWidth = 1.f;
    
    
    //设置线条的样式
    //    border.lineCap = @"square";
    //虚线的间隔
    border.lineDashPattern = @[@4, @2];
    
    self.lineButton.layer.cornerRadius = 5.f;
    self.lineButton.layer.masksToBounds = YES;
    
    [self.lineButton.layer addSublayer:border];
上一篇下一篇

猜你喜欢

热点阅读