以下为截图。
左边的iPhone，其中有3个图像在一行，有相同的高度和正确的长宽比。它是用UIKit实现的。
右边的iPhone，其中有3个图像在一行，有不同的高度和正确的长宽比。它是用SwiftUI实现的。
我想用SwiftUI，来实现
1.所有3张图像的高度相同。
1.所有3张图像的纵横比均正确。
在UIKit中，这就是我如何实现
步骤1：使用水平堆栈视图
let horizontalStackView = UIStackView()
horizontalStackView.axis = .horizontal
horizontalStackView.distribution = .fill
horizontalStackView.alignment = .fill
horizontalStackView.spacing = spacing第2步：根据原始图像尺寸为每个UIImageView分配正确的约束
let imageView = UIImageView()
imageView.contentMode = .scaleAspectFit
let multiplier = CGFloat((Double)(attachment.height) / (Double)(attachment.width))
imageView.heightAnchor.constraint(
equalTo: imageView.widthAnchor,
multiplier: multiplier).isActive = true然而，我不知道如何在SwiftUI中实现类似的想法。到目前为止，这是我如何在正确的iPhone屏幕截图中实现不完美的结果。它们有正确的长宽比。但它们没有相同的高度。
SwiftUI，结果不正确
struct ContentView: View {
var body: some View {
HStack {
VStack(alignment: .leading, spacing: 4) {
HStack(spacing: 2) {
Image("0").resizable().aspectRatio(contentMode: .fit)
Image("3").resizable().aspectRatio(contentMode: .fit)
Image("2").resizable().aspectRatio(contentMode: .fit)
}
Text("Hello, world!")
Spacer(minLength: 0)
}
Spacer(minLength: 0)
}
}
}你知道，我怎样才能在SwiftUI中达到和在UIKit中一样的结果吗？谢谢。
3条答案
按热度按时间xiozqbni1#
调用
frame(minWidth:idealWidth:maxWidth:minHeight:idealHeight:maxHeight:alignment:)并指定maxHeight，这样所有图像的大小都相同。fhity93d2#
为所有图像定义相同的纵横比，如下所示：
您将获得所需的输出
iugsix8n3#
这似乎与您在UIKit上所做的操作相匹配，也就是说，在图像上使用.fill，将水平堆栈限制为固定大小，然后根据设备的宽度乘以所需HStack的纵横比来计算HStack的高度。
这是经过更改的原始代码：
iPhone和iPad的结果是：
第一节第一节第一节第一节第一次
aspectRatio在HStack上似乎不起作用，所以我使用frame（）代替。幻数是使用所需布局的图像（高度/宽度）进行的估计。为了匹配原始图像，还添加了.padding（.leading）。