UI:UIButton中setTitleEdgeInsets和setImageEdgeInsets的使用

本文详细介绍了UIButton中图片和文本的布局原理及调整方法。包括不同宽度情况下的显示样式、子控件位置调整技巧等。

实质上UIButton中是内置的两个控件imageView和titleLabel,可以用来显示图片(非背景图片)和文本。

所以UIButton 中可以添加image和text,默认情况下,text显示在image的右边,且二者y值都居中显示(依赖于button的contentHorizontalAlignment:居左、居右、居中)。


显示格式区分:

1.当button.width < image.width时,只显示被压缩后的图片,图片是按照fillXY的方式压缩。

2.当button.width > image.width,且button.width < (image.width+text.width)时,图片正常显示,文本被压缩。

3.当button.width > (image.width+text.width)时,两者并列默认居中显示,可通过button的属性contentHorizontalAlignment改变对齐方式。


想改变两个子控件的显示位置,可以分别通过setTitleEdgeInsets和setImageEdgeInsets来实现。对titleLabel和imageView设置偏移是针对他当前的位置起作用的,并不是针对距离button边框的距离的。

typedef NS_ENUM(NSInteger, UIControlContentHorizontalAlignment) {

    UIControlContentHorizontalAlignmentCenter = 0,//居中

    UIControlContentHorizontalAlignmentLeft   = 1,//居左

    UIControlContentHorizontalAlignmentRight  = 2,//居右

    UIControlContentHorizontalAlignmentFill   = 3,//

};

(1)居中


(2)居左


(3)居右


(4)充满


初始条件:此时的size如图,(居左状态)


想要让图片和文本上下排列,需要让image向下偏移(距离上面的间隙),向右偏移(button.width - image.width/2)。(向左和向上偏移传负值)

title向下偏移(图片的高度+间隙),向右偏移((button.width - image.width)/2 - image.width),因为文本本身的其实x位置是从image.width开始的,所以计算偏移时要减掉这个宽度。


效果如图:



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值