美文网首页
自定义视图圆角 corner radius

自定义视图圆角 corner radius

作者: GeorgeCharles | 来源:发表于2017-02-22 15:33 被阅读42次

UIView给我提供了很方便的设置圆角的方法。
view.layer.cornerRadius = 5
就可以将View四个角的都设置成圆角。

有时候我们有更高级点的需求,比如将 view 的某一个角设置为圆角,这时候我们发现,刚才的方法是不适用的。解决不了问题。

下面我将介绍给你新的方法

首先我们会用到 UIBezierPath

public convenience init(roundedRect rect: CGRect, byRoundingCorners corners: UIRectCorner, cornerRadii: CGSize)

这是创建一个带有圆角的path。 path 的圆角属性通过 corners 和 cornerRadii 来声明.
corner 声明视图的四个角当中哪几个角为圆角
cornerRadii 来声明圆角的弧度

let maskPath = UIBezierPath.init(roundedRect: backImage.bounds, byRoundingCorners: UIRectCorner.topLeft.union(UIRectCorner.topRight), cornerRadii: CGSize(width: 15, height: 15))

然后创建一个 CALayer, CALayer 的 path 属性设置为 maskPath。

    let  maskLayer = CAShapeLayer.init()
    maskLayer.frame = backImage.bounds;
    maskLayer.path = maskPath.cgPath;

最后将 view.layer.mask 设置为 maskLayer

    backImage.layer.mask = maskLayer;

在这里需要提醒的是,使用纯代码创建和使用 constraint 约束来创建的视图。添加CALayer的时机不同。
自己去尝试吧。情况很多,有很多坑。

这里的方法是我在 StackOverFlow 看到的下面的是链接地址
点击这里

相关文章

  • 自定义视图圆角 corner radius

    UIView给我提供了很方便的设置圆角的方法。view.layer.cornerRadius = 5就可以将Vie...

  • 自定义圆角、圆形图片

    支持圆形、圆角(默认4边圆角,支持自定义各个圆角radius)图片。先建个类RoundImg继承AppCompat...

  • UIView圆角+阴影

    backView是要添加阴影的视图,思路是backView设置corner圆角,再添加一个带阴影的父视图,代码如下...

  • PHP从入门到精通,038第三章HTML5+CSS3——CSS3

    三、border-radius属性 border-radius:圆角

  • 设置圆角

    //corner角落Radius半径 self.loginBtn.layer.cornerRadius = 5; ...

  • 圆角矩形加阴影

    圆角矩形加阴影 圆角 border-radius:左上 右上 右下 左下;border-radius 有更多的功能...

  • CSS3基础

    圆角效果 border-radius ** border-radius*是向元素添加圆角边框。使用方法:borde...

  • 7.圆角border-radius

    圆角border-radius

  • CSS3

    圆角边框 和 圆形 圆角属性:border-radius 当border-radius像素值达到width和hei...

  • css扩展

    1.background-radius 背景切脚 切圆角 将边框从直角转换为圆角 格式:border-radius...

网友评论

      本文标题:自定义视图圆角 corner radius

      本文链接:https://www.haomeiwen.com/subject/helmwttx.html