图像和文本按钮使用自动布局约束垂直对齐
我对IOS开发和AutoLayout非常陌生。 我面临着使用Storyboard来对齐UIbutton中的图像和文本的问题。 我曾尝试使用TitleEdgeinset和ImageEdge插入符来实现它，以便将标题（文本）垂直居中置于图像下方。 但问题是我有3个类似的垂直堆栈（StackView）按钮，并且文本是动态设置的，因为我们有本地化的字符串（包括阿拉伯语rtl）。 图像和文字根据文字长度移动。 有没有什么办法可以实现所有按钮的图像和文字垂直均匀分布。另外，如果使用边缘插页，不同的屏幕分辨率目前还没有工作。 感谢你的帮助 。 提前致谢。
几天前，我解决了类似的问题，试试这个
private func adjustImageAndTitleOffsetsForButton (button: UIButton) {
let spacing: CGFloat = 6.0
let imageSize = button.imageView!.frame.size
button.titleEdgeInsets = UIEdgeInsetsMake(0, -imageSize.width, -(imageSize.height + spacing), 0)
let titleSize = button.titleLabel!.frame.size
button.imageEdgeInsets = UIEdgeInsetsMake(-(titleSize.height + spacing), 0, 0, -titleSize.width)
}
为每个按钮调用此方法
self.adjustImageAndTitleOffsetsForButton(yourButton)
我修改了Ajay的答案，因为我的图片没有居中：
func centerButtonImageAndTitle(button: UIButton) {
let spacing: CGFloat = 5
let titleSize = button.titleLabel!.frame.size
let imageSize = button.imageView!.frame.size
button.titleEdgeInsets = UIEdgeInsets(top: 0, left: -imageSize.width, bottom: -(imageSize.height + spacing), right: 0)
button.imageEdgeInsets = UIEdgeInsets(top: -(titleSize.height + spacing), left: -imageSize.width/2, bottom: 0, right: -titleSize.width)
}
这是一个适合我的解决方案。 只需在故事板中将按钮类设置为HorizontallyCenteredButton ，并根据需要设置标题和图像顶部和底部的插图（将图像放置为高于标题），并且该按钮将自动调整水平插入，以使图像居中在标题上方。
class HorizontallyCenteredButton: LocalizedButton {
override func awakeFromNib() {
super.awakeFromNib()
self.contentHorizontalAlignment = .left
}
override func layoutSubviews() {
super.layoutSubviews()
self.centerButtonImageAndTitle()
}
func centerButtonImageAndTitle() {
let size = self.bounds.size
let titleSize = self.titleLabel!.frame.size
let imageSize = self.imageView!.frame.size
self.imageEdgeInsets = UIEdgeInsets(top: self.imageEdgeInsets.top, left: size.width/2 - imageSize.width/2, bottom: self.imageEdgeInsets.bottom, right: 0)
self.titleEdgeInsets = UIEdgeInsets(top: self.titleEdgeInsets.top, left: -imageSize.width + size.width/2 - titleSize.width/2, bottom: self.titleEdgeInsets.bottom, right: 0)
}
}
上一篇: Button with Image and Text vertically aligned using autolayout constraints