Jetpack：025-Jetpack中的多点触控事件

我们在上一章回中介绍了Jetpack中滚动事件相关的内容，本章回中主要介绍 多点解控事件。闲话休提，让我们一起Talk Android Jetpack吧！

1. 概念介绍

我们在本章回中介绍的多点触控事件是指通过多个手指同时操作，此时会发出相关的事件，这些事件包含，缩放，旋转和平移。常见的使用场景是查看图片，通过手指操作图片，此时可以使用多个手指来对图片进行缩放，旋转和平移。

这种多点触控操作最早是IOS平台上实现的，现在在Android平台上也支持这种操作，早期使用View开发时就没有这种多点触控事件，没有想到Andoird在compose中提供了多点触控事件，接下来让我们一起看看它的使用方法吧。

2. 使用方法

多点触控事件分为缩放，旋转和平移这三种，每一种事件都对应一个修饰符，接下来我们将分别介绍与这些事件对应的修饰符。

2.1 缩放事件

缩放事件就是对组件进行放大或者缩小操作时发出的事件，它通过多个手指靠拢或者松开来实现，与该事件对应的修饰符是scale，给它传递一个参数来表示缩放的比率。

2.2 旋转事件

旋转事件就是对组件进行转动操作时发出的事件，它通过多个手指转动来实现，与该事件对应的修饰符是rotate，给它传递一个参数来表示旋转的角度。

2.3 平移事件

平移事件就是对组件进行移动操作时发出的事件，它通过多个手指向某个方向移动来实现，与该事件对应的修饰符是transformable，给它传递一个参数来表示平移的信息，该值是状态值，可以包含缩放，旋转相关的信息。

2.4 综合事件

综合事件是指对组件进行缩放，旋转，平移综合操作时发出的事件，与该事件对应的操作符是graphicsLayer修饰符，该修饰符提供了scaleX，scaleY等相关的参数来控制综合事件的参数，参数的名称与事件相对应，因此我就不一一介绍这些参数了。

我们在上面介绍的多点触控操事件中，可以单独使用某种事件，也可以把多种事件放在一起综合使用，我们将在后面的小节中通过示例代码来演示。当然了，大家也可以看看官方文档中的内容，不过内容比较少。

3. 示例代码

var scale by remember { mutableStateOf(1f) }
var rotation by remember { mutableStateOf(0f) }
var offset by remember { mutableStateOf(Offset.Zero) }
val state = rememberTransformableState {
    zoomChange: Float, panChange: Offset, rotationChange: Float ->
    scale *= zoomChange
    rotation += rotationChange
    offset += panChange
}

//可以使用graphicsLayer修饰符传入各个参值，也可以单独使用scale,rotation等修饰符
Box(
    modifier = Modifier
        .graphicsLayer(
            scaleX = scale,
            scaleY = scale,
            rotationZ = rotation,
            translationX = offset.x,
            translationY = offset.y
        )
        //.rotate(rotation)
        //.scale(scale)
        .transformable(state = state)
        .background(color = Color.Red)
        .size(80.dp)
)

我们在上面的示例代码中演示了多点触控事件的用法，我们将该事件绑定到了一个红色的方框上，运行程序时可以使用多个手指对红色方框进行缩放，旋转和平移操作，下面是程序的运行效果图，请大家参考：

4. 内容总结

最后，我们对本章回的内容做一个全面的总结，以方便大家快速掌握本章回的知识。

• 多点触控事件分三种：旋转，缩放和平移，它们分别对应rotate,scale和transformable修饰符；
• 与多点触控事件相关修饰符需要配合状态值一起使用；
• 多点触控事件的修饰符可以单独使用，也可以综合使用；

看官们，与Jetpack中多点触控相关的内容就介绍到这里，欢迎大家在评论区交流与讨论！