How can the default elevation for ExtendedFloatingActionButton
be applied in Jetpack Compose so that a shadow can be seen? Understandably, the default resting level is number 3 and the default height is 6dp, but using elevation = 6.dp
didn't work, so what other method is there?
ExtendedFloatingActionButton(
text = { Text(text = "Button") },
icon = { Icon(Icons.Filled.Add, "") },
modifier = Modifier.clip(RoundedCornerShape(16.dp)),
elevation = FloatingActionButtonElevation.?
)
CodePudding user response:
Defaults maybe in colors, elevations or anywhere is supposed to be used like this
ExtendedFloatingActionButton(
text = { Text(text = "Button") },
icon = { Icon(Icons.Filled.Add, "") },
modifier = Modifier.clip(RoundedCornerShape(16.dp)),
elevation = FloatingActionButtonDefaults.elevation(
defaultElevation = 4.dp,
pressedElevation = 8.dp,
hoveredElevation = 2.dp,
focusedElevation = 1.dp,
),
onClick = {}
)
CodePudding user response:
With M3 the default elevation is defined by FloatingActionButtonDefaults.elevation()
.
If you want the default value just omit it. You can also override the default values with:
ExtendedFloatingActionButton(
//..
elevation = FloatingActionButtonDefaults.elevation(
defaultElevation = 4.dp
)
)
It defines the elevation of a ExtendedFloatingActionButton
in different states
@Composable
fun elevation(
defaultElevation: Dp = FabPrimaryTokens.ContainerElevation, //6.0.dp
pressedElevation: Dp = FabPrimaryTokens.PressedContainerElevation, //6.0.dp
focusedElevation: Dp = FabPrimaryTokens.FocusContainerElevation, //6.0.dp
hoveredElevation: Dp = FabPrimaryTokens.HoverContainerElevation //8.0.dp
): FloatingActionButtonElevation
You can see in the source code:
val ContainerElevation = ElevationTokens.Level3
val PressedContainerElevation = ElevationTokens.Level3
val FocusContainerElevation = ElevationTokens.Level3
val HoverContainerElevation = ElevationTokens.Level4
With M2 the approach is similar and default values are defined by FloatingActionButtonDefaults.elevation()
:
@Composable
fun elevation(
defaultElevation: Dp = 6.dp,
pressedElevation: Dp = 12.dp,
hoveredElevation: Dp = 8.dp,
focusedElevation: Dp = 8.dp,
)