【问题标题】:Dynamic height for ScrollView content not workingScrollView 内容的动态高度不起作用
【发布时间】:2021-04-13 12:44:04
【问题描述】:

我的ScrollView 中的内容有时比屏幕短,有时比屏幕长。如果内容太短,我会尝试将内容拉伸到底部,但无论我做什么,内容都会保持简短:

这就是代码的样子:

struct ContentView: View {
    var body: some View {
        ScrollView {
            VStack {
                Text("Header")
                    .padding()
                VStack {
                    Text("Content")
                    Image(systemName: "bell")
                    Spacer()
                }
                .padding()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .background(Color(.systemBackground))
            }
        }
        .background(Color.yellow.ignoresSafeArea())
    }
}

我本来希望VStack 中的Spacer() 将其延伸到最后。或者maxHeight: .infinity 也可以帮助我,但即使ScrollView 是屏幕高度(因为它上面的黄色背景),内容总是很短。当一个屏幕显示出很大的差距时,这在 iPad 上会成为一个更大的问题。对于各种屏幕高度如何解决?

【问题讨论】:

  • scrollview内容高度不能自己设置为不定高度,我相信这就是为什么VStack中的Spacer没有可见效果的原因。如果您希望所有内容在屏幕底部都是白色的。尝试为滚动视图本身(而不是内容)设置显式高度,或使其成为背景颜色的叠加层(只需尝试几件事)。
  • 这是否回答了您的问题stackoverflow.com/a/62878812/12299030
  • SwiftUI 的一般规则在 ScrollView 中是不一样的 我不确定 Apple 是否想要那么顺从!但是对于您的信息,空间在 ScrollView 或颜色中不起作用,请不要填满!我们必须给他们高度,如果你还记得的话,我建议开发你自己的自定义滚动视图来节省这个时间来寻找苹果滚动视图的错误。制作 customScrollView 将花费更少的时间来尝试修复 ScrollView 的问题。
  • @Asperi 我确实研究了这个答案并尝试了它,并且确实让我更接近。仍然有一个差距,所以似乎需要为安全区调整数字,但更重要的是,视图在稳定之前重新渲染了 9 次,所以我希望我错过了一些简单的垫片,但看起来不像它没有这种级别的解决方法是可能的。

标签: swiftui


【解决方案1】:

使用@CenkBilgen 的使用叠加层的想法 + GeometryReader,您可以执行以下操作:

struct ContentView: View {
    var body: some View {
        Color.clear
            .overlay(GeometryReader { geo in
                ScrollView {
                    VStack {
                        ForEach(1..<10) {
                            Text("\($0)").padding()
                        }
                    }
                    HStack { Spacer() }
                }
                .clipped()
                .frame(width: geo.size.width, height: geo.size.height)
            })
    }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-03-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-04-02
    相关资源
    最近更新 更多