Jetpack Compose 寫toggle button

可以使用 `Switch` 组件来实现 `toggle button` 的效果。

示例代码如下：

import androidx.compose.foundation.layout.*
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun ToggleButton() {
    var checked by remember { mutableStateOf(false) }

    Switch(
        checked = checked,
        onCheckedChange = { checked = it },
        modifier = Modifier.padding(16.dp)
    )
}

使用 `mutableStateOf` 来保存 `checked` 状态，然后将其传递给 `Switch` 组件的 `checked` 属性，同时使用 `onCheckedChange` 属性来监听状态变化。最后使用 `Modifier.padding` 属性来设置组件的边距。

相关问题

用Jetpack Compose写一个圆形揭露动画

要用Jetpack Compose写一个圆形揭露动画，你需要使用动画框架来控制圆形的大小和透明度。

步骤如下：

1. 定义一个动画对象，使用Android KTX库中的AnimatedFloat类。

2. 使用Composable函数创建一个圆形，并使用动画对象控制其大小和透明度。

3. 使用rememberAnimation方法记录动画状态，以便在动画完成后重新开始。

4. 启动动画，通过调用动画对象的start方法。

这是一个示例代码：

@Composable
fun CircleRevealAnimation() {
    val animation = remember { AnimationSpec<Float>().to(1f).duration(500) }
    val size = animate(if (animation.isRunning) animation else animation.reverse(), repeatable = true)

    Stack {
        Circle(
            color = Color.White.copy(alpha = size.value),
            radius = size.value * 100
        )
    }

    onCommit(size.value) {
        if (size.value == 1f) animation.start()
    }
}

在此代码中，我们定义了一个动画，该动画持续时间为500毫秒，从0到1变化。然后我们使用该动画来控制圆形的大小和透明度。当动画完成后，将自动开始反向动画。

Jetpack Compose 组件Button点击和长按同时监听代码示例

当用户点击或长按按钮时，您可以使用 Jetpack Compose 的Clickable 组件。您可以将ClickEvent 和 LongPressEvent 传递给此组件，并在其中定义相应的操作。以下是示例代码：

import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.material.Button
import androidx.compose.material.Text
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.unit.dp

@Composable
fun ButtonWithLongClick() {

    val buttonState = remember { mutableStateOf(0) }

    Column(
        horizontalAlignment = Alignment.CenterHorizontally,
        modifier = Modifier.fillMaxWidth()
    ) {

        Button(
            onClick = {
                buttonState.value = buttonState.value + 1
            },
            modifier = Modifier.clickable(
                onClick = {
                  //add onClick event
                },
                onLongClick = {
                  //add onLongClick event
                }
            ),
            colors = ButtonDefaults.buttonColors(backgroundColor = Color.Gray)
        ) {
            Text(
                text = "Click & Long Click"
            )
        }

        Text(
            text = "Button clicked " + buttonState.value + " times"
        )
    }
}

在上面的示例代码中，使用了 Jetpack Compose 的 Column、Button 和 Text 组件，以及 clickable Modifier。使用 remember 可以创建可变状态，在 Button 中使用 onClick 和 onLongClick 传递 ClickEvent 和 LongPressEvent 以执行相应的操作。