OC 控件四周添加虚线边框

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

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

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

        btn.layer.cornerRadius = 15;
        btn.clipsToBounds = YES;

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


image.png

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

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

最终效果:


image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容