目前什么是“正确的"?设置 UIView 的圆角半径的方法? [英] What's currently the "correct" way to set a UIView's corner radius?

查看:20
本文介绍了目前什么是“正确的"?设置 UIView 的圆角半径的方法?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

设置UIView的圆角半径可以通过以下方式完成:

  1. 设置layercornerRadius属性:

    view.layer.cornerRadius = 5;view.layer.masksToBounds = true;

  2. 敷面膜:

    func roundCorners(corners:UIRectCorner, radius: CGFloat) {let path = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))让掩码 = CAShapeLayer()mask.path = path.cgPathself.layer.mask = 面具}

  3. 覆盖draw(_:):

    func draw(_ rect: CGRect) {//圆角矩形的大小让 rectWidth = rect.width让 rectHeight = rect.height//找到实际帧的中心以在中间设置矩形让 xf: CGFloat = (self.frame.width - rectWidth)/2让 yf: CGFloat = (self.frame.height - rectHeight)/2让 ctx = UIGraphicsGetCurrentContext()!ctx.saveGState()让 rect = CGRect(x: xf, y: yf, 宽度: rectWidth, height: rectHeight)让 clipPath = UIBezierPath(roundedRect: rect,cornerRadius: rectCornerRadius).cgPathctx.addPath(clipPath)ctx.setFillColor(rectBgColor.cgColor)ctx.closePath()ctx.fillPath()ctx.restoreGState()}

根据以下标准,哪些通常被认为是在 UIView 上实现圆角的正确"方式:

  • 配置(有些角可能是圆角,有些则不是)
  • 动画(您可以为 cornerRadius 变化设置动画)
  • 灵活性(是否会破坏您已经应用的第三方库或掩码)
  • 可读性(解决方案的简洁性/可重用性如何)
  • 速度(是否会对性能产生负面影响)

解决方案

请注意,我不知道目前设置 UIView 圆角半径的正确"方法是什么.

我更喜欢做的是尽可能多地使用 Interface Builder,而不需要额外的代码,这种方法显示了并且根据我的经验是可靠的.


从 iOS 11 起

您可以通过设置以下属性,在 Interface BuilderIdentity inspector 中使用用户定义的运行时属性:

layer.cornerRadiuslayer.maskedCornerslayer.masksToBounds

根据

Setting a UIView's corner radius can be done the following ways:

  1. Set the layer's cornerRadius property:

    view.layer.cornerRadius = 5;
    view.layer.masksToBounds = true;
    

  2. Apply a mask:

    func roundCorners(corners:UIRectCorner, radius: CGFloat) {
        let path = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
        let mask = CAShapeLayer()
        mask.path = path.cgPath
        self.layer.mask = mask
    }
    

  3. Override draw(_:):

    func draw(_ rect: CGRect) {
        // Size of rounded rectangle
        let rectWidth = rect.width
        let rectHeight = rect.height
    
        // Find center of actual frame to set rectangle in middle
        let xf: CGFloat = (self.frame.width  - rectWidth)  / 2
        let yf: CGFloat = (self.frame.height - rectHeight) / 2
    
        let ctx = UIGraphicsGetCurrentContext()!
        ctx.saveGState()
    
        let rect = CGRect(x: xf, y: yf, width: rectWidth, height: rectHeight)
        let clipPath = UIBezierPath(roundedRect: rect, cornerRadius: rectCornerRadius).cgPath
    
        ctx.addPath(clipPath)
        ctx.setFillColor(rectBgColor.cgColor)
    
        ctx.closePath()
        ctx.fillPath()
        ctx.restoreGState()
    }
    

Which of these is generally considered to be the "correct" way of implementing rounded corners on a UIView, accounting for the following criteria:

  • configuration (some corners may be rounded while others are not)
  • animation (can you animate the cornerRadius changing)
  • flexibility (does it break third party libraries or masks you have already applied)
  • readability (how concise/reusable is the solution)
  • speed (does it negatively impact performance)

解决方案

Note that I don't know what's currently the "correct" way to set a UIView's corner radius.

What I prefer to do is to use Interface Builder as much as possible without having extra code which this approach shows and is reliable to my experience.


From iOS 11 upwards

you can use user-defined runtime attributes in the Identity inspector of the Interface Builder by setting the following properties:

layer.cornerRadius
layer.maskedCorners
layer.masksToBounds

According to the documentation of the CACornerMask you can see that the maskedCorners property is in fact a NSUInteger data type and you're allowed to set the following values:

kCALayerMinXMinYCorner = 1U << 0
kCALayerMaxXMinYCorner = 1U << 1
kCALayerMinXMaxYCorner = 1U << 2
kCALayerMaxXMaxYCorner = 1U << 3

Since you're allowed to bitwise OR those masks together you only have to "calculate" the resulting integer of that bitwise OR of what you actually need.

Therefore set the following number (integer) values for the maskedCorners property to get rounded corners:

 0 = no corner is being rounded
 1 = top left corner rounded only
 2 = top right corner rounded only
 3 = top left and top right corners rounded only
 4 = bottom left corner rounded only
 5 = top left and bottom left corners rounded only
 6 = top right and bottom left corners rounded only
 7 = top left, top right and bottom left corners rounded only
 8 = bottom right corner rounded only
 9 = top left and bottom right corners rounded only
10 = top right and bottom right corners rounded only
11 = top left, top right and bottom right corners rounded only
12 = bottom left and bottom right corners rounded only
13 = top left, bottom left and bottom right corners rounded only
14 = top right, bottom left and bottom right corners rounded only
15 = all corners rounded

Example: If you want to set the corner radius for the top-left and the top-right corners of a UIView you would use those attributes:

这篇关于目前什么是“正确的"?设置 UIView 的圆角半径的方法?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆