iPhone开发-UIButton setImage的同时也显示title

简介: <p style="color:rgb(51,51,51); font-family:Arial; font-size:14px; line-height:26px"> <span style="color:rgb(84,82,82); font-family:Abel,Verdana,Geneva,sans-serif; line-height:25.200000762939453px

想要做一个按钮,按钮上半部分显示图片(Image),下半部分显示文字(Title)(文字位置不固定),显示效果如下图:


UIButton有两个设置Image的方法,一个是setImage,一个是setBackgroundImage。到底用哪个方法呢,既然不确定,那就测试下,看看哪个符合自己的要求。

1.先测试setImage方法,在IB(xib或storyboard)中拖拽一个UIbutton控件,之后设置Image属性,如下图:


之后看刚才拖拽的UIButton控件的样式,如下图:


无论你怎么放大这个按钮,按钮中的图片的大小是不会随之变化的(当然缩小按钮,图片会随之压缩)。

如果不喜欢IB的朋友,可以用代码实现,代码如下:

[objc]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(3030100100)];  
  2. [btn setImage:[UIImage imageNamed:@"add_album"] forState:UIControlStateNormal];  

2.测试setBackgroundImage方法,选中刚才的button控件,之后删除Image的内容,在Background中添加图片名称,如下图:

之后观察按钮,发现按钮样式变为

放大按钮,图片也随之放大。

代码实现如下

[objc]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(3030100100)];  
  2. [btn setBackgroundImage:[UIImage imageNamed:@"add_album"] forState:UIControlStateNormal];  

经过上面测试,发现用setImage方法设置的图片,图片不会随着按钮的放大而放大,图片始终是原始图片尺寸,而用setBackgroundImage方法设置的图片,图片会随着按钮的变大而拉伸变大。这里我选择了第一种方法,各位看官,请随意。

那么如何设置按钮Title的位置,让其显示在底部呢,Title默认是居中显示。这就要用到inset属性了,先选中按钮,之后在Edge的选项中选择Title,之后调节Inset的Top和Left等参数,使其Title位置在底部。如下图:


这样就完成了按钮title和按钮图片位置自定义的效果了。

代码实现设置inset:

[objc]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(3030100100)];  
  2.     [btn setImage:[UIImage imageNamed:@"add_album"] forState:UIControlStateNormal];  
  3.     [btn setTitle:@"Title" forState:UIControlStateNormal];  
  4.    //[btn setImageEdgeInsets:(UIEdgeInsets)]  
  5.     [btn setTitleEdgeInsets:UIEdgeInsetsMake(75, -1900)];  
  6.     [self.view addSubview:btn];  

另:如果不喜欢调整Inset,可以在按钮上放置个Label,把按钮自带的Title设置为空,用Label冒充Title,调整Label的frame,同样可以实现这个效果。

目录
相关文章
|
28天前
|
数据采集 iOS开发 Python
Chatgpt教你开发iPhone风格计算器,Python代码实现
Chatgpt教你开发iPhone风格计算器,Python代码实现
|
Shell iOS开发
iOS逆向:tweak开发教程(iPhone/tool)
iOS逆向:tweak开发教程(iPhone/tool)
997 0
iOS逆向:tweak开发教程(iPhone/tool)
|
编解码 iOS开发
iphone 开发的基本入门知识
iphone 开发的基本入门知识
199 0
「镁客早报」iPhone或将在今年采用三摄;传Facebook致力于开发语音助力服务与亚马逊、苹果竞争
亚马逊向美国Alexa设备推免费音乐服务;视频会议软件开发商Zoom纳斯达克上市。
256 0
|
Web App开发 缓存 开发工具