19

目前正在构建一个聊天应用程序,我需要新消息出现在屏幕底部。我还需要让消息与底部对齐。但是,在 ScrollView 中使用 VStack 默认情况下具有顶部对齐功能。

忙碌的 swiftui

    ScrollView {
        VStack(alignment: .leading, spacing: 16) {
            Spacer()
            .frame(minWidth: 0, maxWidth: .infinity, minHeight:0, maxHeight: .infinity, alignment: Alignment.topLeading)
            ForEach(notList, id: \.self) { not in
                NotRow(not: not)
                    
            }
            
        }
        .padding()
        .frame(minWidth: 0, maxWidth: .infinity, minHeight:0, alignment: Alignment.topLeading)
        
    }

我应该怎么做才能解决这个问题?

4

5 回答 5

7

回答这个问题有点晚了,但它可能会帮助其他人。您可以使用一个很好的旧双旋转技巧来实现您想要的结果。其他解决方案不起作用,因为滚动视图内的最大大小未定义,因为它取决于其子视图来计算其自己的内容大小。

ScrollView {
  VStack(alignment: .leading, spacing: 16) {
      Spacer()
      .frame(minWidth: 0, maxWidth: .infinity, minHeight:0, maxHeight: .infinity, alignment: Alignment.topLeading)
      ForEach(notList, id: \.self) { not in
          NotRow(not: not)
      }

  }
  .padding()
  .rotationEffect(Angle(degrees: 180))
}
.rotationEffect(Angle(degrees: 180))
于 2020-08-28T13:52:43.367 回答
4

我认为您在 VStack 中缺少 maxHeight

VStack(alignment: .leading) {
  Spacer().frame(maxWidth: .infinity)
  // content here
}
.frame(maxHeight: .infinity) // <- this
于 2020-01-22T00:32:02.480 回答
4

ScrollView没有向它的孩子(VStack在这种情况下)提出与向它提出的高度相同的高度。它只是要求最小的尺寸。解决方案是让其直接子代以建议给自己的最小高度ScrollView做出响应。我们可以通过阅读建议的高度GeometryReader并将其设置为孩子的最小高度来实现这一点。

GeometryReader { reader in
    ScrollView {
        VStack {
            /// Spacer() or Color.red will now behave as expected
        }
        .frame(minHeight: reader.size.height)
    }
}
于 2021-03-02T14:31:12.220 回答
3

如果您将其删除Spacer()并放在您的右括号之后ForEach,它将修复它。更新后的代码如下所示:

ScrollView {
        VStack(alignment: .leading, spacing: 16) {
            .frame(minWidth: 0, maxWidth: .infinity, minHeight:0, maxHeight: .infinity, alignment: Alignment.topLeading)
            ForEach(notList, id: \.self) { not in
                NotRow(not: not)

            }
            Spacer()
        }
        .padding()
        .frame(minWidth: 0, maxWidth: .infinity, minHeight:0, alignment: Alignment.topLeading)

    }
于 2020-01-25T19:20:32.177 回答
0

尝试将所有Alignment.topLeadings 更改为Alignment.bottomLeading

于 2019-10-30T12:42:05.080 回答