iOS开发 | 关于圆角

本文参考: http://www.baidu.com

一说到圆角, 我们最先想到的可能就是

[view.layer setCornerRadius:3];
[view.layer setMasksToBounds:YES];

但这种方法会造成离屏渲染,对性能影响较大, 设置的少了也能用. 但如果是在tableView上使用的话. 对性能的考验还是很大的. 不推荐使用

• 先说几个简单的

1. UITextField

• textField 自身有设置圆角的方法

textField.borderStyle = UITextBorderStyleRoundedRect;

2. UIView（不包括其子类）

UIView * view = [[UIView alloc] init];
view.backgroundColor = [UIColor redColor];
view.layer.cornerRadius = 3.0f;
// 以下两行，任写一行
view.layer.masksToBounds = NO;
view.clipToBounds = NO;
// 以下两行，千万不要加！
view.layer.masksToBounds = YES;
view.clipToBounds = YES;

*注：UIView 只要设置图层的 cornerRadius 属性即可，如果设置 layer.masksToBounds = YES，会造成不必要的离屏渲染。

3. UITextView

// 与 UIView 类似
UITextView *textView = [[UITextView alloc] init];
textView.layer.cornerRadius = cornerRadius;

4. UILabel

UILabel *label = [[UILabel alloc] init];
// 重点在此！！设置视图的图层背景色，千万不要直接设置 label.backgroundColor
label.layer.backgroundColor = [UIColor grayColor].CGColor;
label.layer.cornerRadius = cornerRadius;

5. UIButton

• button 能够设置背景图片, 一般单一背景色的button圆角设置可以通过设置背景图片来实现
  背景图片可以是找美工要的, 也可以是自己画的.

/**
*  背景图片绘制方法
*/
+ (UIImage *)pureColorImageWithSize:(CGSize)size color:(UIColor *)color cornRadius:(CGFloat)cornRadius 
{
  UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, size.width, size.height)];
  view.backgroundColor = color;
  view.layer.cornerRadius = cornerRadius;
  // 下面方法，第一个参数表示区域大小。第二个参数表示是否是非透明的。如果需要显示半透明效果，需要传NO，否则传YES。第三个参数是屏幕密度
  UIGraphicsBeginImageContextWithOptions(view.bounds.size, NO, [UIScreen mainScreen].scale);
  [view.layer renderInContext:UIGraphicsGetCurrentContext()];
  UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
  UIGraphicsEndImageContext();
  return image;
}

6. UIImageView

imageView 可以通过图片上的圆角来实现或者使用贝塞尔曲线的方法来实现, 这种方法比较麻烦一点, 但是用的多了就好了

- (UIImageView *)roundedRectImageViewWithCornerRadius:(CGFloat)cornerRadius image:(UIImageView *)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();
    
    return imageView;
}

还有一种方法 cashapelayer和uibezierpath设置圆角, 也是我比较常用的一种

#import 

UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
imageView.image = [UIImage imageNamed:@"icon"];
UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:imageView.bounds byRoundingCorners:UIRectCornerAllCorners cornerRadii:imageView.bounds.size];
CAShapeLayer * layer = [[CAShapeLayer alloc] init];
layer.frame = imageView.bounds;
layer.path = path.CGPath;
imageView.layer.mask = layer;
[self.imageView addSubview:imageView];