问题[android-jetpack-compose](coding)

我正在尝试创建一个表单来更改动画时长。我已将下拉菜单的点击监听器连接到animTime，并且已验证动画时长animTime确实从 3000 变为 300，但实际动画速度仍然保持不变。

你知道我做错了什么吗？我正在使用，org.jetbrains.compose:1.8.0-beta02如果这很重要的话。

@Composable
fun test() {
    var animTime by remember { mutableIntStateOf(3000) }
    var easing by remember { mutableStateOf(FastOutSlowInEasing) }
    var containerSize by remember { mutableStateOf(IntSize.Zero) }
    val boxSize = 100.dp
    val moveX = max(0, containerSize.width - boxSize.px)

    val moveOffset by animateIntOffsetAsState(
        targetValue = IntOffset(moveX, 0),
        animationSpec = infiniteRepeatable(
            tween(
                durationMillis = animTime,
                easing = easing,
            )
        ),
    )

    Row(
        modifier = Modifier.fillMaxWidth()
    ) {
        Column(
            modifier = Modifier.weight(1f)
                .background(Color.Red)
                .onSizeChanged { containerSize = it }
        ) {
            Box(
                modifier = Modifier.size(boxSize)
                    .offset { moveOffset } // Offset must come before background (why?)
                    .background(Color.Cyan)
            )
        }

        Column(Modifier.weight(1f)) {
            Button(onClick = {
                if (animTime == 3000) animTime /= 10
                else animTime *= 10
            }) {
                Text("dur=$animTime")
            }
        }
    }
}

我想进行一些网络请求，并在 Jetpack Compose 中显示列表结果。我将请求参数传递给列表小部件。但是，即使地图更改，即使添加了 ，列表小部件也无法重新组合key。

下面是一个小演示：点击按钮后，int 值应该发生变化。

请帮我修复这个问题。

@Preview
@Composable
fun test() {
    var map by remember { mutableStateOf(mapOf<String, Any>()) }
    Column {
        Button(
            onClick = {
                map = HashMap(map)
            }
        ) {
            Text(
                text = "Tap"
            )
        }

        key(map) { testWidget1(map = map) }
    }

}

@Composable
fun testWidget1(map: Map<String, Any>) {
    var testInt by remember { mutableStateOf(0) }
    LaunchedEffect(map) {
        testInt += 1
        request()
    }
    Text(
        text = "$testInt"
    )


}

fun request() {

}

预览：

虚拟设备：

代码：

@Composable
fun ChatView(
    recentChat: RecentChat,
    onClick: () -> Unit
) {
    Row(
        horizontalArrangement = Arrangement.spacedBy(8.dp),
        verticalAlignment = Alignment.CenterVertically,
        modifier = Modifier
            .fillMaxWidth()
            .clickable(onClick = onClick)
    ) {

        Image(...)
        Column {

            Row(
                horizontalArrangement = Arrangement.SpaceBetween,
                verticalAlignment = Alignment.CenterVertically,
                modifier = Modifier.fillMaxWidth()
            ) {
                Text(recentChat.user.userName, maxLines = 1)
                Text(
                    text = timestamp,
                    fontSize = 12.sp
                )
            }

            Row(
                horizontalArrangement = Arrangement.SpaceBetween,
                verticalAlignment = Alignment.CenterVertically,
                modifier = Modifier.fillMaxWidth()
            ) {
                Text(
                    text = recentChat.chat.lastMessage,
                    maxLines = 1,
                    modifier = Modifier.weight(1f)
                )

                if (recentChat.newMessagesCount > 0) {
                    Box(
                        contentAlignment = Alignment.Center,
                        modifier = Modifier
                            .defaultMinSize(20.dp, 20.dp)
                            .background(Color(0xFF65B343), CircleShape)
                            .padding(2.dp)
                    ) {
                        Text(
                            text = "${recentChat.newMessagesCount}",
                            fontSize = 14.sp
                        )
                    }
                }
            }

        }


    }

}

View 很简单。Compose 层级结构中较高的只有 Screen，它包含这些 View 的列表。包含项目列表的 Screen 不会影响其大小和填充。错误在哪里？

|-|我

我正在尝试使一列能够在显示 ime 时保持底部项目可见

屏幕底部有一个文本字段，上面是列，其中填充了随机文本以使其滚动。

我尝试了一下Modifier.imeNestedScroll()，但很吃力，我甚至不确定它是否能起到作用

这是我当前的代码，但是它有点问题......

ComposeTestTheme {
    Scaffold(modifier = Modifier.fillMaxSize())
    { innerPadding ->
        Column(
            modifier = Modifier
                .padding(innerPadding)
                .consumeWindowInsets(innerPadding)
                .fillMaxSize()
        )
        {
            LazyColumn(
                modifier = Modifier
                    .weight(1f)
                    .fillMaxWidth()
                    .border(2.dp, Color.Red)
                    .imeNestedScroll()
            )
            {
                items(50) { index ->
                    Text(text = "item: $index")
                }
            }
            TextField(
                value = "",
                onValueChange = {},
                modifier = Modifier
                    .fillMaxWidth()
                    .border(2.dp, Color.Black)
                    .imePadding()
            )
        }
    }
}

有人可以帮忙吗？

文档

// MyActivity.kt file

class MyActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            // Calculate elevations based on the system theme
            val elevations = if (isSystemInDarkTheme()) {
                Elevations(card = 1.dp, default = 1.dp)
            } else {
                Elevations(card = 0.dp, default = 0.dp)
            }

            // Bind elevation as the value for LocalElevations
            CompositionLocalProvider(LocalElevations provides elevations) {
                // ... Content goes here ...
                // This part of Composition will see the `elevations` instance
                // when accessing LocalElevations.current
            }
        }
    }
}

当CompositionLocalProvider他们说“Content goes here它应该/可以是什么样的内容？”

我只是在寻找全局变量，而这一切都与有关Compose。

有这个简单的例子：

@Composable
fun SimpleFilledTextFieldSample() {
    var text by remember { mutableStateOf("Hello") }

    TextField(
        value = text,
        onValueChange = { text = it },
        label = { Text("Label") }
    )
}

我想了解每次用户按下某个键时“onValueChange”是否都会更新（即调用）？
我在 android jetpack compose 文档中找不到答案。

我正在制作一个 Kotlin Multiplatform / Compose Multiplatform 应用程序。我想要这种图表：

• 启动画面
• 验证屏幕
• 主图
  • 主屏幕
  • ...
  • 设置屏幕

我想要一个导航栏来浏览我的主图，但显然，当我在 SplashScreen 或 AuthScreen 上时，我不想有这个导航栏。我以为这很容易，但奇怪的是，我找不到任何帖子询问这个问题，也找不到任何关于这个问题的文档。而且 ChatGPT 一直给我根本不起作用的代码。

我尝试在可组合块中使用另一个 NavHost，但是不起作用。就像这样：

val navController = rememberNavController()
NavHost(
    navController = navController,
    startDestination = Destination.Splash
) {
    composable<Destination.Splash> {
        SplashScreenRoot()
    }
    composable<Destination.Auth> {
        AuthScreenRoot()
    }
    composable<Destination.Main> {
        // Add navigation here
        NavHost(
            navController = navController,
            startDestination = Destination.Main.Home
        ) {
            composable<Destination.Main.Home> {
                HomeScreenRoot()
            }
            composable<Destination.Main.Settings> {
                SettingsScreenRoot()
            }
        }
    }
}

我已经看到了一种方法来做到这一点，即使用导航栏并根据当前路线显示它，但似乎很奇怪，因为这是一个非常基本的情况，所以没有更简洁的方法来做到这一点。

我知道我可以利用Modifier.fillMaxHeight(0.8f)80％的可用高度。

但是，我希望有一个修饰符可以包裹内容高度，但不超过可用高度的 80%。因此，如果内容仅覆盖可用高度的 40%，那就没问题。如果它覆盖 90%，我只想要 80%。有什么方法可以编写这样的修饰符吗？

我正在尝试绘制带有各个部分的饼图并显示每个部分的标签。标签应显示在每个部分的开头，并与饼图保持 10dp 的间距。

这是我的代码：

@Composable
fun PieChartLocal(
    modifier: Modifier = Modifier,
    width: Float,
    thickness: Float,
    duration: Int,
    sections: List<Section>,
) {
    val sweepAngles = remember(sections) { findSweepAngles(sections) }
    val animateFloat = remember { Animatable(0f) }

    val density = LocalDensity.current
    val paddingDp = 18.dp
    val textSizeDp = 10.sp
    val paddingPx = with(density) { paddingDp.toPx() }

    val textSizePx = with(density) { textSizeDp.toPx() }

    LaunchedEffect(animateFloat) {
        animateFloat.animateTo(
            targetValue = 1f,
            animationSpec = tween(durationMillis = duration, easing = LinearEasing)
        )
    }

    Canvas(
        modifier = modifier
            .size((width + 2 * (paddingDp.value + textSizeDp.value)).dp)
    ) {
        var startAngle = 0f
        val radius =
            (size.minDimension - 2 * (paddingPx + textSizePx)) / 2
        val center = size.center

        for (i in sweepAngles.indices) {
            val sweepAngle = sweepAngles[i] * animateFloat.value
            val color = sections[i].color

            drawArc(
                color = color,
                startAngle = startAngle,
                sweepAngle = sweepAngle,
                useCenter = false,
                style = Stroke(width = thickness),
                topLeft = Offset(center.x - radius, center.y - radius),
                size = Size(radius * 2, radius * 2),
            )

            val angleInRadians = Math.toRadians(startAngle.toDouble())
            val textRadius = radius + paddingPx
            val x = center.x + textRadius * cos(angleInRadians).toFloat()
            val y = center.y + textRadius * sin(angleInRadians).toFloat()

            val percentage = (sweepAngles[i] / ROUND_ANGLE * 100).toInt()
            
            drawContext.canvas.nativeCanvas.apply {
                drawText(
                    "$percentage%",
                    x,
                    y,
                    TextPaint().apply {
                        textAlign = Paint.Align.CENTER
                        textSize = textSizePx
                    }
                )
            }

            startAngle += sweepAngle
        }
    }
}

private fun findSweepAngles(sections: List<Section>): List<Float> {
    val values = sections.map(Section::value)
    val sumValues = values.sum()
    return values.map { value -> ROUND_ANGLE * value / sumValues }
}

问题是，对于某些标签，我的饼图偏移量不正确。对于许多标签，它等于预期的 10dp，而对于其余标签，它完全不存在。可能是什么问题？

请帮我..

我有一个光标图标，我想让它在用户拖动它时保持在用户手指的中心，但是由于触摸误差和其他各种原因，它不能通过 onDrag 中的拖动量简单地更新视图的偏移量来保持中心位置。

我以为我可以计算触摸点的全局 XY 并将其设置为该值，但如果不执行诸如使用 pointerInterop 修饰符之类的令人沮丧的操作，则很难在 Compose 中获取该值。

     onDrag = { change, dragAmount ->
                    change.consume()

                    params.x += dragAmount.x.toInt()
                    params.y += dragAmount.y.toInt()
                    wm.updateViewLayout(composeView, params)
                   
                }

更新 1

肯定有一些明显的数学知识我没注意到。我能够通过将视图按偏移量移动，将视图的中心点与用户在 DragStart 上的手指同步，如下所示：

onDragStart = {
    params.x = params.x + it.x.toInt() - (composeView.width / 2)
    params.y = params.y + it.y.toInt() - (composeView.height / 2)
    wm.updateViewLayout(composeView, params)
},
onDrag = { change, dragAmount ->
    change.consume()
    //cant do that here though so doing the normal way below
    // params.x = params.x + change.position.x.toInt() - (composeView.width / 2)
    // params.y = params.y + change.position.y.toInt() - (composeView.height / 2)
    params.x += dragAmount.x.toInt()
    params.y += dragAmount.y.toInt()
   
    wm.updateViewLayout(composeView, params)
}

如果我注释掉 dragamount 增量方式并使用调整后的方式，拖动它时它会变得不稳定，疯狂地跳来跳去。

我尝试了一些其他技术，例如使用awaitEachGesture（如下所示）drag来摆脱触摸倾斜检测，但这并没有让我更接近目标。
真正的问题似乎发生在用户拖动速度非常慢的时候。如果你拖动得非常慢，出于某种原因，你的手指就会从视图中移开。这就像视图对非常微小的移动没有​​反应一样。
我想要做的就是让视图保持在触摸点的中心。这似乎应该只是一些具有现有可用参数的公式。

 .pointerInput(Unit) {
                awaitEachGesture {
                    val down = awaitFirstDown()

                    drag(down.id) { change ->
                        val posChange = change.positionChange()
                        val pos = change.position
                        Log.i("await gesture drag", "change: ${pos}")
                        Log.i("await gesture drag", "poschange: ${posChange}")
                        change.consume()
                        params.x += posChange.x.toInt()
                        params.y += posChange.y.toInt()
                       // params.x = params.x + pos.x.toInt() - (composeView.width / 2)
                       // params.y = params.y + pos.y.toInt() - (composeView.height / 2)
                        wm.updateViewLayout(composeView, params)
                    }

                }
            }

我还制作了此 GIF 来展示问题。首先，您可以看到，即使我移动得很快，触摸点也会有一些漂移。它会移到圆圈的边缘。更糟糕的是，如果我移动得非常慢，它会漂移很多。

更新 2

我刚刚意识到这可能是因为布局参数 x 和 y 的拖动量必须四舍五入为整数。我明天会调查一下。

imgur 问题的 GIF

更新 3

我关于舍入的理论是正确的。当您非常缓慢地拖动时，更改位置/拖动量浮点.toInt()会向下舍入为零，并且不会造成任何移动。将其更改为roundToInt也不起作用，因为缓慢的移动会在向上舍入时慢慢爬过您的手指。对我来说，解决方案是使用浮点累加器，这样小的拖动量就不会被吞没。我猜这是因为我围绕父 ComposeView 移动，而不是从触摸元素自己的.offset修饰符移动？我不太确定有什么区别，因为我知道您不需要通常的拖动技术累加器，也许引擎盖下有一个隐藏的累加器？

            .pointerInput(Unit) {

                val center = size.center

                awaitEachGesture {
                    val down = awaitFirstDown()

                    params.x += (down.position.x - center.x).roundToInt()
                    params.y += (down.position.y - center.y).roundToInt() 
                    wm.updateViewLayout(composeView, params)

                    drag(down.id) { change ->
                        val posChange = change.positionChange()

                        change.consume()

                        accumulatedX += posChange.x
                        accumulatedY += posChange.y

                        val deltaX = accumulatedX.toInt()
                        val deltaY = accumulatedY.toInt()

                        accumulatedX -= deltaX
                        accumulatedY -= deltaY

                        params.x += deltaX
                        params.y += deltaY
                        wm.updateViewLayout(composeView, params)
                    }

                }
            }