图片圆角加阴影 + 按钮的渐变颜色
来源:互联网 发布:英译汉软件免费下载 编辑:程序博客网 时间:2024/06/05 02:51
图片圆角加阴影
刚开始做项目时,给圆角加阴影,如: `UIImageView *image = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"leftbackiamge"]];
image.frame = CGRectMake(100, self.view.frame.size.height - 300, 100, 100);
image.layer.masksToBounds = YES;
image.layer.cornerRadius = 50;
image.layer.shadowOffset = CGSizeMake(0, 5);
image.layer.backgroundColor = [UIColor brownColor].CGColor;
image.layer.shadowColor = [UIColor brownColor].CGColor;
image.layer.shadowOpacity = 0.7;
image.layer.cornerRadius = 50;
[self.view addSubview:image];
这样写 但是出来的效果
只有圆角没有阴影
为何?
因为本身的masksToBounds方法就是超出父视图部分裁剪掉,所以加的阴影部分为超出部分,所以导致阴影显示不出来
解决方法:加一个图层,把圆角图片加到图层上
UIImageView *image = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"leftbackiamge"]]; image.frame = CGRectMake(100, self.view.frame.size.height - 300, 100, 100); //加个图层 设置阴影 CALayer *layer = [[CALayer alloc] init]; layer.frame = CGRectMake(100, self.view.frame.size.height - 300, 100, 100); layer.shadowOffset = CGSizeMake(0, 5); layer.backgroundColor = [UIColor brownColor].CGColor; layer.shadowColor = [UIColor brownColor].CGColor; layer.shadowOpacity = 0.7; layer.cornerRadius = 50; [self.view.layer addSublayer:layer]; image.layer.masksToBounds = YES; image.layer.cornerRadius = 50; //注意一定要先上层再上image,这样保证image在层之上。 [self.view addSubview:image];
注意:必须先上层再加image,这样确保image在图层上
效果:
就成功了
下面说一下按钮的渐变颜色,一个道理把渐变的图层加到按钮图层上
//渐变的按钮 UIButton *lookBtn = [UIButton buttonWithType:(UIButtonTypeCustom)]; lookBtn.frame = CGRectMake(100, 100,100, 100); [lookBtn setTitle:@"查看详情" forState:(UIControlStateNormal)]; [lookBtn addTarget:self action:@selector(lookBtn) forControlEvents:(UIControlEventTouchUpInside)]; lookBtn.layer.shadowColor=[TCUIColorFromRGB(0x24A7F2) colorWithAlphaComponent:0.5].CGColor; lookBtn.layer.shadowOffset=CGSizeMake(4, 4); lookBtn.layer.shadowOpacity=0.5; lookBtn.layer.shadowRadius= 5; //渐变颜色 CAGradientLayer *gradientLayer = [CAGradientLayer layer]; gradientLayer.colors = @[(__bridge id)TCUIColorFromRGB(0x5FCAFF).CGColor, (__bridge id)TCUIColorFromRGB(0x24A7F2).CGColor]; gradientLayer.locations = @[@0.3, @1.0]; gradientLayer.startPoint = CGPointMake(0, 0); gradientLayer.endPoint = CGPointMake(1.0, 0); gradientLayer.frame = CGRectMake(0, 0, 100, 100); gradientLayer.cornerRadius = 50; [lookBtn.layer addSublayer:gradientLayer]; [self.view addSubview:lookBtn];
建一个图层,保证渐变,加到按钮图层即可
此处为用到的宏定义 #define TCUIColorFromRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue &0xFF00) >>8))/255.0 blue:((float)(rgbValue &0xFF))/255.0 alpha:1.0]
效果如下
代码demo地址:https://github.com/jinshuaier/shadow
如果问题,欢迎加我qq 479401910,共同学习,努力进步!
- 图片圆角加阴影 + 按钮的渐变颜色
- iOS 图片圆角加阴影 + 按钮的渐变颜色
- 修改ActionBar的样式(overflow按钮图片修改,AcitonBar背景颜色,去掉ActionBar下面的阴影)
- GDI+ 图片颜色渐变
- android 标题栏颜色渐变和阴影
- 如何生成背景颜色带渐变效果的按钮
- css3文字渐变和阴影、图片边框和边框阴影
- PHP绘制渐变颜色图片
- 按扭渐变颜色图片
- 纯色图片颜色渐变动画
- 倒影图片的遮罩效果即颜色渐变效果
- 有阴影的按钮
- iOS UIButton按钮颜色渐变动画
- toolbar的颜色渐变
- 背景颜色的渐变
- 颜色渐变的Textview
- wpf 文字颜色渐变和阴影 cs代码
- android使用shape画背景阴影、背景颜色渐变
- 学习方法推荐——时间管理
- ubuntu 改 apt-get 为阿里源
- TCP三次握手四次挥手
- Android事件分发机制完全解析,带你从源码的角度彻底理解(上)
- Windows学习总结(16)——Windows注册表入门详解
- 图片圆角加阴影 + 按钮的渐变颜色
- 微信小程序开发第二弹
- ios如何获取手机上已安装的所有应用
- 【python 图像拼接】 微信好友头像下载和拼接技术
- 如何创建一个可执行bat文件
- 常用 Git 命令清单
- oracle 逗号分隔字段拆分,记录下
- 辗转相余求最大公约数
- MAC 打开.bash_profile