其他分享
首页 > 其他分享> > jetpack compose 滑动事件用法

jetpack compose 滑动事件用法

作者:互联网

package com.ice.compose.components

import android.content.res.Resources
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.BoxScope
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.FractionalThreshold
import androidx.compose.material.rememberSwipeableState
import androidx.compose.material.swipeable
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.layout
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.IntOffset
import kotlin.math.roundToInt

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun SideSlipLayout(
    modifier: Modifier = Modifier,
    sideContent: @Composable BoxScope.() -> Unit,
    content: @Composable BoxScope.() -> Unit,
) {
    val swipeableState = rememberSwipeableState(0)
    val sizePx = remember { mutableStateOf(0f) }
    val height = remember { mutableStateOf(0) }
    val anchors = mapOf(0f to 0, -(sizePx.value) to 1) // Maps anchor points (in px) to states

    Box(
        modifier = modifier
            .swipeable(
                state = swipeableState,
                anchors = anchors,
                thresholds = { from, to -> FractionalThreshold(0.3f) },
                orientation = Orientation.Horizontal
            )
            .layout { measurable, constraints ->
                val placeable = measurable.measure(constraints)
                height.value = placeable.height
                layout(placeable.width, placeable.height) {
                    placeable.placeRelative(0, 0)
                }
            }
    ) {
        content()

        Box(
            modifier = Modifier
                .layout { measurable, constraints ->
                    val placeable = measurable.measure(constraints)
                    sizePx.value = placeable.width.toFloat()
                    layout(placeable.width, placeable.height) {
                        placeable.placeRelative(0, 0)
                    }
                }
                .offset {
                    if (!swipeableState.offset.value.isNaN()) {
                        IntOffset((sizePx.value + swipeableState.offset.value).roundToInt(), 0)
                    } else {
                        return@offset IntOffset(Resources.getSystem().displayMetrics.widthPixels, 0)
                    }
                }
                .height(with(LocalDensity.current) {
                    height.value.toDp()
                })
                .background(color = Color.Blue)
                .align(Alignment.TopEnd)
        ) {
            sideContent()
        }
    }
}

标签:compose,layout,androidx,jetpack,height,滑动,import,placeable
来源: https://blog.csdn.net/qq_32081725/article/details/123600261