JetpackCompose组件介绍-Button

Table of Contents

此图片来自Material You官网

ElevatedButton 阴影按钮(带图标) #

	ElevatedButton(onClick = {

        }) {
            Icon(
                imageVector = Icons.Default.Add,
                contentDescription = "Test",
                modifier = Modifier.size(16.dp)
            )
            Spacer(modifier = Modifier.width(8.dp))
            Text(text = "New a Word")
        }

Button 按钮(默认) #

	Button(onClick = {

        }) {
            Text(text = "Show All")
        }

FilledTonalButton 填充色调按钮 #

	FilledTonalButton(onClick = {

        }) {
            Text(text = "Visit site")
        }

OutlinedButton 边框按钮 #

	OutlinedButton(onClick = {

	    }) {
    		Text(text = "Enable")
	}

TextButton 文本按钮 #

	TextButton(onClick = {

        }) {
            Text(text = "Text")
        }

IconButton 图标按钮 #

	IconButton(onClick = {

        }) {
            Icon(imageVector = Icons.Default.StarBorder,
                contentDescription = "Test")
        }

FloatingActionButton 浮动操作按钮 #

	FloatingActionButton(onClick = {

        }) {
            Icon(imageVector = Icons.Default.Add,
                contentDescription = "Test",
                modifier = Modifier.size(24.dp))
            Spacer(modifier = Modifier.width(8.dp))
        }

ExtendedFloatingActionButton 扩展浮动操作按钮 #

	ExtendedFloatingActionButton(onClick = {

        }) {
            Icon(imageVector = Icons.Default.Add,
                contentDescription = "Test",
                modifier = Modifier.size(24.dp))
            Spacer(modifier = Modifier.width(8.dp))
            Text(text = "Test")
        }