笔记-iOS设置圆角方法以及指定位置设圆角

栏目: IOS · 发布时间: 6年前

内容简介:代码:这个方法里maskToBounds会触发离屏渲染,GPU在当前屏幕缓冲区外新开辟了一个渲染缓冲区进行工作,也就是离屏渲染,这会给我们带来额外的性能损耗,如果这样的圆角操作达到一定数量,会触发缓冲区的频繁合并和上下文的频繁切换,性能的代价会宏观的表现在用户体验上<掉帧>,代码:

代码:

UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"TestImage"]];
// 只需设置layer层的两个属性
// 设置圆角
imageView.layer.cornerRadius = 50;
// 将多余的部分切掉
imageView.layer.masksToBounds = YES;
[self.view addSubview:imageView];
复制代码

这个方法里maskToBounds会触发离屏渲染,GPU在当前屏幕缓冲区外新开辟了一个渲染缓冲区进行工作,也就是离屏渲染,这会给我们带来额外的性能损耗,如果这样的圆角操作达到一定数量,会触发缓冲区的频繁合并和上下文的频繁切换,性能的代价会宏观的表现在用户体验上<掉帧>, 不建议使用

第二种方法:使用贝塞尔曲线UIBezierPath和Core Graphics框架画出一个圆角

代码:

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
 imageView.image = [UIImage imageNamed:@"TestImage.jpg"];
 // 开始对imageView进行画图
 UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, NO, 0.0);
 // 使用贝塞尔曲线画出一个圆形图
 [[UIBezierPath bezierPathWithRoundedRect:imageView.bounds cornerRadius:imageView.frame.size.width] addClip];
 [imageView drawRect:imageView.bounds];
 imageView.image = UIGraphicsGetImageFromCurrentImageContext();
 // 结束画图
 UIGraphicsEndImageContext();
 [self.view addSubview:imageView];
复制代码
  • UIGraphicsBeginImageContextWithOption(CGSize size, BOOL opaque, CGFloat scale)各参数的含义:
  • size ---新创建的文图上下文大小
  • opaque --- 透明开关,如果图形完全不用透明,设置为YES以优化位图的存储。
  • scale --- 缩放因子。虽然这里可以用[UIScreen mainScreen].scale来获取,但实际上设为0后,系统会自动设置正确的比例

第三种方法: 使用Core Graphics框架画出一个圆角

代码:

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 200, 100, 100)];
imageView.image = [UIImage imageNamed:@"TestImage.jpg"];

// 开始对imageView进行画图
UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, NO, 0.0);

// 获取图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();

// 设置一个范围
CGRect rect = CGRectMake(0, 0, imageView.frame.size.width, imageView.frame.size.height);

// 根据一个rect创建一个椭圆
CGContextAddEllipseInRect(ctx, rect);

// 裁剪
CGContextClip(ctx);

// 讲原照片画到图形上下文
[imageView.image drawInRect:rect];

// 从上下文上获取裁剪后的照片
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

// 关闭上下文
UIGraphicsEndImageContext();
imageView.image = image;
[self.view addSubview:imageView];
复制代码

第四种方法: 使用CAShapeLayer和UIBezierPath设置圆角

代码:

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 200, 100, 100)];
imageView.image = [UIImage imageNamed:@"TestImage.jpg"];
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:imageView.bounds byRoundingCorners:UIRectCornerAllCorners
cornerRadii:imageView.bounds.size];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc]init];
// 设置大小
maskLayer.frame = imageView.bounds;
// 设置图形样子
maskLayer.path = maskPath.CGPath;
imageView.layer.mask = maskLayer;
[self.view addSubview:imageView];
复制代码

指定需要的角成为圆角(第四种方法的延伸)

方法:

+ (UIBezierPath *)bezierPathWithRoundedRect:(CGRect)rect
                          byRoundingCorners:(UIRectCorner)corners
                                cornerRadii:(CGSize)cornerRadii;
                                
corners参数指定了要成为圆角的角, 枚举类型如下:
typedef NS_OPTIONS(NSUInteger, UIRectCorner) {
    UIRectCornerTopLeft     = 1 << 0,
    UIRectCornerTopRight    = 1 << 1,
    UIRectCornerBottomLeft  = 1 << 2,
    UIRectCornerBottomRight = 1 << 3,
    UIRectCornerAllCorners  = ~0UL
};

复制代码

实现代码:

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 200, 200, 200)];
imageView.image = [UIImage imageNamed:@"TestImage.jpg"];

// 绘制圆角 需设置的圆角 使用"|"来组合
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:imageView.bounds byRoundingCorners:UIRectCornerTopLeft |
UIRectCornerBottomRight cornerRadii:CGSizeMake(30, 30)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc]init];

// 设置大小
maskLayer.frame = imageView.bounds;

// 设置图形样子
maskLayer.path = maskPath.CGPath;
imageView.layer.mask = maskLayer;
[self.view addSubview:imageView];
复制代码

效果图:

笔记-iOS设置圆角方法以及指定位置设圆角

据说,第四种方法最好,对内存的消耗最少,而且渲染快速。


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Think Python

Think Python

Allen B. Downey / O'Reilly Media / 2012-8-23 / GBP 29.99

Think Python is an introduction to Python programming for students with no programming experience. It starts with the most basic concepts of programming, and is carefully designed to define all terms ......一起来看看 《Think Python》 这本书的介绍吧!

RGB转16进制工具
RGB转16进制工具

RGB HEX 互转工具

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具