增加撰写按钮内图标的大小

Question

我有以下可组合按钮

@Composable
fun AppleLoginButton(onLoginClicked: () -> Unit) {
    Button(
        modifier = Modifier.size(44.dp),
        contentPadding = ButtonDefaults.ContentPadding,
        onClick = {
            onLoginClicked()
    },
        colors = ButtonDefaults.buttonColors(backgroundColor = Color.Black, contentColor = Color.White)
    ) {
        Icon(
            modifier = Modifier.fillMaxSize(),
            painter = painterResource(id = R.drawable.ic_apple_logo), contentDescription = "Apple logo")
    }
}

但我想增加苹果标志的大小，因为它太小了。

我努力了

modifier = Modifier.size(100.dp)
modifier = Modifier.fillMaxSize()

Answer 1

您可以使用增加 Button 的大小，也可以不使用高度。因为它使用了contentPadding，两边都是16.dp，留有空间。您可以将其设置为contentPadding = PaddingValues(0.dp)，有一个没有大小修饰符的按钮，或更大的修饰符或使用IconButton。

Text("Button")
Button(
    modifier = Modifier.size(48.dp),
    onClick = {
    },
    shape = RoundedCornerShape(10.dp),
    colors = ButtonDefaults.buttonColors(
        backgroundColor = Color.Black,
        contentColor = Color.White,
    ),
    contentPadding = PaddingValues(0.dp)
) {
    Icon(
        modifier = Modifier
            .fillMaxSize(),
        painter = painterResource(id = R.drawable.ic_baseline_star_12),
        contentDescription = "Apple logo"
    )
}

Text("IconButton")

IconButton(
    modifier = Modifier
        .size(48.dp)
        .background(Color.Black, RoundedCornerShape(8.dp)),
    onClick = {

    }
) {
    Icon(
        modifier = Modifier
            .fillMaxSize(),
        painter = painterResource(id = R.drawable.ic_baseline_star_12),
        contentDescription = "Apple logo",
        tint = Color.White
    )
}

Text("IconButton clip or shadow with clip=true ,0.dp elevation")
IconButton(
    modifier = Modifier
        .clip(RoundedCornerShape(8.dp))
//        .shadow(0.dp, RoundedCornerShape(8.dp), clip = true)
        .size(48.dp)
        .background(Color.Black),
    onClick = {

    }
) {
    Icon(
        modifier = Modifier
            .fillMaxSize(),
        painter = painterResource(id = R.drawable.ic_baseline_star_12),
        contentDescription = "Apple logo",
        tint = Color.White
    )
}