请看这张图片：
1' 问题：我想在 iPhone SE、8、8 Plus 和 X 中构建它，但我做不到。
2' 问题：我使用图像和文本插图将中心图像放置在文本上方。改变iPhone的设计，改变按钮的比例，也会改变文字和图像的排列？
谢谢。
【问题讨论】：
horizontal 模式下使用UIStackView 来包含图像和文本。然后，您可以将这些添加到其他 UIStackView 视图以生成网格，最终允许您将最外面的 UIStackView 约束到超级视图的中心。从那里您可以为不同的设备/布局生成特征或直接操作约束
标签： ios xcode9 ios-autolayout
以UIImageView 和UILabel 开头。将宽度（或高度）限制为所需的值（稍后将用于更改图像的大小）。在UIImageView 中添加“纵横比约束”并对其进行适当约束（我使用了1:1 的比率/乘数，您需要根据您的原始图像计算它
同时选择UIImageView 和UILabel 并在UIStackView 中“换行”
根据您的需要调整UIStackView 的属性
我使用上面的方法让文本或图像变大而不限制其他元素
好的，有趣的部分。复制并粘贴UIStackView，将第二个UIStackView 对齐到第一个下方，这样它就会生成一个“列”。选择两者并换成另一个UIStackView
更新新UIStackView的属性...
再次强调，我的重点是让每个小组在不限制其他小组的情况下扩展
现在我有一个看起来像...的容器
好的，现在复制这个新的UIStackView 并粘贴它，与后缘对齐（这并不重要，但它会更容易描述）——这将为您提供一个 2x2 的网格。选择最上面的两个UIStackViews，然后再次包裹另一个UIStackView
我再次将UIStackView 属性修改为Aligment 为Center 和Distribution 为Equal Centering
好的，现在来找点乐子。选择UIImageViews中的三个（我个人使用顶部/左侧的作为master）并移除它们的约束（可以使用“Selected View/Clear Constraints”选项）
选择“干净”UIImageViews 之一和Control+拖动到“主”UIImageView 并添加宽度和高度约束，因此它们将等于主的 p>
hint-你可以按住Command来选择多个约束
重复其他两个“干净”UIImageViews
我知道将最顶部的UIStackView 约束到视图的中心，或者您可以以任何其他方式约束它，但这使其成为主要锚点。
好吧，现在您只需要更新一个约束即可更新所有图像！
试试看。选择“主”UIImageView，找到它的width 约束（您可能需要转到属性表）并将其常量更改为其他值。所有UIImageViews 都应该更新！
此时，我会将此约束绑定到 UIViewController，以便您可以在代码中对其进行修改。
这是一个很好的问题，您的选择可能会有所不同，但是，我选择以这种方式构建它，以便在文本值不同宽度时，列将保持相互输入。
哦，我多么希望！好的，这不是一个“坏”的解决方案，但它确实需要一些思考以及如何布置它，不要问我如果文本分成多行会发生什么 - 因为它不漂亮。
“不同”的方法可能是使用UIView 或容器视图，然后尝试以某种有意义的方式生成图像之间的约束（水平和垂直对齐）以及图像之间的文本约束，但是这变得非常复杂非常快......
那么如何将它们与父视图对齐？这就是为什么我会使用 UIView 或容器视图的原因，但随后它变得更加复杂，因为您需要停止 API 定义它自己的约束并确保您对顶部、底部、前导和后缘
当文本比图像长/短时会发生什么？！所以如果你只有一些基本的文本，那么上面的内容应该可以很好地工作并且应该可以合理地维护。
【讨论】：
1' 问题：我想在 iPhone SE、8、8 Plus 和 X 中构建它，但我做不到。
=> 为什么？你有什么问题？
2'：使用 stackview 可以，但是触摸时没有效果。您可以创建一个 CustomButton 类：
class ImageTopButton: UIButton
{
override func layoutSubviews()
{
super.layoutSubviews()
let size = self.frame.size
let imageSize = self.imageView!.intrinsicContentSize
let labelSize = self.titleLabel!.intrinsicContentSize
let totalHeight = imageSize.height + labelSize.height
let heightDiff = size.height - totalHeight
let padding = heightDiff / 2
let verticalPading:CGFloat = 10
self.imageView!.center = CGPoint(x: size.width / 2, y: imageSize.height / 2 + padding - verticalPading/2)
self.titleLabel!.center = CGPoint(x: size.width / 2, y: imageSize.height + padding + labelSize.height / 1.5 + verticalPading/2)
}
}
【讨论】：