Jetpack：025-Jetpack中的多点触控事件_jetpack 创建多个焦点-优快云博客

本文链接：https://blog.youkuaiyun.com/talk_8/article/details/134150416

本文详细介绍了AndroidJetpack中的多点触控事件，包括缩放、旋转和平移，以及如何通过GraphicsLayer修饰符在Compose中实现这些操作。提供了示例代码帮助理解。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

1. 概念介绍
2. 使用方法
3. 示例代码
4. 内容总结

我们在上一章回中介绍了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)
)