如何解决在SwiftUI的LazyVGrid中显示提示视图
我在ScrollView的LazyVGrid中有很多按钮。我试图在单击的按钮上方显示一个提示视图(如键盘弹出窗口)。我不知道如何捕捉ScrollView按钮的位置。除了需要帮助选择合适的手势来完成任务之外。
图形表示...
这是我的代码:
struct ShowHint: View {
@State var ispressed: Bool = false
var columns: [GridItem] = Array(repeating: .init(.flexible()),count: 5)
var body: some View {
ZStack{
if ispressed {
ShowOnTopOfButton().zIndex(1)
}
ScrollView(showsIndicators: false) {
LazyVGrid(columns: columns,spacing: 30) {
ForEach(0..<500) { i in
Text("\(i)")
.padding(.vertical,10)
.frame(maxWidth: .infinity)
.background(Color.red.opacity( ispressed ? 0.5 : 0.9))
.gesture(TapGesture()
//.onStart { _ in ispressed = true } //but there is no property like this!
.onEnded { _ in ispressed = !ispressed }
)
}
}
}
.padding(.top,50)
.padding(.horizontal,10)
}
}
}
struct ShowOnTopOfButton: View {
var theS: String = "A"
var body: some View {
vstack {
Text("\(theS)")
.padding(20)
.background(Color.blue)
}
}
}
解决方法
这是可能的解决方案-想法是将提示视图显示为轻击元素的叠加。
通过Xcode 12 / iOS 14测试
struct ShowHint: View {
@State var pressed: Int = -1
var columns: [GridItem] = Array(repeating: .init(.flexible()),count: 5)
var body: some View {
ZStack{
ScrollView(showsIndicators: false) {
LazyVGrid(columns: columns,spacing: 30) {
ForEach(0..<500) { i in
Text("\(i)")
.padding(.vertical,10)
.frame(maxWidth: .infinity)
.background(Color.red.opacity( pressed == i ? 0.5 : 0.9))
.gesture(TapGesture()
.onEnded { _ in pressed = pressed == i ? -1 : i }
)
.overlay(Group {
if pressed == i {
ShowOnTopOfButton()
.allowsHitTesting(false)
}}
)
}
}
}
.padding(.top,50)
.padding(.horizontal,10)
}
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。