zoukankan      html  css  js  c++  java
  • 高效添加圆角效果

    高效添加圆角效果

    逻辑思路: 切换到工作线程利用CoreGraphic API生成一个offscreen UIImage,再切换到main thread赋值给UIImageView。这里还涉及到UIImageView复用,圆角头像cache缓存(不能每次都去绘制)

    设置圆角,最简单的情况下既没有 off-screen render,也没有降低帧数

    view.layer.cornerRadius = 5
    

    但是 cornerRadius 这个属性只会影响背景颜色和border,对于内部还有子视图控件就不会出现这样的效果了所以这时候需要:

    label.layer.cornerRadius = 5
    label.layer.masksToBounds = true	
    

    这时候就会出现离屏渲染了,当圆角视图较多时,就会使fps大幅度下降

    为 UIView 添加圆角

    利用 Core Graphics 自己画出了一个圆角矩形 UIImage。除了一些必要的代码外,最核心的就是 CGContextAddArcToPoint 函数。它中间的四个参数表示曲线的起点和终点坐标,最后一个参数表示半径。调用了四次函数后,就可以画出圆角矩形。最后再从当前的绘图上下文中获取图片并返回。

    func kt_drawRectWithRoundedCorner(radius radius: CGFloat,
                                  borderWidth: CGFloat,
                                  backgroundColor: UIColor,
                                  borderColor: UIColor) -> UIImage {    
    UIGraphicsBeginImageContextWithOptions(sizeToFit, false, UIScreen.mainScreen().scale)
    let context = UIGraphicsGetCurrentContext()
    
    CGContextMoveToPoint(context, 开始位置);  // 开始坐标右边开始
    CGContextAddArcToPoint(context, x1, y1, x2, y2, radius);  // 这种类型的代码重复四次
    
    CGContextDrawPath(UIGraphicsGetCurrentContext(), .FillStroke)
    let output = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return output
    }
    

    有了这个图片后,我们创建一个 UIImageView 并插入到视图层级的底部:

     extension UIView {
    func kt_addCorner(radius radius: CGFloat,
                      borderWidth: CGFloat,
                      backgroundColor: UIColor,
                      borderColor: UIColor) {
        let imageView = UIImageView(image: kt_drawRectWithRoundedCorner(radius: radius,
                                    borderWidth: borderWidth,
                                    backgroundColor: backgroundColor,
                                    borderColor: borderColor))
        self.insertSubview(imageView, atIndex: 0)
    }
    }	
    

    提醒

    无论使用上面哪种方法,你都需要小心使用背景颜色。因为此时我们没有设置 masksToBounds,因此超出圆角的部分依然会被显示。因此,你不应该再使用背景颜色,可以在绘制圆角矩形时设置填充颜色来达到类似效果。

    其他方法

    • 美工切图无法适用有背景图的场景
    • shouldRasterize也有cache实效问题

    原文链接:iOS 高效添加圆角效果实战讲解


  • 相关阅读:
    linux下如何查看cpu信息
    Linux更换HBA卡后重新扫盘指令
    oracle 11gR2 RAC存储迁移
    Data Migration from Various Storage Types Using EMC VPLEX and EMC RecoverPoint Technologies
    【11grac】Oracle RAC 更换存储实验
    Oracle RAC 11GR2更换主机不换存储--ASM磁盘组异机挂载 推荐 原创
    ELK(Elasticsearch + Logstash + Kibana) 日志分析平台
    Ogg For Bigdata 同步Oracle数据到KAFKA(包括初始化历史数据)
    stm32cubemx+clion环境搭建
    stdarg宏与实现stm32printf串口打印
  • 原文地址:https://www.cnblogs.com/sunyanyan/p/5292308.html
Copyright © 2011-2022 走看看