PanGesture实现控件拖动的效果，通过拖动的坐标位置调用position或者translate方法来更新UI的位置。效果见下图：

具体代码如下：

// xxx.ets
@Entry
@Component
struct PanGestureExample {@State offsetX: number = 0@State offsetY: number = 0positionX: number = 0positionY: number = 0private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.All })build() {Column() {Column() {Text('PanGesture offset:\nX: ' + this.offsetX + '\n' + 'Y: ' + this.offsetY)}.height(200).width(300).padding(20).border({ width: 3 }).margin(50).onClick(()=>{console.info('Pan click')}).translate({ x: this.offsetX, y: this.offsetY }) // 以组件左上角为坐标原点进行移动，此处也可以调用position({ x: this.offsetX, y: this.offsetY }) 方法// 左右拖动触发该手势事件.gesture(PanGesture(this.panOption).onActionStart((event: GestureEvent) => {console.info('Pan start')}).onActionUpdate((event: GestureEvent) => {if (event) {this.offsetX = this.positionX + event.offsetXthis.offsetY = this.positionY + event.offsetY}}).onActionEnd((event: GestureEvent) => {//记录拖动结束前停留的位置this.positionX = this.offsetXthis.positionY = this.offsetYconsole.info('Pan end')}))}}
}

通过这个PanGesture，可以实现更复杂的功能，比如ListView的item排序等，后面会写相关博文出来。
参考资料：
HarmonyOS(40) 悬浮框实现
PanGesture