CALayer简单应用——带阴影的icon

本文介绍了一种在iOS开发中实现圆形图片带有阴影效果的方法。通过创建两个独立的图层,一个用于展示圆形图片,另一个则负责显示阴影,解决了设置圆形图层时阴影消失的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原理:正常情况下是在一个图层上既设置icon,也设置阴影就能达到要求;但是这样做会发现阴影不见了...。原因是设置圆形图层需要把暴露在该图层外子图层部分切割掉( self.iconLayer.masksToBounds = YES;   在设置图片时会重新绘制一个图层来装图片(被切割后就变成圆的了),而阴影自然也是属于在该图层外的部分,顺理成章的也被切割掉了....  。所以要同时实现这两个功能,可以换一个角度想:设置两个图层,一个专门装圆形图片,一个专门装圆形图片的阴影部分。


#import "ViewController.h"

#define IconWidth 150


@interface ViewController ()

@property (nonatomic,strong) CALayer *iconLayer;

@property (nonatomic,strong) CALayer *shadowLayer;


@end


@implementation ViewController


- (void)viewDidLoad {

    [superviewDidLoad];

    self.view.backgroundColor = [UIColorwhiteColor];

   

    self.shadowLayer = [CALayerlayer];

    self.shadowLayer.bounds =CGRectMake(0,0, IconWidth,IconWidth);

注:设置阴影层的时候一定要设置backgroundColor,不设置的话不会显示阴影(原因还没查到....).

    self.shadowLayer.backgroundColor = [UIColorwhiteColor].CGColor;

    self.shadowLayer.cornerRadius =IconWidth/2.0f;

    self.shadowLayer.position =self.view.center;

    self.shadowLayer.shadowColor = [UIColorblackColor].CGColor;

    self.shadowLayer.shadowOffset =CGSizeMake(4.0f,4.0f);

    self.shadowLayer.shadowOpacity =0.8f;

    [self.view.layeraddSublayer:self.shadowLayer];

    

    self.iconLayer = [CALayerlayer];

    self.iconLayer.contents = (__bridgeid _Nullable)([UIImageimageNamed:@"start.jpeg"].CGImage);

    self.iconLayer.bounds =CGRectMake(0,0, IconWidth,IconWidth);

 

    self.iconLayer.position =self.shadowLayer.position;

    self.iconLayer.cornerRadius =IconWidth/2.0f;

    self.iconLayer.masksToBounds =YES;

    [self.view.layeraddSublayer:self.iconLayer];

}

@end

效果图:


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值