html圆形头像带阴影,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 的frame，backgroundColor，cornerRadius 要写成跟imgView一样的尺寸，用masonry 布局后，要重新刷新一下view布局，即调用[self.view setNeedsLayout]; [self.view layoutIfNeeded];在viewWillLayoutSubviews中重新布局一下shadowLayer的frame。

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