拖动实现列表重新排序

Column() { 
  ForEach(this.myCards, (item: string, index: number) => { 
    this.myCardItem(item, index) 
  }, (item: string) => item); 
}
1.
2.
3.
4.
5.

.gesture(GestureGroup(GestureMode.Sequence, 
  LongPressGesture({ repeat: false }) 
    .onAction((event) => { 
      console.log('===长按开始'); 
      this.startEditMode(index); 
    }) 
    .onActionCancel(() => { 
      console.log('===长按取消'); 
      this.endEditMode(); 
    }) 
    .onActionEnd((event) => { 
      console.log('===长按结束'); 
      this.endEditMode(); 
    }), 
  PanGesture(this.panOption) 
    .onActionStart((event) => { 
      console.log('===拖动开始'); 
      if (this.isEditMode) { 
        this.isMovedCard = true; 
      } 
    }) 
    .onActionUpdate((event) => { 
      console.log('===拖动更新'); 
      if (this.isEditMode) { 
        this.updatePosition(event.offsetY) 
      } 
    }) 
    .onActionEnd(() => { 
      console.log('===拖动结束') 
      if (this.isEditMode) { 
        this.isMovedCard = false; 
        this.endEditMode(); 
      } 
    }) 
))
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.

startEditMode(index: number) { 
  if (this.isEditMode) { 
    return; 
  } 
  this.isEditMode = true; 
  this.indexSelected = index; 
  this.curPosStartY = this.itemHeight * this.indexSelected; 
  this.curPosY = this.curPosStartY; 
 
  // 1秒未滑动自动取消排序，因为不会回调"长按结束"，也不会回调"滑动结束"。 
  setTimeout(() => { 
    if (!this.isMovedCard) { 
      this.endEditMode(); 
    } 
  }, 1000) 
} 
 
endEditMode() { 
  this.isEditMode = false; 
  this.indexSelected = -1; 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.