如何解决SwiftUI-如何停止ScrollView在其他视图后面接收水龙头
我在LazyVStack
内有一个ScrollView
,它位于一个较小的视图(图像中的黄色视图)下方。
问题在于,当向上滚动网格时,单元格仍然可以通过黄色视图接收水龙头,这是我真正不想要的。我想在该视图中进行搜索TextField
,触摸变得混乱,用户体验一团糟。在示例代码中,我添加了一个按钮以交换到List
,以检查其是否具有相同的滚动问题。不是。
import SwiftUI
struct ContentView: View {
@State private var useList = false
@State private var gridLayout: [GridItem] = [GridItem(.flexible()),GridItem(.flexible()),GridItem(.flexible())]
var data = (0...249).map { "\($0)" }
var body: some View {
NavigationView {
VStack {
TopInfoPane()
if useList {
List(data,id: \.self) { item in
NavigationLink(destination: Text(item)) {
Text(item)
}
}
} else {
ScrollView {
LazyVGrid(columns: gridLayout,alignment: .center,spacing: 8) {
ForEach(data,id: \.self) { item in
NavigationLink(destination: Text(item)) {
Cell(item: item)
}
}
}
}
}
}.navigationBarTitle("Scroller")
.navigationBarItems(trailing: Button(action: { useList.toggle() }) { Text("Swap") })
}
}
}
struct Cell: View {
var item: String
var body: some View {
Text(item)
.frame(minWidth: 0,maxWidth: .infinity,minHeight: 75)
.background(Color.green)
}
}
struct TopInfoPane: View {
var body: some View {
Text("TopInfoPane")
.frame(height: 48)
.frame(minWidth: 0,maxWidth: .infinity)
.background(Color.yellow)
}
}
我尝试将视图上的动画设置为nil并设置.allowsHitTesting(false
),但它们没有帮助。我很茫然,因为我真的没想到ScrollView
仍然会滚动超出其自己的框架。
解决方法
尝试如下裁剪ScrollView
ScrollView {
LazyVGrid(columns: gridLayout,alignment: .center,spacing: 8) {
ForEach(data,id: \.self) { item in
NavigationLink(destination: Text(item)) {
Cell(item: item)
}
}
}
}
.contentShape(Rectangle())
.clipped()
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。