嗨,我想在一个水平寻呼机有一个可缩放的图像。我已经实现了转换手势和双击,但现在,我不能滚动我的寻呼机与滚动的图像。我猜平移和滚动是相互混合的。你能帮我吗?
- 我试着检测水平拖动手势,但它只能防止水平平移,至少我只能管理这一部分。
这是我的可缩放图片合成:
@Composable
fun DoubleTapZoom(
) {
var zoomed by remember { mutableStateOf(false) }
var transforming by remember { mutableStateOf(false) }
var offset by remember { mutableStateOf(Offset.Zero) }
var zoomFloat by remember { mutableStateOf(1f) }
var angle by remember { mutableStateOf(0f) }
Image(
painter = painterResource(id = R.drawable.ic_launcher_foreground),
contentDescription = null,
modifier = Modifier
.size(500.dp)
.background(Color.Red)
.pointerInput(Unit) {
detectTapGestures(
onDoubleTap = { tapOffset ->
offset = if (zoomed) Offset.Zero else
calculateOffsetFromClick(size, tapOffset)
zoomed = !zoomed
}
)
}
.pointerInput(Unit) {
detectTransformGestures { centroid, pan, gestureZoom, gestureRotate ->
transforming = true
val oldScale = zoomFloat
val newScale = zoomFloat * gestureZoom
offset = (offset + centroid / oldScale).rotateBy(gestureRotate) -
(centroid / newScale + pan / oldScale)
zoomFloat = newScale
angle += gestureRotate
transforming = false
}
}
.graphicsLayer {
scaleX = zoomFloat
scaleY = zoomFloat
translationX = -offset.x * zoomFloat
translationY = -offset.y * zoomFloat
rotationZ = angle
transformOrigin = TransformOrigin(0f, 0f)
}
)
}
下面是我在水平分页中的用法:
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun HorizontalPagerWithZoomableContent() {
val pagerState = rememberPagerState()
HorizontalPager(
state = pagerState,
modifier = Modifier
.border(4.dp, Color.Red, RoundedCornerShape(36.dp))
.clip(RoundedCornerShape(36.dp)),
pageCount = 4,
) { pageIndex ->
Box (modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center){
DoubleTapZoom()
}
}
}
1条答案
按热度按时间pkln4tw61#
在jetpack中,默认情况下,通过默认传递(PointerEventPass.Main)将事件从后代传播到祖先。如果手势被消耗并且父/子检查它是否在它从未得到该事件之前被消耗。
您可以参考this answer了解更多详细信息。
默认情况下,
detectTransformGestures
在发生移动事件时消耗PointerInputChange
秒。为了克服这个问题,您可以添加一个可选参数来有条件地使用,例如缩放大于1或向下指针的数量大于1。我写了一个detectTransformGesture,它检查消耗,并返回屏幕上的指针
从上面的代码片段可以看出,只有当consume参数设置为true时,我才消费change
与默认手势不同。
此手势可用作
也可作为手势库使用,扩展此处提供的默认手势的功能
https://github.com/SmartToolFactory/Compose-Extended-Gestures/tree/master/gesture