entityMap|blocks|key|1ikek|text|可以非常简单地实现删除操作和重新排序列表项的能力。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|9tqca|struct+SwipeActionView:+View+{
++++@State+var+items:+[String]+=+["One",+"two",+"three",+"four"]

++++var+body:+some+View+{
++++++++NavigationView+{
++++++++++++List+{
++++++++++++++++ForEach(items.identified(by:+\.self))+{+item+in
++++++++++++++++++++Text(item)
++++++++++++++++}
++++++++++++++++.onMove(perform:+move)
++++++++++++++++.onDelete(perform:+delete)++++++
++++++++++++}
++++++++++++.navigationBarItems(trailing:+EditButton())
++++++++}
++++}

++++func+delete(at+offsets:+IndexSet)+{
++++++++if+let+first+=+offsets.first+{
++++++++++++items.remove(at:+first)
++++++++}
++++}

++++func+move(from+source:+IndexSet,+to+destination:+Int)+{
++++++++//+sort+the+indexes+low+to+high
++++++++let+reversedSource+=+source.sorted()

++++++++//+then+loop+from+the+back+to+avoid+reordering+problems
++++++++for+index+in+reversedSource.reversed()+{
++++++++++++//+for+each+item,+remove+it+and+insert+it+at+the+destination
++++++++++++items.insert(items.remove(at:+index),+at:+destination)
++++++++}
++++}
}|code-block|syntax|javascript|56jsl|编辑:有一篇来自苹果的文章，我不敢相信我之前没有找到。|747nj|编写SwiftUI手势|adkgl|..。我还没有尝试过，但这篇文章似乎做得很好！^0|0|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|N|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|O|9|@]|A|@]|B|$F|G]]|$2|H|4|I|6|7|8|P|9|@]|A|@]|B|$]]|$2|J|4|K|6|7|8|Q|9|@]|A|@]|B|$]]|$2|L|4|M|6|7|8|R|9|@]|A|@]|B|$]]]]

It is possible to implement a delete action and the ability to reorder list items quite simply.

<pre class="lang-swift prettyprint-override"><code>struct SwipeActionView: View {
 @State var items: [String] = ["One", "two", "three", "four"]

 var body: some View {
 NavigationView {
 List {
 ForEach(items.identified(by: \.self)) { item in
 Text(item)
 }
 .onMove(perform: move)
 .onDelete(perform: delete) 
 }
 .navigationBarItems(trailing: EditButton())
 }
 }

 func delete(at offsets: IndexSet) {
 if let first = offsets.first {
 items.remove(at: first)
 }
 }

 func move(from source: IndexSet, to destination: Int) {
 // sort the indexes low to high
 let reversedSource = source.sorted()

 // then loop from the back to avoid reordering problems
 for index in reversedSource.reversed() {
 // for each item, remove it and insert it at the destination
 items.insert(items.remove(at: index), at: destination)
 }
 }
}
</code></pre>

Edit: There is this article by apple that I cannot believe I didn't find previously. <a href="https://developer.apple.com/documentation/swiftui/gestures/composing_swiftui_gestures" rel="nofollow noreferrer">Composing SwiftUI Gestures</a>. I haven't experimented with it yet, but the article seems to do a great job!

entityMap|blocks|key|9455l|text|我想要同样的东西，现在有了下面的实现。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|oae4|SwipeController检查何时执行刷卡操作并执行SwipeAction，现在您可以在executeAction函数的打印行下添加刷卡操作。但最好从这里创建一个抽象类。|bjmbl|然后在SwipeLeftRightContainer结构中，我们将大部分逻辑放在DragGesture中。它所做的是，当你拖动它时，它会改变偏移量，然后调用SwipeController，看看是否达到了向左或向右滑动的阈值。然后，当您完成拖动时，它将进入DragGesture的onEnded回调。在这里，我们将重置偏移量，并让SwipeController决定执行一个操作。|pa1i|请记住，视图中的许多变量对于iPhone+X都是静态的，因此您应该将它们更改为最适合的。|d7sbf|import+SwiftUI

/**+executeRight:+checks+if+it+should+execute+the+swipeRight+action
++++execute+Left:+checks+if+it+should+execute+the+swipeLeft+action
++++submitThreshold:+the+threshold+of+the+x+offset+when+it+should+start+executing+the+action
*/
class+SwipeController+{
++++var+executeRight+=+false
++++var+executeLeft+=+false
++++let+submitThreshold:+CGFloat+=+200
++++
++++func+checkExecutionRight(offsetX:+CGFloat)+{
++++++++if+offsetX+>+submitThreshold+&&+self.executeRight+==+false+{
++++++++++++Utils.HapticSuccess()
++++++++++++self.executeRight+=+true
++++++++}+else+if+offsetX+<+submitThreshold+{
++++++++++++self.executeRight+=+false
++++++++}
++++}
++++
++++func+checkExecutionLeft(offsetX:+CGFloat)+{
++++++++if+offsetX+<+-submitThreshold+&&+self.executeLeft+==+false+{
++++++++++++Utils.HapticSuccess()
++++++++++++self.executeLeft+=+true
++++++++}+else+if+offsetX+>+-submitThreshold+{
++++++++++++self.executeLeft+=+false
++++++++}
++++}
++++
++++func+excuteAction()+{
++++++++if+executeRight+{
++++++++++++print("executed+right")
++++++++}+else+if+executeLeft+{
++++++++++++print("executed+left")
++++++++}
++++++++
++++++++self.executeLeft+=+false
++++++++self.executeRight+=+false
++++}
}

struct+SwipeLeftRightContainer:+View+{
++++
++++var+swipeController:+SwipeController+=+SwipeController()
++++
++++@State+var+offsetX:+CGFloat+=+0
++++
++++let+maxWidth:+CGFloat+=+335
++++let+maxHeight:+CGFloat+=+125
++++let+swipeObjectsOffset:+CGFloat+=+350
++++let+swipeObjectsWidth:+CGFloat+=+400
++++
++++@State+var+rowAnimationOpacity:+Double+=+0
++++var+body:+some+View+{
++++++++ZStack+{
++++++++++++Group+{
++++++++++++++++HStack+{
++++++++++++++++++++Text("Sample+row")
++++++++++++++++++++Spacer()
++++++++++++++++}
++++++++++++}.padding(10)
++++++++++++.zIndex(1.0)
++++++++++++.frame(width:+maxWidth,+height:+maxHeight)
++++++++++++.cornerRadius(5)
++++++++++++.background(RoundedRectangle(cornerRadius:+10).fill(Color.gray))
++++++++++++.padding(10)
++++++++++++.offset(x:+offsetX)
++++++++++++.gesture(DragGesture(minimumDistance:+5).onChanged+{+gesture+in
++++++++++++++++withAnimation(Animation.linear(duration:+0.1))+{
++++++++++++++++++++offsetX+=+gesture.translation.width
++++++++++++++++}
++++++++++++++++swipeController.checkExecutionLeft(offsetX:+offsetX)
++++++++++++++++swipeController.checkExecutionRight(offsetX:+offsetX)
++++++++++++}.onEnded+{+_+in
++++++++++++++++withAnimation(Animation.linear(duration:+0.1))+{
++++++++++++++++++++offsetX+=+0
++++++++++++++++++++swipeController.prevLocX+=+0
++++++++++++++++++++swipeController.prevLocXDiff+=+0
++++++++++++++++++++self.swipeController.excuteAction()
++++++++++++++++}
++++++++++++})
++++++++++++Group+{
++++++++++++++++ZStack+{
++++++++++++++++++++Rectangle().fill(Color.red).frame(width:+swipeObjectsWidth,+height:+maxHeight).opacity(opacityDelete)
++++++++++++++++++++Image(systemName:+"multiply").font(Font.system(size:+34)).foregroundColor(Color.white).padding(.trailing,+150)
++++++++++++++++}
++++++++++++}.zIndex(0.9).offset(x:+swipeObjectsOffset+%2B+offsetX)
++++++++++++Group+{
++++++++++++++++ZStack+{
++++++++++++++++++++Rectangle().fill(Color.green).frame(width:+swipeObjectsWidth,+height:+maxHeight).opacity(opacityLike)
++++++++++++++++++++Image(systemName:+"heart").font(Font.system(size:+34)).foregroundColor(Color.white).padding(.leading,+150)
++++++++++++++++}
++++++++++++}.zIndex(0.9).offset(x:+-swipeObjectsOffset+%2B+offsetX)
++++++++}
++++}
++++
++++var+opacityDelete:+Double+{
++++++++if+offsetX+<+0+{
++++++++++++return+Double(abs(offsetX)+/+50)
++++++++}
++++++++return+0
++++}
++++
++++var+opacityLike:+Double+{
++++++++if+offsetX+>+0+{
++++++++++++return+Double(offsetX+/+50)
++++++++}
++++++++return+0
++++}
}

struct+SwipeListView:+View+{
++++
++++var+body:+some+View+{
++++++++ScrollView+{
++++++++++++ForEach(0..<10)+{+index+in
++++++++++++++++SwipeLeftRightContainer().listRowInsets(EdgeInsets(top:+0,+leading:+10,+bottom:+0,+trailing:+10))
++++++++++++}
++++++++}
++++}
++++
}

struct+SwipeLeftRight_Previews:+PreviewProvider+{
++++static+var+previews:+some+View+{
++++++++SwipeListView()
++++}
}|code-block|syntax|javascript^0|0|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|N|9|@]|A|@]|B|$]]|$2|C|4|D|6|7|8|O|9|@]|A|@]|B|$]]|$2|E|4|F|6|7|8|P|9|@]|A|@]|B|$]]|$2|G|4|H|6|7|8|Q|9|@]|A|@]|B|$]]|$2|I|4|J|6|K|8|R|9|@]|A|@]|B|$L|M]]]]

I wanted the same and have now the following implementation.
The SwipeController checks when to execute a swipe action and performs the SwipeAction, for now you can add your swipe actions under the print lines in the executeAction function. But it is better make an abstract class from this.
Then in the SwipeLeftRightContainer struct we have most of the logic in the DragGesture. What it does is while your dragging its gonna change the offset and then make calls to the SwipeController to see if the threshold for swipe left or right are reached. Then when you finish the dragging it will come into the onEnded callback of the DragGesture. Here we will reset the offset and let the SwipeController decide to execute an action.
Keep in mind lot of the variables in the view are static for an iPhone X so you should change them to what fits best.
<pre><code>import SwiftUI

/** executeRight: checks if it should execute the swipeRight action
 execute Left: checks if it should execute the swipeLeft action
 submitThreshold: the threshold of the x offset when it should start executing the action
*/
class SwipeController {
 var executeRight = false
 var executeLeft = false
 let submitThreshold: CGFloat = 200
 
 func checkExecutionRight(offsetX: CGFloat) {
 if offsetX &gt; submitThreshold &amp;&amp; self.executeRight == false {
 Utils.HapticSuccess()
 self.executeRight = true
 } else if offsetX &lt; submitThreshold {
 self.executeRight = false
 }
 }
 
 func checkExecutionLeft(offsetX: CGFloat) {
 if offsetX &lt; -submitThreshold &amp;&amp; self.executeLeft == false {
 Utils.HapticSuccess()
 self.executeLeft = true
 } else if offsetX &gt; -submitThreshold {
 self.executeLeft = false
 }
 }
 
 func excuteAction() {
 if executeRight {
 print(&quot;executed right&quot;)
 } else if executeLeft {
 print(&quot;executed left&quot;)
 }
 
 self.executeLeft = false
 self.executeRight = false
 }
}

struct SwipeLeftRightContainer: View {
 
 var swipeController: SwipeController = SwipeController()
 
 @State var offsetX: CGFloat = 0
 
 let maxWidth: CGFloat = 335
 let maxHeight: CGFloat = 125
 let swipeObjectsOffset: CGFloat = 350
 let swipeObjectsWidth: CGFloat = 400
 
 @State var rowAnimationOpacity: Double = 0
 var body: some View {
 ZStack {
 Group {
 HStack {
 Text(&quot;Sample row&quot;)
 Spacer()
 }
 }.padding(10)
 .zIndex(1.0)
 .frame(width: maxWidth, height: maxHeight)
 .cornerRadius(5)
 .background(RoundedRectangle(cornerRadius: 10).fill(Color.gray))
 .padding(10)
 .offset(x: offsetX)
 .gesture(DragGesture(minimumDistance: 5).onChanged { gesture in
 withAnimation(Animation.linear(duration: 0.1)) {
 offsetX = gesture.translation.width
 }
 swipeController.checkExecutionLeft(offsetX: offsetX)
 swipeController.checkExecutionRight(offsetX: offsetX)
 }.onEnded { _ in
 withAnimation(Animation.linear(duration: 0.1)) {
 offsetX = 0
 swipeController.prevLocX = 0
 swipeController.prevLocXDiff = 0
 self.swipeController.excuteAction()
 }
 })
 Group {
 ZStack {
 Rectangle().fill(Color.red).frame(width: swipeObjectsWidth, height: maxHeight).opacity(opacityDelete)
 Image(systemName: &quot;multiply&quot;).font(Font.system(size: 34)).foregroundColor(Color.white).padding(.trailing, 150)
 }
 }.zIndex(0.9).offset(x: swipeObjectsOffset + offsetX)
 Group {
 ZStack {
 Rectangle().fill(Color.green).frame(width: swipeObjectsWidth, height: maxHeight).opacity(opacityLike)
 Image(systemName: &quot;heart&quot;).font(Font.system(size: 34)).foregroundColor(Color.white).padding(.leading, 150)
 }
 }.zIndex(0.9).offset(x: -swipeObjectsOffset + offsetX)
 }
 }
 
 var opacityDelete: Double {
 if offsetX &lt; 0 {
 return Double(abs(offsetX) / 50)
 }
 return 0
 }
 
 var opacityLike: Double {
 if offsetX &gt; 0 {
 return Double(offsetX / 50)
 }
 return 0
 }
}

struct SwipeListView: View {
 
 var body: some View {
 ScrollView {
 ForEach(0..&lt;10) { index in
 SwipeLeftRightContainer().listRowInsets(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
 }
 }
 }
 
}

struct SwipeLeftRight_Previews: PreviewProvider {
 static var previews: some View {
 SwipeListView()
 }
}
</code></pre>

Is there a way to swipe table rows to the left and to the right? I haven't found something for the new Framework SwiftUI so maybe there is no chance to use SwiftUI for this? I need to delete rows and use custom Swipes

SwiftUI Table Custom Swipe?

 有没有向左和向右滑动表格行的方法？我还没有找到新的框架SwiftUI的东西，所以可能没有机会使用SwiftUI来做这件事？我需要删除行并使用自定义卷帘

问SwiftUI表自定义滑动？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问SwiftUI表自定义滑动？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问SwiftUI表自定义滑动？
EN