自定义UIButton 实现图片和文字 之间距离和不同样式
喜欢交朋友的加:微信号 dwjluck2013
1.UIButton+ImageTitleSpace.h
#import <UIKit/UIKit.h> // 定义一个枚举(包含了四种类型的button)
typedef NS_ENUM(NSUInteger, MKButtonEdgeInsetsStyle) {
MKButtonEdgeInsetsStyleTop, // image在上,label在下
MKButtonEdgeInsetsStyleLeft, // image在左,label在右
MKButtonEdgeInsetsStyleBottom, // image在下,label在上
MKButtonEdgeInsetsStyleRight // image在右,label在左
}; @interface UIButton (ImageTitleSpace) /**
* 设置button的titleLabel和imageView的布局样式,及间距
*
* @param style titleLabel和imageView的布局样式
* @param space titleLabel和imageView的间距
*/
- (void)layoutButtonWithEdgeInsetsStyle:(MKButtonEdgeInsetsStyle)style
imageTitleSpace:(CGFloat)space; @end
2.UIButton+ImageTitleSpace.m
#import "UIButton+ImageTitleSpace.h" @implementation UIButton (ImageTitleSpace) - (void)layoutButtonWithEdgeInsetsStyle:(MKButtonEdgeInsetsStyle)style
imageTitleSpace:(CGFloat)space {
/**
* 知识点:titleEdgeInsets是title相对于其上下左右的inset,跟tableView的contentInset是类似的,
* 如果只有title,那它上下左右都是相对于button的,image也是一样;
* 如果同时有image和label,那这时候image的上左下是相对于button,右边是相对于label的;title的上右下是相对于button,左边是相对于image的。
*/ // 1. 得到imageView和titleLabel的宽、高
CGFloat imageWith = self.imageView.frame.size.width;
CGFloat imageHeight = self.imageView.frame.size.height; CGFloat labelWidth = 0.0;
CGFloat labelHeight = 0.0;
if ([UIDevice currentDevice].systemVersion.floatValue >= 8.0) {
// 由于iOS8中titleLabel的size为0,用下面的这种设置
labelWidth = self.titleLabel.intrinsicContentSize.width;
labelHeight = self.titleLabel.intrinsicContentSize.height;
} else {
labelWidth = self.titleLabel.frame.size.width;
labelHeight = self.titleLabel.frame.size.height;
} // 2. 声明全局的imageEdgeInsets和labelEdgeInsets
UIEdgeInsets imageEdgeInsets = UIEdgeInsetsZero;
UIEdgeInsets labelEdgeInsets = UIEdgeInsetsZero; // 3. 根据style和space得到imageEdgeInsets和labelEdgeInsets的值
/**
MKButtonEdgeInsetsStyleTop, // image在上,label在下
MKButtonEdgeInsetsStyleLeft, // image在左,label在右
MKButtonEdgeInsetsStyleBottom, // image在下,label在上
MKButtonEdgeInsetsStyleRight // image在右,label在左
*/
switch (style) {
case MKButtonEdgeInsetsStyleTop:
{
imageEdgeInsets = UIEdgeInsetsMake(-labelHeight-space/2.0, , , -labelWidth);
labelEdgeInsets = UIEdgeInsetsMake(, -imageWith, -imageHeight-space/2.0, );
}
break;
case MKButtonEdgeInsetsStyleLeft:
{
imageEdgeInsets = UIEdgeInsetsMake(, -space/2.0, , space/2.0);
labelEdgeInsets = UIEdgeInsetsMake(, space/2.0, , -space/2.0);
}
break;
case MKButtonEdgeInsetsStyleBottom:
{
imageEdgeInsets = UIEdgeInsetsMake(, , -labelHeight-space/2.0, -labelWidth);
labelEdgeInsets = UIEdgeInsetsMake(-imageHeight-space/2.0, -imageWith, , );
}
break;
case MKButtonEdgeInsetsStyleRight:
{
imageEdgeInsets = UIEdgeInsetsMake(, labelWidth+space/2.0, , -labelWidth-space/2.0);
labelEdgeInsets = UIEdgeInsetsMake(, -imageWith-space/2.0, , imageWith+space/2.0);
}
break;
default:
break;
} // 4. 赋值
self.titleEdgeInsets = labelEdgeInsets;
self.imageEdgeInsets = imageEdgeInsets;
} @end
3.使用
1.导入头文件
#import "UIButton+ImageTitleSpace.h"
2.在懒加载 按钮中调用
// 图片标题
- (UIButton *)imageTitleButton
{
if (!_imageTitleButton) {
_imageTitleButton = [[UIButton alloc]initWithFrame:CGRectZero];
_imageTitleButton.backgroundColor = [UIColor blackColor];
[_imageTitleButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[_imageTitleButton setImage:[UIImage imageNamed:@"nv"] forState:UIControlStateNormal];
_imageTitleButton.titleLabel.font = [UIFont systemFontOfSize:ImageTitleButtonFontSize];
//懒加载按钮中 调用即可
[_imageTitleButton layoutButtonWithEdgeInsetsStyle:MKButtonEdgeInsetsStyleLeft imageTitleSpace:]; [_imageTitleButton setContentEdgeInsets:UIEdgeInsetsMake(, , , )];
_imageTitleButton.clipsToBounds = YES;
_imageTitleButton.layer.cornerRadius = ;
_imageTitleButton.alpha = 0.5; }
return _imageTitleButton;
}
自定义UIButton 实现图片和文字 之间距离和不同样式的更多相关文章
- UIButton的图片和文字相对位置调整
通常.假设直接设置UIButton的图片和文字,默认的两者相对位置可能不是我们想要的,那么须要进行调整. 须要用到的函数例如以下: UIEdgeInsetsMake(CGFloat top, CGFl ...
- 更改控件中DrawableLeft图片的大小,图片与文字的距离
Drawable drawable=getResources().getDrawable(R.drawable.xx); //获取图片 drawable.setBounds(left, top, ri ...
- UIButton上图片和文字的位置调整
UIButton 上默认是图片在左文字在右,而大多数情况这样默认的的显示形式都不能满足我们的需求,接下来我就这个问题分享一下我的心得. 默认情况下,不设置的效果,都是居中实现 UIButton *bu ...
- Android 自定义Android带图片和文字的ImageButton
经过分析,上述按钮效果实际上就是一个布局,一个最简单不过的垂直线性布局,上部分是一个ImageView,下部分是一个TextView,这个布局可点击.可设置监听. 我们首先要编写自己的ImageBut ...
- iOS开发小技巧--修改按钮内部图片和文字之间的间距(xib)
调整按钮的Edge属性,选择调整图片的Edge还是label的Edge,如图:
- UIButton左边图片右边文字的做法
UIImage *yuyinImage = [UIImage imageNamed:@"yuyin.png"]; [soundButton setImage:yuyinImage ...
- UIButton和UINavigationItem设置图片和文字位置
1.UIButton设置文字位置 有些时候我们想让UIButton的title居左对齐,我们设置 btn.textLabel.textAlignment = UITextAlignmentLeft 是 ...
- Android 巧妙实现图片和文字布局
之前写过一个博客是关于实现图片和文字左右或者上下布局的方法, 下面是博客的主要内容: 布局文件很简单,用来展示RadioButton的使用方法. 1 <?xml version="1. ...
- android TextView 例子代码(文字图片、文字省略、文字滚动)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...
随机推荐
- machine learning for hacker记录(3) 贝叶斯分类器
本章主要介绍了分类算法里面的一种最基本的分类器:朴素贝叶斯算法(NB),算法性能正如英文缩写的一样,很NB,尤其在垃圾邮件检测领域,关于贝叶斯的网上资料也很多,这里推荐那篇刘未鹏写的http://mi ...
- OC浅析一
Objective-C是一门简单的语言,95%是C.只是在语言层面上加了些关键字和语法.真正让Objective-C如此强大的是它的运行时.它很小但却很强大.它的核心是消息分发. 在Objective ...
- UIView封装动画--iOS利用系统提供方法来做转场动画
UIView封装动画--iOS利用系统提供方法来做转场动画 UIViewAnimationOptions option; if (isNext) { option=UIViewAnimationOpt ...
- Codeforces Round #407 (Div. 1) B. Weird journey —— dfs + 图
题目链接:http://codeforces.com/problemset/problem/788/B B. Weird journey time limit per test 2 seconds m ...
- 记录下 hubot相关
适配器工厂https://hubot.github.com/docs/adapters/ 自己写适配器https://hubot.github.com/docs/adapters/developmen ...
- gzhu 2013 Good Sequence 解题报告
题目链接:(这个是内网的网址) http://172.22.27.1/problem?pid=1013 Good Sequence Time Limit: 4000/2000 MS (Java/Ot ...
- IOC入门1
1.配置文件 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http:/ ...
- BZOJ_4010_[HNOI2015]菜肴制作_拓扑排序+贪心
BZOJ_4010_[HNOI2015]菜肴制作_拓扑排序+贪心 Description 知名美食家小 A被邀请至ATM 大酒店,为其品评菜肴. ATM 酒店为小 A 准备了 N 道菜肴,酒店按照为菜 ...
- BZOJ_2901_矩阵求和_前缀和
BZOJ_2901_矩阵求和_前缀和 Description 给出两个n*n的矩阵,m次询问它们的积中给定子矩阵的数值和. Input 第一行两个正整数n,m. 接下来n行,每行n个非负整数,表示第一 ...
- codevs 4768跳石头
传送门 4768 跳石头 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 一年一度的“跳石头”比赛又要开始了! 这项比赛将在 ...