iOS-圆形头像+阴影

我们经常会做圆形头像+阴影的效果
1.直接添加到View
图片效果如下:

效果图.png

写这篇文章的目的单纯为了记录代码,方便后期自己使用。代码如下:

#import "ViewController.h"
#import "Masonry.h"
#define kWidth 50
@interface ViewController ()
{
    UIImageView *imgView;
    CALayer *shadowLayer;
}
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    
方法1
//    [self test1];
    
方法2
    [self test2];
    [self.view setNeedsLayout];
    [self.view layoutIfNeeded];
    
}
-(void)viewWillLayoutSubviews {
    shadowLayer.frame = imgView.frame;
}
-(void)test1 {
    imgView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"1"]];
    imgView.layer.cornerRadius = kWidth * 0.5;
    
    [self.view addSubview:imgView];
    [imgView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.top.mas_equalTo(100);
        make.width.height.mas_equalTo(kWidth);
        
    }];
    imgView.layer.shadowColor = [UIColor redColor].CGColor;
    imgView.layer.shadowOffset = CGSizeMake(0, 0);
    imgView.layer.shadowOpacity = 0.4;
}
-(void)test2 {
    imgView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"1"]];
    imgView.layer.cornerRadius = kWidth * 0.5;
    imgView.layer.masksToBounds = YES;
    [self.view addSubview:imgView];
    shadowLayer = [[CALayer alloc]init];
    shadowLayer.frame = imgView.frame;
    shadowLayer.backgroundColor = [UIColor redColor].CGColor;
    shadowLayer.cornerRadius = kWidth * 0.5;
    shadowLayer.shadowColor = [UIColor redColor].CGColor;
    shadowLayer.shadowOffset = CGSizeMake(0, 0);
    shadowLayer.shadowOpacity = 0.4;
    
    [self.view.layer addSublayer:shadowLayer];
    //两种添加都可以
//    [self.view bringSubviewToFront:imgView];
     [self.view.layer insertSublayer:imgView.layer above:shadowLayer];
    [imgView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.top.mas_equalTo(100);
        make.width.height.mas_equalTo(kWidth);
        
    }];
   
  
}
@end

2. 直接添加到cell上
在cell的-(void)layoutSubviews方法中写如下代码

-(void)layoutSubviews {
    [super layoutSubviews];
    shadowLayer.frame = imgView.frame;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath方法中

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    MyCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
    if (!cell) {
        cell = [[MyCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cellID"];
        
    }
    !!!!重点是重新绘制cell
    [cell layoutIfNeeded];
    cell.backgroundColor = [UIColor whiteColor];
    cell.titleLabel.text = self.dataArr[indexPath.row];
    return cell;
}

坑如下:

[self test1]中 如果imgView的圆角+阴影作用在一个layer上,切记不可写 imgView.layer.masksToBounds = YES

[self test2]中,使用imgView.layer.masksToBounds = YES,另创建的layer 的framebackgroundColorcornerRadius 要写成跟imgView一样的尺寸,用masonry 布局后,要重新刷新一下view布局,即调用[self.view setNeedsLayout]; [self.view layoutIfNeeded];viewWillLayoutSubviews中重新布局一下shadowLayer的frame。

demo git地址:https://github.com/sisios/circleAndShadow

先记录这些,感谢阅读,如有错误,不吝赐教!

你可能感兴趣的:(iOS-圆形头像+阴影)