OutlinedButton

Functions summary

Unit
@Composable
@NonRestartableComposable
OutlinedButton(
    onClick: () -> Unit,
    modifier: Modifier,
    enabled: Boolean,
    interactionSource: MutableInteractionSource?,
    elevation: ButtonElevation?,
    shape: Shape,
    border: BorderStroke?,
    colors: ButtonColors,
    contentPadding: PaddingValues,
    content: @Composable RowScope.() -> Unit
)

Material Design outlined button

Cmn

Functions

OutlinedButton

@Composable
@NonRestartableComposable
fun OutlinedButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource? = null,
    elevation: ButtonElevation? = null,
    shape: Shape = MaterialTheme.shapes.small,
    border: BorderStroke? = ButtonDefaults.outlinedBorder,
    colors: ButtonColors = ButtonDefaults.outlinedButtonColors(),
    contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
    content: @Composable RowScope.() -> Unit
): Unit

Material Design outlined button

Outlined buttons are medium-emphasis buttons. They contain actions that are important, but aren't the primary action in an app.

Outlined button
image

The default text style for internal Text components will be set to Typography.button.

import androidx.compose.material.Button
import androidx.compose.material.OutlinedButton
import androidx.compose.material.Text

OutlinedButton(onClick = { /* Do something! */ }) { Text("Outlined Button") }
Parameters
onClick: () -> Unit

Will be called when the user clicks the button

modifier: Modifier = Modifier

Modifier to be applied to the button

enabled: Boolean = true

Controls the enabled state of the button. When false, this button will not be clickable

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.

elevation: ButtonElevation? = null

ButtonElevation used to resolve the elevation for this button in different states. An OutlinedButton typically has no elevation, see Button for a button with elevation.

shape: Shape = MaterialTheme.shapes.small

Defines the button's shape as well as its shadow

border: BorderStroke? = ButtonDefaults.outlinedBorder

Border to draw around the button

colors: ButtonColors = ButtonDefaults.outlinedButtonColors()

ButtonColors that will be used to resolve the background and content color for this button in different states. See ButtonDefaults.outlinedButtonColors.

contentPadding: PaddingValues = ButtonDefaults.ContentPadding

The spacing values to apply internally between the container and the content

content: @Composable RowScope.() -> Unit

The content displayed on the button, expected to be text, icon or image.