Jetpack Compose 仿IOS图片点击缩放效果

391 阅读1分钟

效果:

osks2-7xhh5.gif

用Modifier扩展

@Composable
fun Modifier.imageClickable(
    interactionSource: MutableInteractionSource =
        remember { MutableInteractionSource() },
    onClick: () -> Unit,
): Modifier = composed {
    val isPressed by interactionSource.collectIsPressedAsState()
    val sizePercent by animateFloatAsState(targetValue = if(isPressed) 0.9f else 1f)
    scale(sizePercent).
    clickable(indication = null, interactionSource = interactionSource, onClick = onClick)
}

使用

Image(
    painter = painterResource(id = R.drawable.image_example),
    contentDescription = null,
    contentScale = ContentScale.Crop,
    modifier = Modifier.imageClickable { /*TODO*/ })