iPhone开发笔记 (7) 用Layer制作圆角button

原创 2012年03月23日 15:26:07

    制作圆角button的方法很多这里只介绍采用Layer的方法,随让layer效率上实在是不尽如人意,但是效果上绝对没话说。

    下面的代码我是采用imageView加上透明button做的效果。直接修改button的layer我没弄过,不过原理应该差不多。

    先看看效果图

    
UIImageView *imageView1 = [[UIImageView alloc] init];
    imageView1.frame = CGRectMake(23.75, 16.6, 75, 75);
    imageView1.image = [UIImage imageNamed:@"menu1.png"];
    imageView1.layer.MasksToBounds = YES;  
    imageView1.layer.cornerRadius = 10.0; 
    imageView1.layer.borderWidth = 2;  
    imageView1.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor]; 
    imageView1.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];
    
    
    UIImageView *imageView2 = [[UIImageView alloc] init];
    imageView2.frame = CGRectMake(122.5, 16.6, 75, 75);
    imageView2.image = [UIImage imageNamed:@"menu2.png"];
    imageView2.layer.MasksToBounds = YES;  
    imageView2.layer.cornerRadius = 10.0;  
    imageView2.layer.borderWidth = 2;  
    imageView2.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor];  
    imageView2.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];
    
    UIImageView *imageView3 = [[UIImageView alloc] init];
    imageView3.frame = CGRectMake(221.25, 16.6, 75, 75);
    imageView3.image = [UIImage imageNamed:@"menu3.png"];
    imageView3.layer.MasksToBounds = YES;  
    imageView3.layer.cornerRadius = 10.0;  
    imageView3.layer.borderWidth = 2;  
    imageView3.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor];  
    imageView3.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];
    
    UIImageView *imageView4 = [[UIImageView alloc] init];
    imageView4.frame = CGRectMake(23.75, 118.2, 75, 75);
    imageView4.image = [UIImage imageNamed:@"menu4.png"];
    imageView4.layer.MasksToBounds = YES;  
    imageView4.layer.cornerRadius = 10.0;  
    imageView4.layer.borderWidth = 2; 
    imageView4.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor];  
    imageView4.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];
    
    UIImageView *imageView5 = [[UIImageView alloc] init];
    imageView5.frame = CGRectMake(122.5, 118.2, 75, 75);
    imageView5.image = [UIImage imageNamed:@"menu5.png"];
    imageView5.layer.MasksToBounds = YES;  
    imageView5.layer.cornerRadius = 10.0;  
    imageView5.layer.borderWidth = 2; 
    imageView5.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor];  
    imageView5.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];
    
    UIImageView *imageView6 = [[UIImageView alloc] init];
    imageView6.frame = CGRectMake(221.25, 118.2, 75, 75);
    imageView6.image = [UIImage imageNamed:@"menu6.png"];
    imageView6.layer.MasksToBounds = YES;  
    imageView6.layer.cornerRadius = 10.0;  
    imageView6.layer.borderWidth = 2;  
    imageView6.layer.borderColor = [[UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1] CGColor];  
    imageView6.backgroundColor = [UIColor colorWithRed:161/255.0 green:47/255.0 blue:47/255.0 alpha:1];

通过layer设置圆角

  • baohanqing
  • baohanqing
  • 2016年05月16日 09:01
  • 993

按钮圆角设置、html基础css引入

1、按钮圆角设置 .button{       display: inline-block;     position: relative;     margin: 10px;     text-de...
  • ycy0706
  • ycy0706
  • 2017年04月01日 16:20
  • 871

解决layer层圆角引发的性能问题

有两种方式解决 1.使用 shouldRasterize (之前有文章讲过) 2.使用 CAShapeLayer和UIBezierPath 对2举例 - (void)viewDidL...
  • majiakun1
  • majiakun1
  • 2016年01月24日 00:05
  • 1855

Button---圆角的Button

在res目录下的drawable-mdpi建立xml文件shape.xml,如下图所示: shape.xml xml version="1.0" encoding="UTF-8"?> shap...
  • IT1039871366
  • IT1039871366
  • 2013年08月27日 10:54
  • 4420

Android Button 常用属性设置,圆角,边框,点击事件

android:text="QQ"
  • IOS_fresh_monkey
  • IOS_fresh_monkey
  • 2017年03月15日 22:50
  • 2976

Android如何设置圆角按钮

1. 在res目录下的drawable目录下新建shape.xml文件
  • lwcumt
  • lwcumt
  • 2015年07月22日 13:31
  • 18696

android制作圆角button

转载:http://blog.csdn.net/u010850027/article/details/48009461 经常玩儿App的小伙伴都知道,APP上面有很多按钮都是圆角的,...
  • u011403718
  • u011403718
  • 2015年10月09日 17:59
  • 479

button的一些使用小常识(点击效果,button圆角,边框线的实现)

在drawable中创建一个xml的文件: xml version="1.0" encoding="utf-8"?>属性代表绘制的图形形状 retangle;矩形,oval:椭圆 ,line:线 r...
  • guideit
  • guideit
  • 2016年07月22日 15:01
  • 3674

iOS7设置圆角Button

UIButton *roundBtn = [UIButton buttonWithType:UIButtonTypeCustom]; roundBtn.frame = CGRectMake(100,...
  • linfei2707
  • linfei2707
  • 2015年01月27日 14:24
  • 19909

button设置圆角代码----以及一些常用的属性

设置圆角代码: UIButton *btn = [[UIButton alloc]initWithFrame:btnFrame]; // 设置圆角半径 btn.layer.masksToB...
  • cos_sin_tan
  • cos_sin_tan
  • 2015年09月20日 14:56
  • 3212
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:iPhone开发笔记 (7) 用Layer制作圆角button
举报原因:
原因补充:

(最多只允许输入30个字)