iOS UIButton中图片和文字位置

如何布局包含ImageTitleUIButton

UIButton中的titleEdgeInsetsimageEdgeInsets可以管理buttonimagetitle的布局。 

1.默认情况下,是图片在左,文字在右,垂直居中显示,如下图:

button.titleEdgeInsets = UIEdgeInsetsZero;

button.imageEdgeInsets = UIEdgeInsetsZero;


1

2.设置如下布局后,图片和文字都居中显示。

button.titleEdgeInsets = UIEdgeInsetsMake(0,-button.imageView.frame.size.width,0,0);

// button.imageEdgeInsets = UIEdgeInsetsMake(0,0,0,-button.titleLabel.frame.size.width);

// 由于iOS8中titleLabel的size为0,用上面这样设置有问题,修改一下即可

button.imageEdgeInsets = UIEdgeInsetsMake(0,0,0,-button.titleLabel.intrinsicContentSize.width);


2

3.如果想图片在上,文字在下,水平居中显示,则按下面设置即可:

button.titleEdgeInsets = UIEdgeInsetsMake(0,-button.imageView.frame.size.width,-button.imageView.frame.size.height,0);

// button.imageEdgeInsets = UIEdgeInsetsMake(-button.titleLabel.frame.size.height,0,0,-button.titleLabel.frame.size.width);

// 由于iOS8中titleLabel的size为0,用上面这样设置有问题,修改一下即可

button.imageEdgeInsets = UIEdgeInsetsMake(-button.titleLabel.intrinsicContentSize.height,0,0,-button.titleLabel.intrinsicContentSize.width);


3

4.如果觉得图片和文字离的太近了,稍微分开一点:

CGFloat offset = 40.0f;

button.titleEdgeInsets = UIEdgeInsetsMake(0,-button.imageView.frame.size.width,-button.imageView.frame.size.height-offset/2,0);

// button.imageEdgeInsets = UIEdgeInsetsMake(-button.titleLabel.frame.size.height-offset/2,0,0,-button.titleLabel.frame.size.width);

// 由于iOS8中titleLabel的size为0,用上面这样设置有问题,修改一下即可

button.imageEdgeInsets = UIEdgeInsetsMake(-button.titleLabel.intrinsicContentSize.height-offset/2,0,0,-button.titleLabel.intrinsicContentSize.width);


4

5.文字左对齐,图片右对齐

button.titleEdgeInsets = UIEdgeInsetsMake(0,-button.imageView.frame.size.width - button.frame.size.width + button.titleLabel.intrinsicContentSize.width,0,0);

    button.imageEdgeInsets = UIEdgeInsetsMake(0,0,0,-button.titleLabel.frame.size.width - button.frame.size.width + button.imageView.frame.size.width);


5
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容