swift - SwiftUI 中“触摸输入”的手势
问题描述
我正在使用VStack
. 当用户点击这些视图之一时,它会突出显示。为了让高光在触地时显示,而不是在触地释放时显示,我使用DragGesture
了minimumDistance
值为 的a 0
:
private func highlightGesture(_ i: Int) -> some Gesture {
DragGesture(minimumDistance: 0.0)
.onChanged { _ in highlight = i }
.onEnded { _ in highlight = nil }
}
但是,我希望在用户的拖动手势进入另一个视图时更新突出显示。例如,如果我点击并突出显示第一个视图,然后将手指移到第二个视图而不将其从屏幕上移开,它应该突出显示第二个视图。
使用上面显示的手势,只有在点击视图时才会突出显示视图。相反,我希望在点击或触摸进入视图时突出显示视图。
任何帮助是极大的赞赏。
解决方案
这是一个简单的示例,它显示了一种可能的方式,即在 2 个视图/图像上拖动手指并在进入不同的视图/图像时突出显示它们。你将不得不做更多的工作。希望能帮助到你。
struct ContentView: View {
class ImgObj: ObservableObject {
@Published var img1Rec: CGRect = CGRect.zero
@Published var img2Rec: CGRect = CGRect.zero
@Published var img1Color: Color = .black
@Published var img2Color: Color = .black
}
@ObservedObject var imgObj = ImgObj()
@GestureState var dragVar = CGSize.zero
var body: some View {
let dragger = DragGesture(minimumDistance: 0.0, coordinateSpace: .global)
.updating($dragVar, body: { (value, _, _) in
imgObj.img1Color = imgObj.img1Rec.contains(value.location) ? .red : .black
imgObj.img2Color = imgObj.img2Rec.contains(value.location) ? .red : .black
})
GeometryReader { geometry in
VStack {
Image(systemName: "clock").resizable().frame(width: 222, height: 222)
.foregroundColor(imgObj.img1Color)
.gesture(dragger)
.onAppear {
// use geometry.frame(in: .global) somehow to get the CGRect
imgObj.img1Rec = CGRect(x: 0, y: 0, width: 222, height: 222)
}
Image(systemName: "folder").resizable().frame(width: 222, height: 222)
.foregroundColor(imgObj.img2Color)
.gesture(dragger)
.onAppear {
// use geometry.frame(in: .global) somehow to get the CGRect
imgObj.img2Rec = CGRect(x: 0, y: 222, width: 222, height: 222)
}
}
}
}
}
编辑说明:
代替:
.onAppear {
// use geometry.frame(in: .global) somehow to get the CGRect
imgObj.img1Rec = CGRect(x: 0, y: 222, width: 222, height: 222)
}
你可以使用:
.background(
GeometryReader { proxy in
Color.clear
.onAppear {
imgObj.img1Rec = proxy.frame(in: .global)
}
})
推荐阅读
- android - map is overlapping on the drawer in flutter. how to fix this?
- php - second module not working in HMVC in Codeigniter
- typescript - 具有多个字符串值的打字稿枚举
- javascript - 如何将毫秒转换为当前日期?
- javascript - 使用 JQuery 更改单选按钮检查状态
- c# - wpf how to binding one TreeView to another TreeView
- php - PHP AES 128 bit encryption/decryption
- firebase - React Native Firebase 身份验证功能
- javascript - 以角度定义类范围之外的变量是一种好习惯吗?
- javafx - 我如何在主 fxml 中为第二个 fxml 自动调整大小