Question

考虑以下示例：

ZStack{
    VStack{
        ForEach(0..100) { elem in
            Button(action: {"do something..."}, label: Text("\(elem)"))
        }
    }

    ScrollView {
        ForEach(0..<100) { elem in 
            Text("\(elem)")
        }    
    }
}

当我将 ScrollView 放在按钮顶部时，ScrollView 不再可滚动。仅在 ScrollView 下没有按钮的位置。是否可以“停用”底层 ZStack 层？我试过 .disable() 但这没有帮助。这不是真实世界的例子。 ScrollView 将显示为一个弹出窗口，因此我需要知道如何解决这个用例。

Answer 1

只需给滚动视图一些高度。否则，scrollView 的高度会变得比屏幕大，所有元素都在里面，所以它变得不可滚动，因为没有任何东西可以滚动。

struct ContentView: View { 
let fullHeight : CGFloat = UIScreen.main.bounds.height
var body: some View {
    ZStack{
        VStack{
            ForEach(0..<100) { elem in
                Button(action: {
                        let _ = print("do something...")
                }, label:{ Text("Buttons \(elem)")  }
                )
            }
        }
        ScrollView {
            ForEach(0..<100) { elem in
                Text("\(elem)")
            }
        } .frame( height: fullHeight , alignment: .center)
    }
       
  }
}

Answer 2

我找到了一个简单的解决方案：

ZStack{
    VStack{
        ForEach(0..100) { elem in
            Button(action: {"do something..."}, label: Text("\(elem)"))
        }
    }

    ScrollView {
        ForEach(0..<100) { elem in 
            Text("\(elem)")
        }    
    }
    .zIndex(1) // <<<<<------ solution
}

ZStack 顶部的 ScrollView

2 个答案: