填充矩形而不干扰 HStack 的几何形状答案

【问题标题】：Fill Rectangle without disturbing the geometry of HStack填充矩形而不干扰 HStack 的几何形状
【发布时间】：2020-10-06 18:11:42
【问题描述】：

如何填充左侧的黑色矩形以适应红蓝组合的高度。

基本上是黑色而不是像这样在中间，

应填满以占用剩余空间。

HStack(spacing: 1) {
            
            Color.black
                .aspectRatio(contentMode: .fit)
            
            VStack(alignment: .trailing, spacing: 1) {
                
                Color.red
                    .aspectRatio(contentMode: .fit)
                
                Color.blue
                    .aspectRatio(contentMode: .fit)
            }
            
        }

【问题讨论】：

尝试调整黑色 View 的 aspectRatio ，会给你一个结果。 Color.black.aspectRatio(0.49, contentMode: .fit)

标签： ios swift swiftui

【解决方案1】：

这可能是最简单的方法...

var body: some View {
    HStack(spacing: 1) {

        VStack(spacing: 0) {
            Color.clear
                .aspectRatio(contentMode: .fit)
            Color.clear
                .aspectRatio(contentMode: .fit)
        }
        .overlay(Color.black)

        VStack(alignment: .trailing, spacing: 1) {
            Color.red
                .aspectRatio(contentMode: .fit)
            Color.blue
                .aspectRatio(contentMode: .fit)
        }
    }
}

我的另一个答案https://stackoverflow.com/a/60346544/12299030 中提供了带有对齐指南的替代方法。

在我的另一个答案https://stackoverflow.com/a/63165931/12299030 中提供了具有视图偏好的替代方法。

【讨论】：

所以基本上我想将此逻辑应用于图像。就像发布的推文中有许多图像一样，它会在下面显示一个网格，以提供有关它所包含的图像的一些见解。我正在寻找一种使用几何阅读器来做到这一点的解决方案。因此，如果我有 3 张图片，无论大小如何，都应该有一个静态网格，其中一张图片应该占据左侧部分，而另外两张像上面的颜色一样垂直堆叠。
您不需要 GeometryReader。您已经有了网格，并且可以使用上述每种颜色（可以是 .clear）作为叠加图像的支架（填充、剪裁、边框等是可选的）。