Remove materialcore for CompactButton
Removed the materialcore for CompactButton Material3, refactored
existing Button Material3 to accommodate CompactButton as well.
Added maxLines = 1 for Text composables used with CompactButton based on
the current recommendation.
Bug: 314924199
Test: Existing tests
Change-Id: Ie6a6b8bf6b6676ac551c2e9430ba495969b77896
diff --git a/wear/compose/compose-material3/integration-tests/src/main/java/androidx/wear/compose/material3/demos/ButtonDemo.kt b/wear/compose/compose-material3/integration-tests/src/main/java/androidx/wear/compose/material3/demos/ButtonDemo.kt
index 7f5decf..4957476 100644
--- a/wear/compose/compose-material3/integration-tests/src/main/java/androidx/wear/compose/material3/demos/ButtonDemo.kt
+++ b/wear/compose/compose-material3/integration-tests/src/main/java/androidx/wear/compose/material3/demos/ButtonDemo.kt
@@ -263,7 +263,7 @@
icon = { StandardIcon(ButtonDefaults.SmallIconSize) },
colors = ButtonDefaults.childButtonColors()
) {
- Text("Child Compact Button")
+ Text("Child Compact Button", maxLines = 1)
}
}
item {
@@ -308,7 +308,7 @@
CompactButton(
onClick = { /* Do something */ },
) {
- Text("Filled compact button")
+ Text("Filled compact button", maxLines = 1)
}
}
item {
@@ -316,7 +316,7 @@
onClick = { /* Do something */ },
colors = ButtonDefaults.filledTonalButtonColors()
) {
- Text("Filled tonal compact button")
+ Text("Filled tonal compact button", maxLines = 1)
}
}
item {
@@ -325,7 +325,7 @@
colors = ButtonDefaults.outlinedButtonColors(),
border = ButtonDefaults.outlinedButtonBorder(enabled = true)
) {
- Text("Outlined compact button")
+ Text("Outlined compact button", maxLines = 1)
}
}
item {
@@ -333,7 +333,7 @@
onClick = { /* Do something */ },
colors = ButtonDefaults.childButtonColors()
) {
- Text("Child compact button")
+ Text("Child compact button", maxLines = 1)
}
}
}
diff --git a/wear/compose/compose-material3/samples/src/main/java/androidx/wear/compose/material3/samples/ButtonSample.kt b/wear/compose/compose-material3/samples/src/main/java/androidx/wear/compose/material3/samples/ButtonSample.kt
index 46f1023..de91ffb 100644
--- a/wear/compose/compose-material3/samples/src/main/java/androidx/wear/compose/material3/samples/ButtonSample.kt
+++ b/wear/compose/compose-material3/samples/src/main/java/androidx/wear/compose/material3/samples/ButtonSample.kt
@@ -149,7 +149,7 @@
)
}
) {
- Text("Compact Button")
+ Text("Compact Button", maxLines = 1)
}
}
@@ -167,7 +167,7 @@
},
colors = ButtonDefaults.filledTonalButtonColors()
) {
- Text("Filled Tonal Compact Button")
+ Text("Filled Tonal Compact Button", maxLines = 1)
}
}
@@ -186,6 +186,6 @@
colors = ButtonDefaults.outlinedButtonColors(),
border = ButtonDefaults.outlinedButtonBorder(enabled = true)
) {
- Text("Show More")
+ Text("Show More", maxLines = 1)
}
}
diff --git a/wear/compose/compose-material3/src/main/java/androidx/wear/compose/material3/Button.kt b/wear/compose/compose-material3/src/main/java/androidx/wear/compose/material3/Button.kt
index b60c0ce..ef7d6d4 100644
--- a/wear/compose/compose-material3/src/main/java/androidx/wear/compose/material3/Button.kt
+++ b/wear/compose/compose-material3/src/main/java/androidx/wear/compose/material3/Button.kt
@@ -31,6 +31,7 @@
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
@@ -117,9 +118,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
enabled = enabled,
shape = shape,
labelFont = FilledButtonTokens.LabelFont.value,
@@ -187,9 +188,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
enabled = enabled,
shape = shape,
labelFont = FilledTonalButtonTokens.LabelFont.value,
@@ -256,9 +257,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
enabled = enabled,
shape = shape,
labelFont = OutlinedButtonTokens.LabelFont.value,
@@ -325,9 +326,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
enabled = enabled,
shape = shape,
labelFont = OutlinedButtonTokens.LabelFont.value,
@@ -411,9 +412,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
label: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
secondaryLabel = secondaryLabel,
icon = icon,
enabled = enabled,
@@ -504,9 +505,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
label: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
secondaryLabel = secondaryLabel,
icon = icon,
enabled = enabled,
@@ -592,9 +593,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
label: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
secondaryLabel = secondaryLabel,
icon = icon,
enabled = enabled,
@@ -679,9 +680,9 @@
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
label: @Composable RowScope.() -> Unit,
-) = Button(
+) = ButtonImpl(
onClick = onClick,
- modifier = modifier,
+ modifier = modifier.buttonSizeModifier(),
secondaryLabel = secondaryLabel,
icon = icon,
enabled = enabled,
@@ -772,7 +773,7 @@
* button in different states.
*/
@Composable
-public fun CompactButton(
+fun CompactButton(
onClick: () -> Unit,
modifier: Modifier = Modifier,
icon: (@Composable BoxScope.() -> Unit)? = null,
@@ -784,30 +785,50 @@
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
label: (@Composable RowScope.() -> Unit)? = null,
) {
- androidx.wear.compose.materialcore.CompactChip(
- onClick = onClick,
- background = { colors.containerPainter(enabled = it) },
- modifier = modifier.height(ButtonDefaults.CompactButtonHeight),
- label = provideNullableScopeContent(
- contentColor = colors.contentColor(enabled = enabled),
- textStyle = MaterialTheme.typography.labelSmall,
- content = label
- ),
- icon = provideNullableScopeContent(
- contentColor = colors.iconColor(enabled = enabled),
- content = icon
- ),
- enabled = enabled,
- interactionSource = interactionSource,
- contentPadding = contentPadding,
- shape = shape,
- border = { rememberUpdatedState(border) },
- defaultIconOnlyCompactChipWidth = ButtonDefaults.IconOnlyCompactButtonWidth,
- defaultCompactChipTapTargetPadding = ButtonDefaults.CompactButtonTapTargetPadding,
- defaultIconSpacing = ButtonDefaults.IconSpacing,
- role = Role.Button,
- ripple = rippleOrFallbackImplementation()
- )
+ if (label != null) {
+ ButtonImpl(
+ onClick = onClick,
+ modifier = modifier.compactButtonModifier()
+ .padding(ButtonDefaults.CompactButtonTapTargetPadding),
+ secondaryLabel = null,
+ icon = icon,
+ enabled = enabled,
+ shape = shape,
+ labelFont = MaterialTheme.typography.labelSmall,
+ secondaryLabelFont = null,
+ colors = colors,
+ border = border,
+ contentPadding = contentPadding,
+ interactionSource = interactionSource,
+ label = label
+ )
+ } else {
+ // Icon only compact chips have their own layout with a specific width and center aligned
+ // content. We use the base simple single slot Button under the covers.
+ ButtonImpl(
+ onClick = onClick,
+ modifier = modifier.compactButtonModifier()
+ .width(ButtonDefaults.IconOnlyCompactButtonWidth)
+ .padding(ButtonDefaults.CompactButtonTapTargetPadding),
+ enabled = enabled,
+ shape = shape,
+ labelFont = MaterialTheme.typography.labelSmall,
+ colors = colors,
+ border = border,
+ contentPadding = contentPadding,
+ interactionSource = interactionSource,
+ ) {
+ // Use a box to fill and center align the icon into the single slot of the
+ // Button
+ Box(modifier = Modifier
+ .fillMaxSize()
+ .wrapContentSize(align = Alignment.Center)) {
+ if (icon != null) {
+ icon()
+ }
+ }
+ }
+ }
}
/**
@@ -1363,12 +1384,21 @@
}
}
+@Composable
+private fun Modifier.buttonSizeModifier(): Modifier =
+ this.defaultMinSize(minHeight = ButtonDefaults.Height)
+ .height(IntrinsicSize.Min)
+
+@Composable
+private fun Modifier.compactButtonModifier(): Modifier =
+ this.height(ButtonDefaults.CompactButtonHeight)
+
/**
* Button with label. This allows to use the token values for
* individual buttons instead of relying on common values.
*/
@Composable
-private fun Button(
+private fun ButtonImpl(
onClick: () -> Unit,
modifier: Modifier,
enabled: Boolean,
@@ -1387,8 +1417,6 @@
) else modifier
Row(
modifier = borderModifier
- .defaultMinSize(minHeight = ButtonDefaults.Height)
- .height(IntrinsicSize.Min)
.clip(shape = shape)
.width(intrinsicSize = IntrinsicSize.Max)
.paint(
@@ -1416,7 +1444,7 @@
* individual buttons instead of relying on common values.
*/
@Composable
-private fun Button(
+private fun ButtonImpl(
onClick: () -> Unit,
modifier: Modifier,
secondaryLabel: (@Composable RowScope.() -> Unit)?,
@@ -1424,14 +1452,14 @@
enabled: Boolean,
shape: Shape,
labelFont: TextStyle,
- secondaryLabelFont: TextStyle,
+ secondaryLabelFont: TextStyle?,
colors: ButtonColors,
border: BorderStroke?,
contentPadding: PaddingValues,
interactionSource: MutableInteractionSource,
label: @Composable RowScope.() -> Unit
) {
- Button(
+ ButtonImpl(
onClick = onClick,
modifier = modifier,
enabled = enabled,
@@ -1463,14 +1491,14 @@
label
)
)
- secondaryLabel?.let {
- Row(
- content = provideScopeContent(
- colors.secondaryContentColor(enabled),
- secondaryLabelFont,
- secondaryLabel
- )
- )
+ if (secondaryLabel != null && secondaryLabelFont != null) {
+ Row(
+ content = provideScopeContent(
+ colors.secondaryContentColor(enabled),
+ secondaryLabelFont,
+ secondaryLabel
+ )
+ )
}
}
}
