android compose Switch 切换 使用

android compose Switch 切换 使用

基本实现方法

如需了解完整的 API 定义，请参阅 Switch 参考文档。以下是您可能需要使用的一些关键参数：

• checked：开关的初始状态。
• onCheckedChange：当开关的状态发生变化时调用的回调。
• enabled：开关处于启用还是停用状态。
• colors：用于开关的颜色。

package com.wn.androidcomposedemo1.basegoogle

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.size
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Check
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Switch
import androidx.compose.material3.SwitchDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.wn.androidcomposedemo1.ui.theme.AndroidComposeDemo1Theme

/**
 * Author : wn
 * Email : maoning20080808@163.com
 * Date : 2026/6/28 13:45
 * Description : 切换
 */
class SwitchActivity : ComponentActivity(){

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

        setContent {
            AndroidComposeDemo1Theme() {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    SwitchDemo()
                }
            }
        }
    }

    @Preview
    @Composable
    fun SwitchDemo(){
        Column(
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Spacer(Modifier.height(20.dp))
            Text(text = "Switch 使用", fontSize = 30.sp, color = Color.Red)
            Spacer(Modifier.height(20.dp))
            Text(text = "Switch 基本使用")
            SwitchMinimalExample()
            Spacer(Modifier.height(20.dp))
            Text(text = "Switch 高级使用")
            SwitchWithIconExample()
            Spacer(Modifier.height(20.dp))
            Text(text = "Switch 自定义颜色")
            SwitchWithCustomColors()
        }
    }

    /**
     * 自定义颜色
     */
    @Preview
    @Composable
    fun SwitchWithCustomColors(){
        var checked by remember { mutableStateOf(true) }

        Switch(
            checked = checked,
            onCheckedChange = {
                checked = it
            },
            colors = SwitchDefaults.colors(
                checkedThumbColor = MaterialTheme.colorScheme.primary,
                checkedTrackColor = MaterialTheme.colorScheme.primaryContainer,
                uncheckedThumbColor = MaterialTheme.colorScheme.secondary,
                uncheckedTrackColor = MaterialTheme.colorScheme.secondaryContainer
            )
        )
    }

    @Preview
    @Composable
    fun SwitchWithIconExample(){
        var checked by remember { mutableStateOf(true) }

        Switch(
            checked = checked,
            onCheckedChange = {
                checked = it
            },
            thumbContent = if(checked){
                {
                    Icon(
                        imageVector = Icons.Filled.Check,
                        contentDescription = null,
                        modifier = Modifier.size(SwitchDefaults.IconSize)
                    )
                }

            } else {
                null
            }
        )
    }

    @Preview
    @Composable
    fun SwitchMinimalExample(){
        var checked by remember { mutableStateOf(true) }

        Switch(
            checked = checked,
            onCheckedChange = {
                checked = it
            }

        )
    }
}