前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >iOS-自定义 UIButton-文字在左、图片在右(一)

iOS-自定义 UIButton-文字在左、图片在右(一)

作者头像
用户1890628
发布2018-05-10 14:12:55
2.9K0
发布2018-05-10 14:12:55
举报
文章被收录于专栏:Objective-CObjective-C

1. 系统默认 Button 添加图片文字样式(见下图):

Button默认状态图片文字位置.png

2. 现在想实现如下效果(见下图):

自定义Button图片在右边 文字在左边的效果.png

3. 实现代码

  1. 自定义 HQCustomButton 继承自 UIButton,重写layoutSubviews方法(见如下代码): #import "HQCustomButton.h" @implementation HQCustomButton - (void)layoutSubviews { [super layoutSubviews]; /** 修改 title 的 frame */ // 1.获取 titleLabel 的 frame CGRect titleLabelFrame = self.titleLabel.frame; // 2.修改 titleLabel 的 frame titleLabelFrame.origin.x = 0; // 3.重新赋值 self.titleLabel.frame = titleLabelFrame; /** 修改 imageView 的 frame */ // 1.获取 imageView 的 frame CGRect imageViewFrame = self.imageView.frame; // 2.修改 imageView 的 frame imageViewFrame.origin.x = titleLabelFrame.size.width; // 3.重新赋值 self.imageView.frame = imageViewFrame; } @end
  2. 在创建 Button 的地方用自定义 HQCustomButton 创建即可(见如下代码): HQCustomButton *button01 = [[HQCustomButton alloc] init]; button01.titleLabel.font = [UIFont systemFontOfSize:14]; [button01 setTitle:@"科室" forState:UIControlStateNormal]; UIImage *imageBtn01 = [UIImage imageNamed:@"YellowDownArrow"]; [button01 setImage:imageBtn01 forState:UIControlStateNormal]; [view addSubview:button01]; [button01 mas_makeConstraints:^(MASConstraintMaker *make) { make.centerY.equalTo(view); make.left.equalTo(view).offset(kScreenWidth / 8); }];

4. 实现效果(见下图):

实现效果.png

特别提示:

在重写 HQCustomButton(自定义 Button)的layoutSubviews时候一定要先调用[super layoutSubviews];方法,不然按钮会显示不出来(见下图):

一定要先调用[super layoutSubviews].png

不掉用[super layoutSubviews]会出现的问题.png

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016.07.17 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档