Button

Functions summary

Unit
@Composable
Button(
    onClick: () -> Unit,
    modifier: Modifier,
    enabled: Boolean,
    buttonSize: ButtonSize,
    leadingIcon: (@Composable () -> Unit)?,
    trailingIcon: (@Composable () -> Unit)?,
    shape: Shape,
    color: Color,
    contentColor: Color,
    border: BorderStroke?,
    contentPadding: PaddingValues,
    interactionSource: MutableInteractionSource?,
    content: @Composable RowScope.() -> Unit
)

Button is a component used for exposing actions to a user.

Functions

Button

@Composable
fun Button(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    buttonSize: ButtonSize = ButtonSize.Medium,
    leadingIcon: (@Composable () -> Unit)? = null,
    trailingIcon: (@Composable () -> Unit)? = null,
    shape: Shape = GlimmerTheme.shapes.large,
    color: Color = GlimmerTheme.colors.surface,
    contentColor: Color = calculateContentColor(color),
    border: BorderStroke? = SurfaceDefaults.border(),
    contentPadding: PaddingValues = ButtonDefaults.contentPadding(buttonSize),
    interactionSource: MutableInteractionSource? = null,
    content: @Composable RowScope.() -> Unit
): Unit

Button is a component used for exposing actions to a user.

import androidx.xr.glimmer.Button
import androidx.xr.glimmer.Text

Button(onClick = {}) { Text("Send") }

Buttons can use icons to provide more context about the action:

import androidx.xr.glimmer.Button
import androidx.xr.glimmer.Icon
import androidx.xr.glimmer.Text

Button(onClick = {}, leadingIcon = { Icon(FavoriteIcon, "Localized description") }) {
    Text("Send")
}

There are multiple button size variants - providing a different ButtonSize will affect default values used inside this button, such as the minimum height and the size of icons inside this button. Note that you can still provide a size modifier such as androidx.compose.foundation.layout.size to change the layout size of this button, buttonSize affects default values and values internal to the button.

import androidx.xr.glimmer.Button
import androidx.xr.glimmer.ButtonSize
import androidx.xr.glimmer.Text

Button(onClick = {}, buttonSize = ButtonSize.Large) { Text("Send") }
Parameters
onClick: () -> Unit

called when this button is clicked
modifier: Modifier = Modifier

the Modifier to be applied to this button
enabled: Boolean = true

controls the enabled state of this button. When false, this button will not respond to user input
buttonSize: ButtonSize = ButtonSize.Medium

the size variant of this button, represented as a ButtonSize. Changing buttonSize will affect some default values used by this button - but the final resulting size of the button will still be calculated based on the content of the button, and any provided size modifiers such as androidx.compose.foundation.layout.size. For example, setting a 100.dp size using a size modifier will result in the same layout size regardless of buttonSize, but the provided buttonSize will affect other properties such as padding values and the size of icons.
leadingIcon: (@Composable () -> Unit)? = null

optional leading icon to be placed before the content. This is typically an Icon.
trailingIcon: (@Composable () -> Unit)? = null

optional trailing icon to be placed after the content. This is typically an Icon.
shape: Shape = GlimmerTheme.shapes.large

the Shape used to clip this button, and also used to draw the background and border
color: Color = GlimmerTheme.colors.surface

background color of this button
contentColor: Color = calculateContentColor(color)

content color used by components inside content
border: BorderStroke? = SurfaceDefaults.border()

the border to draw around this button
contentPadding: PaddingValues = ButtonDefaults.contentPadding(buttonSize)

the spacing values to apply internally between the container and the content
interactionSource: MutableInteractionSource? = null

an optional hoisted MutableInteractionSource for observing and emitting Interactions for this button. You can use this to change the button's appearance or preview the button in different states. Note that if null is provided, interactions will still happen internally.
content: @Composable RowScope.() -> Unit

the main content, typically Text, to display inside this button