在SwiftUI中拖动到另一个视图时删除视图



我在SwiftUI的父视图中有一个视图数组。数组中的每个视图都有一个拖动手势,可以让我在屏幕上单独移动它们。

我的父视图中还有另一个视图,类似于垃圾桶图标。

当我将一个数组视图拖动到垃圾桶视图的空间中时,如何从数组中删除拖动的视图,以便有效地将其从屏幕中"删除"?

这与这里提出的问题相同,但我正在寻找SwiftUI解决方案,而不是obj-c:当拖动到图像时删除UILabel

编辑:这就是代码的样子

父视图:

struct parentView: View {
@State var childViews: [ChildView]
var body: some View {
ForEach(self.childViews, id: .childId) { childView in
childView
}
.overlay(
DeleteIcon()
.padding(.top, 200)
)
}
}

子视图(有几种(:

struct ChildView: View {
let childId = UUID()
// dragging vars
@State private var currentPosition: CGSize = .zero
@State private var newPosition: CGSize = .zero
var dragGesture: some Gesture {
DragGesture()
.onChanged { value in
self.currentPosition = CGSize(width: value.translation.width + self.newPosition.width, height: value.translation.height + self.newPosition.height)
}
.onEnded { value in
self.currentPosition = CGSize(width: value.translation.width + self.newPosition.width, height: value.translation.height + self.newPosition.height)
self.newPosition = self.currentPosition
}
}

var body: some View {
Rectangle()
.fill(Color.blue)
.frame(width: 200, height: 200)
.offset(x: currentPosition.width, y: currentPosition.height)
.gesture(dragGesture)
}
}

删除图标:

struct DeleteIcon: View {
var body: some View {
Rectangle()
.fill(Color.red)
.frame(width: 50, height: 200)
}
}

我做了一个非常简单粗暴的测试,其中拖动到屏幕的左边缘将"删除"圆圈。为了从屏幕上"删除",我使用了"showMe"变量和EmptyView。从本质上讲,我只是用一个空的视图替换视图。

import SwiftUI
struct ContentView: View {
var body: some View {
Group {
DragThing(pos: CGPoint(x:111,y:111), name: "test1")
DragThing(pos: CGPoint(x:133,y:133), name: "test2")
DragThing(pos: CGPoint(x:166,y:166), name: "test3")
}
}
}
struct DragThing: View {
@State private var pos = CGPoint.zero
@State private var name = ""
@State private var showMe = true
init(pos: CGPoint, name: String) {
_pos = State(initialValue: pos)
_name = State(initialValue: name)
}
var body: some View {
showMe ?
AnyView(ZStack {
Circle().foregroundColor(.blue).frame(width: 100, height: 100)
Text(self.name).foregroundColor(.white)
}.position(self.pos).highPriorityGesture(self.drag))
: AnyView(EmptyView())
}
var drag: some Gesture {
DragGesture().onChanged { value in
self.pos = CGPoint(x: value.location.x, y: value.location.y)
if self.pos.x < 40 {
self.showMe = false
}
}
}
}

最新更新