# IconToggleButtonDefaults Artifact: [androidx.wear.compose:compose-material3](https://developer.android.com/jetpack/androidx/releases/wear-compose) [View Source](https://cs.android.com/search?q=file:androidx/wear/compose/material3/IconToggleButton.kt+class:androidx.wear.compose.material3.IconToggleButtonDefaults) Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` object IconToggleButtonDefaults ```
*** ** * ** *** Contains the default values used by `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. ## Summary | ### Public functions | |---|---| | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#animatedShapes()()` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between two CornerBasedShapes when pressed. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#animatedShapes(androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape)(shape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape?, pressedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape?)` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` with an animation between two CornerBasedShapes. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#colors()()` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#colors(androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color)( checkedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, checkedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, uncheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, uncheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, disabledCheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, disabledCheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, disabledUncheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, disabledUncheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color )` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#iconSizeFor(androidx.compose.ui.unit.Dp)(buttonSize: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp)` Recommended icon size for a given icon toggle button size. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#shapes()()` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for a static `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#shapes(androidx.compose.ui.graphics.Shape)(shape: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape)` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` with a static shape. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#variantAnimatedShapes()()` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between three `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerSize`s based on the pressed state and checked/unchecked. | | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#variantAnimatedShapes(androidx.compose.foundation.shape.CornerBasedShape,androidx.compose.foundation.shape.CornerBasedShape)( uncheckedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape?, checkedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape? )` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between three `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerSize`s based on the pressed state and checked/unchecked. | | ### Public properties | |---|---| | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#DefaultIconSize()` The default size of an icon when used inside an icon toggle button of size DefaultButtonSize. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeIconSize()` The size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeSize()`. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeSize()` The recommended size for an extra icon large toggle button. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#LargeIconSize()` The size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#LargeSize()`. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#LargeSize()` The recommended size for a large icon toggle button. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#Size()` The default size applied for icon toggle buttons. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallIconSize()` The recommended size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallSize()`. | | `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallSize()` The recommended size for a small button. | | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#checkedShape()` Recommended checked `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. | | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#pressedShape()` Recommended pressed `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. | | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/RoundedCornerShape` | `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#shape()` Recommended `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. | ## Public functions ### animatedShapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun animatedShapes(): IconToggleButtonShapes ``` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between two CornerBasedShapes when pressed. A simple icon toggle button using the default colors, animated when pressed. ```kotlin import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.width import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.wear.compose.material3.IconToggleButton import androidx.wear.compose.material3.IconToggleButtonDefaults import androidx.wear.compose.material3.samples.icons.WifiOffIcon import androidx.wear.compose.material3.samples.icons.WifiOnIcon var firstChecked by remember { mutableStateOf(true) } var secondChecked by remember { mutableStateOf(false) } Row( modifier = Modifier.fillMaxSize(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically, ) { IconToggleButton( checked = firstChecked, onCheckedChange = { firstChecked = !firstChecked }, shapes = IconToggleButtonDefaults.animatedShapes(), ) { if (firstChecked) { WifiOnIcon() } else { WifiOffIcon() } } Spacer(modifier = Modifier.width(5.dp)) IconToggleButton( checked = secondChecked, onCheckedChange = { secondChecked = !secondChecked }, shapes = IconToggleButtonDefaults.animatedShapes(), ) { if (secondChecked) { WifiOnIcon() } else { WifiOffIcon() } } } ``` ### animatedShapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun animatedShapes(     shape: CornerBasedShape? = null,     pressedShape: CornerBasedShape? = null ): IconToggleButtonShapes ``` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` with an animation between two CornerBasedShapes. A simple icon toggle button using the default colors, animated when pressed. ```kotlin import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.width import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.wear.compose.material3.IconToggleButton import androidx.wear.compose.material3.IconToggleButtonDefaults import androidx.wear.compose.material3.samples.icons.WifiOffIcon import androidx.wear.compose.material3.samples.icons.WifiOnIcon var firstChecked by remember { mutableStateOf(true) } var secondChecked by remember { mutableStateOf(false) } Row( modifier = Modifier.fillMaxSize(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically, ) { IconToggleButton( checked = firstChecked, onCheckedChange = { firstChecked = !firstChecked }, shapes = IconToggleButtonDefaults.animatedShapes(), ) { if (firstChecked) { WifiOnIcon() } else { WifiOffIcon() } } Spacer(modifier = Modifier.width(5.dp)) IconToggleButton( checked = secondChecked, onCheckedChange = { secondChecked = !secondChecked }, shapes = IconToggleButtonDefaults.animatedShapes(), ) { if (secondChecked) { WifiOnIcon() } else { WifiOffIcon() } } } ``` | Parameters | |---|---| | `shape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape? = null` | The normal shape of the IconToggleButton when unpressed - if null, the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#shape()` is used. | | `pressedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape? = null` | The pressed shape of the IconToggleButton - if null, the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#pressedShape()` is used. | ### colors Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun colors(): IconToggleButtonColors ``` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` - by default, a colored background with a contrasting content color. If the button is disabled, then the colors will have an alpha (`https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#DisabledContentAlpha()` and `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#DisabledContainerAlpha()`) value applied. ### colors Added in [1.6.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.6.0) ``` @Composable fun colors(     checkedContainerColor: Color = Color.Unspecified,     checkedContentColor: Color = Color.Unspecified,     uncheckedContainerColor: Color = Color.Unspecified,     uncheckedContentColor: Color = Color.Unspecified,     disabledCheckedContainerColor: Color = Color.Unspecified,     disabledCheckedContentColor: Color = Color.Unspecified,     disabledUncheckedContainerColor: Color = Color.Unspecified,     disabledUncheckedContentColor: Color = Color.Unspecified ): IconToggleButtonColors ``` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonColors` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` - by default, a colored background with a contrasting content color. If the button is disabled, then the colors will have an alpha (`https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#DisabledContentAlpha()` and `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#DisabledContainerAlpha()`) value applied. | Parameters | |---|---| | `checkedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The container color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when enabled and checked | | `checkedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The content color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when enabled and checked | | `uncheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The container color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when enabled and unchecked | | `uncheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The content color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when enabled and unchecked | | `disabledCheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The container color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when checked and not enabled | | `disabledCheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The content color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when checked and not enabled | | `disabledUncheckedContainerColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The container color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when unchecked and not enabled | | `disabledUncheckedContentColor: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | The content color of this `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` when unchecked and not enabled | ### iconSizeFor Added in [1.6.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.6.0) ``` fun iconSizeFor(buttonSize: Dp): Dp ``` Recommended icon size for a given icon toggle button size. Ensures that the minimum recommended icon size is applied. Examples: for size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallSize()`, returns `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallIconSize()`, for size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeSize()` returns `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeIconSize()`. | Parameters | |---|---| | `buttonSize: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | The size of the icon toggle button | ### shapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun shapes(): IconToggleButtonShapes ``` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for a static `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. ### shapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun shapes(shape: Shape): IconToggleButtonShapes ``` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` for an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)` with a static shape. | Parameters | |---|---| | `shape: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` | The normal shape of the IconToggleButton. | ### variantAnimatedShapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun variantAnimatedShapes(): IconToggleButtonShapes ``` Returns the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between three `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerSize`s based on the pressed state and checked/unchecked. A simple icon toggle button using the default colors, animated on Press and Check/Uncheck: ```kotlin import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.width import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.wear.compose.material3.IconToggleButton import androidx.wear.compose.material3.IconToggleButtonDefaults import androidx.wear.compose.material3.samples.icons.WifiOffIcon import androidx.wear.compose.material3.samples.icons.WifiOnIcon var firstChecked by remember { mutableStateOf(true) } var secondChecked by remember { mutableStateOf(false) } Row( modifier = Modifier.fillMaxSize(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically, ) { IconToggleButton( checked = firstChecked, onCheckedChange = { firstChecked = !firstChecked }, shapes = IconToggleButtonDefaults.variantAnimatedShapes(), ) { if (firstChecked) { WifiOnIcon() } else { WifiOffIcon() } } Spacer(modifier = Modifier.width(5.dp)) IconToggleButton( checked = secondChecked, onCheckedChange = { secondChecked = !secondChecked }, shapes = IconToggleButtonDefaults.variantAnimatedShapes(), ) { if (secondChecked) { WifiOnIcon() } else { WifiOffIcon() } } } ``` ### variantAnimatedShapes Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` @Composable fun variantAnimatedShapes(     uncheckedShape: CornerBasedShape? = null,     checkedShape: CornerBasedShape? = null ): IconToggleButtonShapes ``` Returns an `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonShapes` with an animation between three `https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerSize`s based on the pressed state and checked/unchecked. A simple icon toggle button using the default colors, animated on Press and Check/Uncheck: ```kotlin import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.width import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.wear.compose.material3.IconToggleButton import androidx.wear.compose.material3.IconToggleButtonDefaults import androidx.wear.compose.material3.samples.icons.WifiOffIcon import androidx.wear.compose.material3.samples.icons.WifiOnIcon var firstChecked by remember { mutableStateOf(true) } var secondChecked by remember { mutableStateOf(false) } Row( modifier = Modifier.fillMaxSize(), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically, ) { IconToggleButton( checked = firstChecked, onCheckedChange = { firstChecked = !firstChecked }, shapes = IconToggleButtonDefaults.variantAnimatedShapes(), ) { if (firstChecked) { WifiOnIcon() } else { WifiOffIcon() } } Spacer(modifier = Modifier.width(5.dp)) IconToggleButton( checked = secondChecked, onCheckedChange = { secondChecked = !secondChecked }, shapes = IconToggleButtonDefaults.variantAnimatedShapes(), ) { if (secondChecked) { WifiOnIcon() } else { WifiOffIcon() } } } ``` | Parameters | |---|---| | `uncheckedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape? = null` | the unchecked shape - if null, the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#shape()` is used. | | `checkedShape: https://developer.android.com/reference/kotlin/androidx/compose/foundation/shape/CornerBasedShape? = null` | the checked shape - if null, the default `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#checkedShape()` is used. | ## Public properties ### DefaultIconSize ``` val DefaultIconSize: Dp ``` The default size of an icon when used inside an icon toggle button of size DefaultButtonSize. Use `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#iconSizeFor(androidx.compose.ui.unit.Dp)` to easily determine the icon size. ### ExtraLargeIconSize ``` val ExtraLargeIconSize: Dp ``` The size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#ExtraLargeSize()`. Use `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#iconSizeFor(androidx.compose.ui.unit.Dp)` to easily determine the icon size. ### ExtraLargeSize ``` val ExtraLargeSize: Dp ``` The recommended size for an extra icon large toggle button. It is recommended to apply this size using Modifier.touchTargetAwareSize. ### LargeIconSize ``` val LargeIconSize: Dp ``` The size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#LargeSize()`. Use `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#iconSizeFor(androidx.compose.ui.unit.Dp)` to easily determine the icon size. ### LargeSize ``` val LargeSize: Dp ``` The recommended size for a large icon toggle button. It is recommended to apply this size using Modifier.touchTargetAwareSize. ### Size ``` val Size: Dp ``` The default size applied for icon toggle buttons. It is recommended to apply this size using Modifier.touchTargetAwareSize. ### SmallIconSize ``` val SmallIconSize: Dp ``` The recommended size of an icon when used inside an icon toggle button with size `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#SmallSize()`. Use `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButtonDefaults#iconSizeFor(androidx.compose.ui.unit.Dp)` to easily determine the icon size. ### SmallSize ``` val SmallSize: Dp ``` The recommended size for a small button. It is recommended to apply this size using Modifier.touchTargetAwareSize. ### checkedShape Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` val checkedShape: CornerBasedShape ``` Recommended checked `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. ### pressedShape Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` val pressedShape: CornerBasedShape ``` Recommended pressed `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`. ### shape Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.5.0) ``` val shape: RoundedCornerShape ``` Recommended `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape` for `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/IconToggleButton.composable#IconToggleButton(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.material3.IconToggleButtonColors,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.wear.compose.material3.IconToggleButtonShapes,androidx.compose.foundation.BorderStroke,kotlin.Function1)`.