Los gestos combinados se componen de múltiples gestos individuales. Al utilizar diferentes GestureMode en GestureGroup para declarar el tipo de gesto combinado, se admiten tres tipos de reconocimiento continuo, reconocimiento paralelo y reconocimiento mutuamente excluyente.
.GestureGroup(mode:GestureMode,…gesture:GestureType[])
modo: parámetro requerido, que es la clase de enumeración GestureMode. Se utiliza para declarar el tipo de este gesto combinado.
gesto: un parámetro requerido, que es una matriz compuesta por múltiples gestos. Se utiliza para declarar los gestos individuales que se combinan en el gesto combinado.
El GestureMode correspondiente al gesto de combinación de reconocimiento continuo es Sequence. El reconocimiento continuo de gestos combinados reconocerá los gestos en el orden en que se registran hasta que todos los gestos se reconozcan correctamente. Cuando falla el reconocimiento de un gesto en el gesto combinado de reconocimiento continuo, falla todo el reconocimiento de gestos.
Tomemos como ejemplo un gesto continuo compuesto por un gesto de pulsación prolongada y un gesto de arrastre: el
atributo de traducción está vinculado a un componente de Columna, y la posición y el movimiento del componente se pueden establecer modificando este atributo. Luego vincule el gesto de combinación de secuencia compuesto por LongPressGesture y PanGesture al componente. Cuando se activa LongPressGesture, actualice el número mostrado. Al arrastrar después de una pulsación prolongada, el componente se arrastra de acuerdo con la función de devolución de llamada del gesto de arrastre.
// xxx.ets
@Entry
@Component
struct Index {
@State offsetX: number = 0;
@State offsetY: number = 0;
@State count: number = 0;
@State positionX: number = 0;
@State positionY: number = 0;
@State borderStyles: BorderStyle = BorderStyle.Solid
build() {
Column() {
Text('sequence gesture\n' + 'LongPress onAction:' + this.count + '\nPanGesture offset:\nX: ' + this.offsetX + '\n' + 'Y: ' + this.offsetY)
.fontSize(28)
}
// 绑定translate属性可以实现组件的位置移动
.translate({ x: this.offsetX, y: this.offsetY, z: 0 })
.height(250)
.width(300)
//以下组合手势为顺序识别，当长按手势事件未正常触发时不会触发拖动手势事件
.gesture(
// 声明该组合手势的类型为Sequence类型
GestureGroup(GestureMode.Sequence,
// 该组合手势第一个触发的手势为长按手势，且长按手势可多次响应
LongPressGesture({ repeat: true })
// 当长按手势识别成功，增加Text组件上显示的count次数
.onAction((event: GestureEvent) => {
if (event.repeat) {
this.count++;
}
console.info('LongPress onAction');
})
.onActionEnd(() => {
console.info('LongPress end');
}),
// 当长按之后进行拖动，PanGesture手势被触发
PanGesture()
.onActionStart(() => {
this.borderStyles = BorderStyle.Dashed;
console.info('pan start');
})
// 当该手势被触发时，根据回调获得拖动的距离，修改该组件的位移距离从而实现组件的移动
.onActionUpdate((event: GestureEvent) => {
this.offsetX = this.positionX + event.offsetX;
this.offsetY = this.positionY + event.offsetY;
console.info('pan update');
})
.onActionEnd(() => {
this.positionX = this.offsetX;
this.positionY = this.offsetY;
this.borderStyles = BorderStyle.Solid;
})
)
)
}
}
Descripción : El evento de arrastre es un evento de gesto de combinación de reconocimiento continuo típico, que se compone de un evento de gesto de pulsación larga y un evento de gesto de deslizamiento. El evento de arrastre se activará solo después de una pulsación prolongada durante el tiempo preestablecido del evento de gesto de pulsación larga y luego deslizarse. Si no se alcanza el evento de pulsación larga o no se realiza ningún deslizamiento después de la pulsación larga, no se reconocerá el evento de arrastre.