1.使用
layer设置指定圆角 或者设定一个或几个圆角
由于项目中需要给按钮左下 和左上加圆角,我司可爱的ui君并不想给我切图。
所以只有自己画了。由于很久没有用过这些知识,花了一些时间,
故记入笔记。
也可以用来画半圆。
选择要画圆角的位置只需要改变枚举即可。
有空能封装一下更好。
![](https://i-blog.csdnimg.cn/blog_migrate/b62cc4dd7a154912e48f2b9b9cbe824b.webp?x-image-process=image/format,png)
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.statusLabel.bounds
byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerTopLeft
cornerRadii:CGSizeMake(self.statusLabel.height/2, self.statusLabel.height/2)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.statusLabel.bounds;
maskLayer.path = maskPath.CGPath;
self.statusLabel.layer.mask = maskLayer;
//
UIView *whiteView = [[UIView alloc] initWithFrame:CGRectMake((bgView.width-125)/2, -10, 125, 10)];
whiteView.backgroundColor = [UIColor whiteColor];
if (@available(iOS 11.0, *)) {
whiteView.layer.maskedCorners = kCALayerMinXMinYCorner | kCALayerMaxXMinYCorner;
whiteview.layer.maskstoBound = true;
whiteview.layer.coneradio = 5.0;
whiteview.layer.shouldRasterize = YES; //圆角缓存
whiteview.layer.rasterizationScale = [UIScreen mainScreen].scale;//提高流畅度
经测试 加上后两句之后流畅度有了提高。
} else {
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:whiteView.bounds byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight cornerRadii:CGSizeMake(5, 5)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
//设置大小
maskLayer.frame = whiteView.bounds;
//设置图形样子
maskLayer.path = maskPath.CGPath;
whiteView.layer.mask = maskLayer;
}
iOS设置圆角的方法及指定圆角的位置
- 在iOS开发中,我们经常会遇到设置圆角的问题, 以下是几种设置圆角的方法:
第一种方法: 通过设置layer的属性
代码:
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"willwang"]];
//只需要设置layer层的两个属性
//设置圆角
imageView.layer.cornerRadius =50
//将多余的部分切掉
imageView.layer.masksToBounds = YES;
imageView.layer.shouldRasterize = YES; //圆角缓存
imageView.layer.rasterizationScale = [UIScreen mainScreen].scale;//提高流畅度
经测试 加上后两句之后流畅度有了提高。
[self.view addSubview:imageView];
- 这个实现方法里maskToBounds会触发离屏渲染(offscreen rendering),GPU在当前屏幕缓冲区外新开辟一个渲染缓冲区进行工作,也就是离屏渲染,这会给我们带来额外的性能损耗,如果这样的圆角操作达到一定数量,会触发缓冲区的频繁合并和上下文的的频繁切换,性能的代价会宏观地表现在用户体验上<掉帧>不建议使用.
第二种方法: 使用贝塞尔曲线UIBezierPath和Core Graphics框架画出一个圆角
效果图:
代码:
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
imageView.image = [UIImage imageNamed:@"willwang"];
//开始对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];
- UIGraphicsBeginImageContextWithOptions(CGSize size, BOOL opaque, CGFloat scale) 各参数含义:
- size —— 新创建的位图上下文的大小
- opaque —— 透明开关,如果图形完全不用透明,设置为YES以优化位图的存储。
- scale —— 缩放因子 iPhone 4是2.0,其他是1.0。虽然这里可以用[UIScreen mainScreen].scale来获取,但实际上设为0后,系统就会自动设置正确的比例
第三种方法: 使用Core Graphics框架画出一个圆角
代码:
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 200, 100, 100)];
imageView.image = [UIImage imageNamed:@"willwang"];
//开始对imageView进行画图
UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, NO, 1.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 *newImage = UIGraphicsGetImageFromCurrentImageContext();
// 关闭上下文
UIGraphicsEndImageContext();
imageView.image = newImage;
[self.view addSubview:imageView];
第四种方法: 使用CAShapeLayer和UIBezierPath设置圆角
代码:
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
imageView.image = [UIImage imageNamed:@"willwang"];
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
};
效果图:
代码:
//设置视图位置和大小
UIView *myView = [[UIView alloc] initWithFrame:CGRectMake(120, 300, 100, 50)];
//设置背景颜色
myView.backgroundColor = [UIColor redColor];
//添加
[self.view addSubview:myView];
//绘制圆角 要设置的圆角 使用“|”来组合
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:myView.bounds byRoundingCorners:UIRectCornerTopLeft | UIRectCornerBottomRight cornerRadii:CGSizeMake(20, 20)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
//设置大小
maskLayer.frame = myView.bounds;
//设置图形样子
maskLayer.path = maskPath.CGPath;
myView.layer.mask = maskLayer;
UILabel *label = [[UILabel alloc]init];
//添加文字
label.text = @"willwang";
//文字颜色
label.textColor = [UIColor whiteColor];
[myView addSubview: label];
//自动布局
[label mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(myView);
}];
第五种方法 在storyboard或xib中设置
/
第一种方法:通过设置layer的属性
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
//只需要设置layer层的两个属性
//设置圆角
imageView.layer.cornerRadius = imageView.frame.size.width / 2;
//将多余的部分切掉
imageView.layer.masksToBounds = YES;
[self.view addSubview:imageView];
注:禁用。。影响性能。
第二种方法:使用贝塞尔曲线UIBezierPath和Core Graphics框架画出一个圆角
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
imageView.image = [UIImage imageNamed:@"1"];
//开始对imageView进行画图
UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, NO, 1.0);
//使用贝塞尔曲线画出一个圆形图
[[UIBezierPath bezierPathWithRoundedRect:imageView.bounds cornerRadius:imageView.frame.size.width] addClip];
[imageView drawRect:imageView.bounds];
imageView.image = UIGraphicsGetImageFromCurrentImageContext();
//结束画图
UIGraphicsEndImageContext();
[self.view addSubview:imageView];
第三种方法:使用CAShapeLayer和UIBezierPath设置圆角
首先需要导入<AVFoundation/AVFoundation.h>
#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
imageView.image = [UIImage imageNamed:@"1"];
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];
}
---------------------
作者:weixin_34381687
来源:CSDN
原文:https://blog.csdn.net/weixin_34381687/article/details/87515690
版权声明:本文为博主原创文章,转载请附上博文链接!