爬坑!同时实现阴影效果与圆角效果

文章开始之前先上图镇帖

爬坑!同时实现阴影效果与圆角效果_第1张图片
阴影与圆角效果.png

废话模式
最近公司的项目中要求UIButton/UIView/UIimageView这样的视图控件实现图片既有圆角还要有阴影效果。但是众所周知圆角效果和阴影效果“势同水火”不能共存。

正文

  • 方法一
    我在网上找了很多这方面的文章,千篇一律,使用一个UIView做阴影,一个需要的控件做圆角,如:UIImageView。
    直接上代码
//UIView
    UIView *shadowView = [[UIView alloc]initWithFrame:CGRectMake(100,100,100,100)];
    shadowView.layer.cornerRadius = 6;
    shadowView.layer.masksToBounds = YES;
    [self.view addSubview:shadowView];

//UIImageView 
    UIImageView *displayView = [[UIImageView alloc]init];
    displayView.image = [UIImage imageNamed:@"1"];//会缓存图片
    displayView.layer.shadowRadius = 6;
    displayView.layer.shadowOffset = CGSizeMake(0, 0);
    displayView.layer.shadowColor = [UIColor blackColor].CGColor;
    displayView.layer.shadowOpacity = 1;
    [self.view addSubview:displayView];
  • 方法二
    使用贝塞尔曲线绘制一个圆角,UIImageView实现阴影。
    UIImageView *displayView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
     displayView.image = [UIImage imageNamed:@"1"];
     //-----绘制阴影
    displayView.layer.shadowRadius = 6;
    displayView.layer.shadowOffset = CGSizeMake(0, 0);
    displayView.layer.shadowColor = [UIColor blackColor].CGColor;
    displayView.layer.shadowOpacity = 1;
    [self.view addSubview:self.displayView];

     //-----绘制圆角。
    //开始对imageView进行画图
    UIGraphicsBeginImageContextWithOptions(_displayView.bounds.size, NO, 1.0);
    //使用贝塞尔曲线画出一个圆角图
    //当然也可以画圆,将 10 替换[disPlayView.frame.size.width]
    [[UIBezierPath bezierPathWithRoundedRect:_displayView.bounds cornerRadius:10] addClip]; 
    [_displayView drawRect:_displayView.bounds];
    _displayView.image = UIGraphicsGetImageFromCurrentImageContext();
    //结束画图
    UIGraphicsEndImageContext();

还有其他的一些方法,在这里就先不写了。读者可以搜一下 ->使用UIGraphicsGetCurrentContext和UIBezierPath设置,这种方法需要在 -drawRect:(CGRect)rect 方法中实现


结束 (GG)

附上Demo,满意的话就给个star哦~~

你可能感兴趣的:(爬坑!同时实现阴影效果与圆角效果)