iOS15开始UIButton官方提供了更为友好的设置内边距的方式。
但是iOS15以下的版本我们还得维护。故在2024年作为iOS开发者掌握按钮的内边距设置方法还是必要的。正文开始。
默认图片左,文本右。设置图片位置使用imageEdgeInsets,文本位置使用titleEdgeInsets。
关于UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)上下左右写“正值”还是“负值”弄不清楚。即使做了10年的iOS开发,也是能绕开就绕开。通常使用UIImageView,UILbale 做图片和文字,上边盖一个透明按钮。
一句话解释如何设置内边距。
箭头就是内边距。箭头越大内边距就越大,内边距“增加” 就是“正值”。反之是“负值”。
所以图片向右移动10个点,相当于,距离左边的内边距增加,left = +10,距离右边的内边距减10,right = -10。如下:
UIEdgeInsets(top: 0, left: 10, bottom: 0, right: -10)。
“图片”和“文本”左右位置互换。图片向右移动了“文本”的距离,同时,文本向左移动了“图片”的距离。
以下是一个oc demo
以下swift工具类,直接用就行。
import UIKit
enum buttonStyle {
case imgLeft,imgRight,imgTop,imgBottom
}
extension UIButton {
func layoutBtn(space:CGFloat,style:buttonStyle){
let imgW = imageView?.frame.width ?? 0.0
let imgH = imageView?.frame.height ?? 0.0
let titleLableW = titleLabel?.frame.width ?? 0.0
let titleLableH = titleLabel?.frame.height ?? 0.0
switch style {
case .imgLeft:
imageEdgeInsets = UIEdgeInsets(top: 0, left: -space/2.0, bottom: 0, right: space/2.0)
titleEdgeInsets = UIEdgeInsets(top: 0, left: space/2.0, bottom: 0, right: -space/2.0)
case .imgRight:
imageEdgeInsets = UIEdgeInsets(top: 0, left: titleLableW+space/2.0, bottom: 0, right:-titleLableW-space/2.0)
titleEdgeInsets = UIEdgeInsets(top: 0, left: -imgW-space/2.0, bottom: 0, right: imgW+space/2.0)
case .imgTop:
imageEdgeInsets = UIEdgeInsets(top: -titleLableH-space/2.0, left: titleLableW/2, bottom: 0, right:-titleLableW/2)
titleEdgeInsets = UIEdgeInsets(top: 0, left: -imgW/2, bottom: -imgH-space/2.0, right: imgW/2)
case .imgBottom:
imageEdgeInsets = UIEdgeInsets(top: titleLableH+space/2.0, left: titleLableW/2, bottom: 0, right:-titleLableW/2)
titleEdgeInsets = UIEdgeInsets(top: 0, left: -imgW/2, bottom: imgH+space/2.0, right: imgW/2)
}
}
}