iOS-圓形頭像+陰影

我們經(jīng)常會做圓形頭像+陰影的效果
1.直接添加到View
圖片效果如下:

效果圖.png

寫這篇文章的目的單純?yōu)榱擞涗洿a,方便后期自己使用。代碼如下:

#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"];
        
    }
    !!!!重點(diǎn)是重新繪制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,另創(chuàng)建的layer 的framebackgroundColor,cornerRadius 要寫成跟imgView一樣的尺寸,用masonry 布局后,要重新刷新一下view布局,即調(diào)用[self.view setNeedsLayout]; [self.view layoutIfNeeded];viewWillLayoutSubviews中重新布局一下shadowLayer的frame。

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

先記錄這些,感謝閱讀,如有錯誤,不吝賜教!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容