androidx.ui.foundation

Classes

Border

Class to specify border appearance.

DrawBackground

DrawBorder

DrawBordersReceiver

Collects information about the borders specified by drawBorders when its body is executed with a DrawBordersReceiver instance as argument.

ScrollerPosition

This is the state of a VerticalScroller and HorizontalScroller that allows the developer to change the scroll position by calling methods on this object.

Type-aliases

ContentGravity

Top-level functions summary

Unit
AdapterList(data: List<T>, modifier: Modifier = Modifier.None, itemCallback: (T) -> Unit)

A vertically scrolling list that only composes and lays out the currently visible items.

Border
Border(size: Dp, color: Color)

Create Border class with size and Color

Unit
Box(modifier: Modifier = Modifier.None, shape: Shape = RectangleShape, backgroundColor: Color = Color.Transparent, border: Border? = null, padding: Dp = border?.size ?: 0.dp, paddingStart: Dp = Dp.Unspecified, paddingTop: Dp = Dp.Unspecified, paddingEnd: Dp = Dp.Unspecified, paddingBottom: Dp = Dp.Unspecified, gravity: ContentGravity = ContentGravity.TopStart, children: () -> Unit = emptyContent())

A convenience composable that combines common layout and draw logic.

Unit
Canvas(modifier: Modifier, onCanvas: CanvasScope.() -> Unit)

Component that allow you to specify an area on the screen and perform canvas drawing on this area.

Unit
Clickable(onClick: () -> Unit, modifier: Modifier = Modifier.None, enabled: Boolean = true, onClickLabel: String? = null, children: () -> Unit)

Combines TapGestureDetector and Semantics for the clickable components like Button.

Unit
ClickableText(text: AnnotatedString, modifier: Modifier = Modifier.None, style: TextStyle = TextStyle.Default, softWrap: Boolean = true, overflow: TextOverflow = TextOverflow.Clip, maxLines: Int = Int.MAX_VALUE, onTextLayout: (TextLayoutResult) -> Unit = {}, onClick: (Int) -> Unit)

A continent version of Text component to be able to handle click event on the text.

Unit
ColoredRect(brush: Brush, modifier: Modifier = Modifier.None, width: Dp? = null, height: Dp? = null)

Component that represents a rectangle painted with the specified Brush.

Unit
ColoredRect(color: Color, modifier: Modifier = Modifier.None, width: Dp? = null, height: Dp? = null)

Component that represents a rectangle painted with a solid color.

Unit
DeterminateProgressIndicator(progress: Float, children: () -> Unit)

Contains the Semantics required for a determinate progress indicator, that represents progress ranging from 0.

Unit
Dialog(onCloseRequest: () -> Unit, children: () -> Unit)

Opens a dialog with the given content.

DrawBackground
DrawBackground(color: Color, shape: Shape = RectangleShape)

Returns a DrawModifier that draws shape with a solid color, with the size of the layout's rectangle.

DrawBackground
DrawBackground(brush: Brush, shape: Shape = RectangleShape)

Returns a DrawModifier that draws shape with brush, with the size of the layout's rectangle.

DrawBorder
DrawBorder(border: Border, shape: Shape = RectangleShape)

Returns a Modifier that adds border with appearance specified with a border and a shape

DrawBorder
DrawBorder(size: Dp, color: Color, shape: Shape = RectangleShape)

Returns a Modifier that adds border with appearance specified with size, color and a shape

DrawBorder
DrawBorder(size: Dp, brush: Brush, shape: Shape)

Returns a Modifier that adds border with appearance specified with size, brush and a shape

Unit
HorizontalScroller(scrollerPosition: ScrollerPosition = ScrollerPosition(), modifier: Modifier = Modifier.None, isScrollable: Boolean = true, child: () -> Unit)

A container that composes all of its contents and lays it out, fitting the height of the child.

Unit
Icon(asset: VectorAsset, modifier: Modifier = Modifier.None, tint: Color = contentColor())

Icon component that draws asset using tint, defaulting to contentColor.

Unit
Icon(asset: ImageAsset, modifier: Modifier = Modifier.None, tint: Color = contentColor())

Icon component that draws asset using tint, defaulting to contentColor.

Unit
Icon(painter: Painter, modifier: Modifier = Modifier.None, tint: Color = contentColor())

Icon component that draws a painter using tint, defaulting to contentColor.

Unit
Image(asset: ImageAsset, modifier: Modifier = Modifier.None, alignment: Alignment = Alignment.Center, scaleFit: ScaleFit = ScaleFit.Fit, alpha: Float = DefaultAlpha, colorFilter: ColorFilter? = null)

A composable that lays out and draws a given ImageAsset.

Unit
Image(asset: VectorAsset, modifier: Modifier = Modifier.None, alignment: Alignment = Alignment.Center, scaleFit: ScaleFit = ScaleFit.Fit, alpha: Float = DefaultAlpha, colorFilter: ColorFilter? = null)

A composable that lays out and draws a given VectorAsset.

Unit
Image(painter: Painter, modifier: Modifier = Modifier.None, alignment: Alignment = Alignment.Center, scaleFit: ScaleFit = ScaleFit.Fit, alpha: Float = DefaultAlpha, colorFilter: ColorFilter? = null)

Creates a composable that lays out and draws a given Painter.

Unit
PasswordTextField(value: String, onValueChange: (String) -> Unit = {}, textStyle: TextStyle = TextStyle.Default, mask: Char = '\u2022', imeAction: ImeAction = ImeAction.Unspecified, onFocus: () -> Unit = {}, onBlur: () -> Unit = {}, focusIdentifier: String? = null, onImeActionPerformed: (ImeAction) -> Unit = {})

A user interface element for entering and modifying password text.

Unit
ProvideContentColor(color: Color, children: () -> Unit)

Sets color as the preferred content color for children.

Unit
ProvideTextStyle(value: TextStyle, children: () -> Unit)

This component is used to set the current value of the Text style ambient.

ScrollerPosition
ScrollerPosition(initial: Float = 0f)

Create and remember the state for a VerticalScroller or HorizontalScroller based on the currently appropriate scroll configuration to allow changing scroll position or observing scroll behavior.

Unit
SimpleImage(image: ImageAsset, tint: Color? = null)

Fits an image into the container with sizes equals to the image size, while maintaining the image aspect ratio.

Unit
Text(text: String, modifier: Modifier = Modifier.None, style: TextStyle = currentTextStyle(), softWrap: Boolean = true, overflow: TextOverflow = TextOverflow.Clip, maxLines: Int = Int.MAX_VALUE, onTextLayout: (TextLayoutResult) -> Unit = {})

High level element that displays text and provides semantics / accessibility information.

Unit
Text(text: AnnotatedString, modifier: Modifier = Modifier.None, style: TextStyle = currentTextStyle(), softWrap: Boolean = true, overflow: TextOverflow = TextOverflow.Clip, maxLines: Int = Int.MAX_VALUE, onTextLayout: (TextLayoutResult) -> Unit = {})

High level element that displays text and provides semantics / accessibility information.

Unit
TextField(value: String, modifier: Modifier = Modifier.None, onValueChange: (String) -> Unit, textStyle: TextStyle = currentTextStyle(), keyboardType: KeyboardType = KeyboardType.Text, imeAction: ImeAction = ImeAction.Unspecified, onFocus: () -> Unit = {}, onBlur: () -> Unit = {}, focusIdentifier: String? = null, onImeActionPerformed: (ImeAction) -> Unit = {}, visualTransformation: VisualTransformation? = null, onTextLayout: (TextLayoutResult) -> Unit = {})

A user interface element for entering and modifying text.

Unit
TextField(value: TextFieldValue, modifier: Modifier = Modifier.None, onValueChange: (TextFieldValue) -> Unit, textStyle: TextStyle = currentTextStyle(), keyboardType: KeyboardType = KeyboardType.Text, imeAction: ImeAction = ImeAction.Unspecified, onFocus: () -> Unit = {}, onBlur: () -> Unit = {}, focusIdentifier: String? = null, onImeActionPerformed: (ImeAction) -> Unit = {}, visualTransformation: VisualTransformation? = null, onTextLayout: (TextLayoutResult) -> Unit = {})

A user interface element for entering and modifying text.

Unit
TextField(model: TextFieldValue, compositionRange: TextRange?, modifier: Modifier = Modifier.None, onValueChange: (TextFieldValue, TextRange?) -> Unit, textStyle: TextStyle = currentTextStyle(), keyboardType: KeyboardType = KeyboardType.Text, imeAction: ImeAction = ImeAction.Unspecified, onFocus: () -> Unit = {}, onBlur: () -> Unit = {}, focusIdentifier: String? = null, onImeActionPerformed: (ImeAction) -> Unit = {}, visualTransformation: VisualTransformation? = null, onTextLayout: (TextLayoutResult) -> Unit = {})

A user interface element for entering and modifying text.

Unit
VerticalScroller(scrollerPosition: ScrollerPosition = ScrollerPosition(), modifier: Modifier = Modifier.None, isScrollable: Boolean = true, child: () -> Unit)

A container that composes all of its contents and lays it out, fitting the width of the child.

Color

Returns the preferred content color at the call site's position in the hierarchy.

TextStyle

This effect is used to read the current value of the Text style ambient.

Boolean

This effect should be used to help build responsive UIs that follow the system setting, to avoid harsh contrast changes when switching between applications.

Extension functions summary

For Modifier
Modifier

Draws shape with paint behind the content.

Modifier
Modifier.drawBackground(color: Color, shape: Shape = RectangleShape)

Draws shape with a solid color behind the content.

Modifier
Modifier.drawBackground(brush: Brush, shape: Shape = RectangleShape)

Draws shape with brush behind the content.

For TableChildren
Unit
TableChildren.drawBorders(defaultBorder: Border = Border(color = Color.Black, size = Dp.Hairline), block: DrawBordersReceiver.() -> Unit)

Adds border drawing for a Table layout, when placed inside the TableChildren block.

Top-level functions

AdapterList

@Composable fun <T> AdapterList(
    data: List<T>,
    modifier: Modifier = Modifier.None,
    itemCallback: (T) -> Unit
): Unit

A vertically scrolling list that only composes and lays out the currently visible items.

Parameters
data: List<T> the backing list of data to display
modifier: Modifier = Modifier.None the modifier to apply to this AdapterList
itemCallback: (T) -> Unit a callback that takes an item from data and emits the UI for that item. May emit any number of components, which will be stacked vertically

Border

fun Border(
    size: Dp,
    color: Color
): Border

Create Border class with size and Color

Parameters
size: Dp size of the border in Dp. Use Dp.Hairline for one-pixel border.
color: Color color to paint the border with

Box

@Composable fun Box(
    modifier: Modifier = Modifier.None,
    shape: Shape = RectangleShape,
    backgroundColor: Color = Color.Transparent,
    border: Border? = null,
    padding: Dp = border?.size ?: 0.dp,
    paddingStart: Dp = Dp.Unspecified,
    paddingTop: Dp = Dp.Unspecified,
    paddingEnd: Dp = Dp.Unspecified,
    paddingBottom: Dp = Dp.Unspecified,
    gravity: ContentGravity = ContentGravity.TopStart,
    children: () -> Unit = emptyContent()
): Unit

A convenience composable that combines common layout and draw logic.

In order to define the size of the Box, the androidx.ui.layout.LayoutWidth, androidx.ui.layout.LayoutHeight and androidx.ui.layout.LayoutSize modifiers can be used. The Box will try to be only as small as its content. However, if it is constrained otherwise, Box will allow its content to be smaller and will position the content inside, according to gravity.

The specified padding will be applied inside the Box. In order to apply padding outside the Box, the androidx.ui.layout.LayoutPadding modifier should be used.


//Unresolved: androidx.ui.foundation.samples.SimpleCircleBox
Parameters
modifier: Modifier = Modifier.None The modifier to be applied to the Box
shape: Shape = RectangleShape The shape of the box
backgroundColor: Color = Color.Transparent The Color for background with. If Color.Transparent, there will be no background
border: Border? = null Border object that specifies border appearance, such as size and color. If null, there will be no border
padding: Dp = border?.size ?: 0.dp The padding to be applied inside Box, along its edges. Unless otherwise specified, content will be padded by the Border.size, if border is provided
paddingStart: Dp = Dp.Unspecified sets the padding of the start edge. Setting this will override padding for the start edge
paddingTop: Dp = Dp.Unspecified sets the padding of the top edge. Setting this will override padding for the top edge
paddingEnd: Dp = Dp.Unspecified sets the padding of the end edge. Setting this will override padding for the end edge
paddingBottom: Dp = Dp.Unspecified sets the padding of the bottom edge. Setting this will override padding for the bottom edge
gravity: ContentGravity = ContentGravity.TopStart The gravity of the content inside Box

Canvas

@Composable fun Canvas(
    modifier: Modifier,
    onCanvas: CanvasScope.() -> Unit
): Unit

Component that allow you to specify an area on the screen and perform canvas drawing on this area. You MUST specify size with modifier, whether with exact sizes via LayoutSize modifier, or relative to parent, via LayoutSize.Fill, ColumnScope.LayoutWeight, etc. If parent wraps this child, only exact sizes must be specified.


//Unresolved: androidx.ui.foundation.samples.CanvasSample
Parameters
modifier: Modifier mandatory modifier to specify size strategy for this composable
onCanvas: CanvasScope.() -> Unit lambda that will be called to perform drawing. Note that this lambda will be called during draw stage, you have no access to composition scope, meaning that Composable function invocation inside it will result to runtime exception

Clickable

@Composable fun Clickable(
    onClick: () -> Unit,
    modifier: Modifier = Modifier.None,
    enabled: Boolean = true,
    onClickLabel: String? = null,
    children: () -> Unit
): Unit

Combines TapGestureDetector and Semantics for the clickable components like Button.


//Unresolved: androidx.ui.foundation.samples.ClickableSample
Parameters
onClick: () -> Unit will be called when user clicked on the button
modifier: Modifier = Modifier.None allows to provide a modifier to be added before the gesture detector, for example Ripple should be added at this point. this will be easier once we migrate this function to a Modifier
enabled: Boolean = true Controls the enabled state. When false, this component will not be clickable

ClickableText

@Composable fun ClickableText(
    text: AnnotatedString,
    modifier: Modifier = Modifier.None,
    style: TextStyle = TextStyle.Default,
    softWrap: Boolean = true,
    overflow: TextOverflow = TextOverflow.Clip,
    maxLines: Int = Int.MAX_VALUE,
    onTextLayout: (TextLayoutResult) -> Unit = {},
    onClick: (Int) -> Unit
): Unit

A continent version of Text component to be able to handle click event on the text.

This is a shorthand of Text with PressIndicatorGestureDetector to be able to handle click event easily.


//Unresolved: androidx.ui.foundation.samples.ClickableText
For other gestures, e.g. long press, dragging, follow sample code.

//Unresolved: androidx.ui.foundation.samples.LongClickableText
Parameters
text: AnnotatedString The text to be displayed.
modifier: Modifier = Modifier.None Modifier to apply to this layout node.
style: TextStyle = TextStyle.Default Style configuration for the text such as color, font, line height etc.
softWrap: Boolean = true Whether the text should break at soft line breaks. If false, the glyphs in the text will be positioned as if there was unlimited horizontal space. If softWrap is false, overflow and TextAlign may have unexpected effects.
overflow: TextOverflow = TextOverflow.Clip How visual overflow should be handled.
maxLines: Int = Int.MAX_VALUE An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated according to overflow and softWrap. If it is not null, then it must be greater than zero.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.
onClick: (Int) -> Unit Callback that is executed when users click the text. This callback is called with clicked character's offset.

ColoredRect

@Composable fun ColoredRect(
    brush: Brush,
    modifier: Modifier = Modifier.None,
    width: Dp? = null,
    height: Dp? = null
): Unit

Component that represents a rectangle painted with the specified Brush.

If width and/or height are not specified, this component will expand to the corresponding max constraints received from the parent if these are finite, or to the min constraints otherwise. Note that even if width and height are specified, these will not be satisfied if the component's incoming layout constraints do not allow that.


//Unresolved: androidx.ui.foundation.samples.ColoredRectBrushSample
Parameters
brush: Brush brush to paint rect with
width: Dp? = null width of this rect, by default it will match incoming layout constraints
height: Dp? = null height of this rect, by default it will match incoming layout constraints

ColoredRect

@Composable fun ColoredRect(
    color: Color,
    modifier: Modifier = Modifier.None,
    width: Dp? = null,
    height: Dp? = null
): Unit

Component that represents a rectangle painted with a solid color.


//Unresolved: androidx.ui.foundation.samples.ColoredRectColorSample
Parameters
color: Color color to paint rect with
width: Dp? = null width of this rect, by default it will match parent's constraints
height: Dp? = null height of this rect, by default it will match parent's constraints

DeterminateProgressIndicator

@Composable fun DeterminateProgressIndicator(
    progress: Float,
    children: () -> Unit
): Unit

Contains the Semantics required for a determinate progress indicator, that represents progress ranging from 0.0 to 1.0.


//Unresolved: androidx.ui.foundation.samples.DeterminateProgressSample
Parameters
progress: Float The progress of this progress indicator, where 0.0 represents no progress and 1.0 represents full progress
children: () -> Unit The progress indicator that is drawn on screen, representing progress
Exceptions
IllegalArgumentException when the progress is not within range

Dialog

@Composable fun Dialog(
    onCloseRequest: () -> Unit,
    children: () -> Unit
): Unit

Opens a dialog with the given content.

The dialog is visible as long as it is part of the composition hierarchy. In order to let the user dismiss the Dialog, the implementation of onCloseRequest should contain a way to remove to remove the dialog from the composition hierarchy.

Example usage:


//Unresolved: androidx.ui.foundation.samples.DialogSample
Parameters
onCloseRequest: () -> Unit Executes when the user tries to dismiss the Dialog.
children: () -> Unit The content to be displayed inside the dialog.

DrawBackground

@Composable fun DrawBackground(
    color: Color,
    shape: Shape = RectangleShape
): DrawBackground

Deprecated.

Returns a DrawModifier that draws shape with a solid color, with the size of the layout's rectangle.


//Unresolved: androidx.ui.foundation.samples.DrawBackgroundColor
Parameters
color: Color color to paint background with
shape: Shape = RectangleShape desired shape of the background

DrawBackground

@Composable fun DrawBackground(
    brush: Brush,
    shape: Shape = RectangleShape
): DrawBackground

Deprecated.

Returns a DrawModifier that draws shape with brush, with the size of the layout's rectangle.


//Unresolved: androidx.ui.foundation.samples.DrawBackgroundShapedBrush
Parameters
brush: Brush brush to paint background with
shape: Shape = RectangleShape desired shape of the background

DrawBorder

@Composable fun DrawBorder(
    border: Border,
    shape: Shape = RectangleShape
): DrawBorder

Returns a Modifier that adds border with appearance specified with a border and a shape


//Unresolved: androidx.ui.foundation.samples.BorderSample
()
Parameters
border: Border Border class that specifies border appearance, such as size and color
shape: Shape = RectangleShape shape of the border

DrawBorder

@Composable fun DrawBorder(
    size: Dp,
    color: Color,
    shape: Shape = RectangleShape
): DrawBorder

Returns a Modifier that adds border with appearance specified with size, color and a shape


//Unresolved: androidx.ui.foundation.samples.BorderSampleWithDataClass
()
Parameters
size: Dp width of the border. Use Dp.Hairline for a hairline border.
color: Color color to paint the border with
shape: Shape = RectangleShape shape of the border

DrawBorder

@Composable fun DrawBorder(
    size: Dp,
    brush: Brush,
    shape: Shape
): DrawBorder

Returns a Modifier that adds border with appearance specified with size, brush and a shape


//Unresolved: androidx.ui.foundation.samples.BorderSampleWithBrush
()
Parameters
size: Dp width of the border. Use Dp.Hairline for a hairline border.
brush: Brush brush to paint the border with
shape: Shape shape of the border

HorizontalScroller

@Composable fun HorizontalScroller(
    scrollerPosition: ScrollerPosition = ScrollerPosition(),
    modifier: Modifier = Modifier.None,
    isScrollable: Boolean = true,
    child: () -> Unit
): Unit

A container that composes all of its contents and lays it out, fitting the height of the child. If the child's width is less than the Constraints.maxWidth, the child's width is used, or the Constraints.maxWidth otherwise. If the contents don't fit the width, the drag gesture allows scrolling its content horizontally. The contents of the HorizontalScroller are clipped to the HorizontalScroller's bounds.


//Unresolved: androidx.ui.foundation.samples.SimpleHorizontalScrollerSample
If you want to control scrolling position from the code, e.g smooth scroll to position,you must own memorized instance of ScrollerPosition and then use it to call scrollTo...functions on it. Same tactic can be applied to the VerticalScroller

//Unresolved: androidx.ui.foundation.samples.ControlledHorizontalScrollerSample
Parameters
scrollerPosition: ScrollerPosition = ScrollerPosition() state of this Scroller that holds current scroll position and provides user with useful methods like smooth scrolling
modifier: Modifier = Modifier.None Modifier to be applied to the Scroller content layout
isScrollable: Boolean = true param to enabled or disable touch input scrolling, default is true

Icon

@Composable fun Icon(
    asset: VectorAsset,
    modifier: Modifier = Modifier.None,
    tint: Color = contentColor()
): Unit

Icon component that draws asset using tint, defaulting to contentColor.

Parameters
asset: VectorAsset VectorAsset to draw inside this Icon
modifier: Modifier = Modifier.None optional Modifier for this Icon
tint: Color = contentColor() tint to be applied to asset

Icon

@Composable fun Icon(
    asset: ImageAsset,
    modifier: Modifier = Modifier.None,
    tint: Color = contentColor()
): Unit

Icon component that draws asset using tint, defaulting to contentColor.

Parameters
asset: ImageAsset ImageAsset to draw inside this Icon
modifier: Modifier = Modifier.None optional Modifier for this Icon
tint: Color = contentColor() tint to be applied to asset

Icon

@Composable fun Icon(
    painter: Painter,
    modifier: Modifier = Modifier.None,
    tint: Color = contentColor()
): Unit

Icon component that draws a painter using tint, defaulting to contentColor.

Parameters
painter: Painter Painter to draw inside this Icon
modifier: Modifier = Modifier.None optional Modifier for this Icon
tint: Color = contentColor() tint to be applied to painter

Image

@Composable inline fun Image(
    asset: ImageAsset,
    modifier: Modifier = Modifier.None,
    alignment: Alignment = Alignment.Center,
    scaleFit: ScaleFit = ScaleFit.Fit,
    alpha: Float = DefaultAlpha,
    colorFilter: ColorFilter? = null
): Unit

A composable that lays out and draws a given ImageAsset. This will attempt to size the composable according to the ImageAsset's given width and height. However, an optional Modifier parameter can be provided to adjust sizing or draw additional content (ex. background). Any unspecified dimension will leverage the ImageAsset's size as a minimum constraint.


//Unresolved: androidx.ui.foundation.samples.ImageSample
Parameters
asset: ImageAsset The ImageAsset to draw.
modifier: Modifier = Modifier.None Modifier used to adjust the layout algorithm or draw decoration content (ex. background)
alignment: Alignment = Alignment.Center Optional alignment parameter used to place the ImageAsset in the given bounds defined by the width and height.
scaleFit: ScaleFit = ScaleFit.Fit Optional scale parameter used to determine the aspect ratio scaling to be used if the bounds are a different size from the intrinsic size of the ImageAsset.
alpha: Float = DefaultAlpha Optional opacity to be applied to the ImageAsset when it is rendered onscreen
colorFilter: ColorFilter? = null Optional ColorFilter to apply for the ImageAsset when it is rendered onscreen

Image

@Composable inline fun Image(
    asset: VectorAsset,
    modifier: Modifier = Modifier.None,
    alignment: Alignment = Alignment.Center,
    scaleFit: ScaleFit = ScaleFit.Fit,
    alpha: Float = DefaultAlpha,
    colorFilter: ColorFilter? = null
): Unit

A composable that lays out and draws a given VectorAsset. This will attempt to size the composable according to the VectorAsset's given width and height. However, an optional Modifier parameter can be provided to adjust sizing or draw additional content (ex. background). Any unspecified dimension will leverage the VectorAsset's size as a minimum constraint.


//Unresolved: androidx.ui.foundation.samples.ImageVectorAssetSample
Parameters
asset: VectorAsset The VectorAsset to draw.
modifier: Modifier = Modifier.None Modifier used to adjust the layout algorithm or draw decoration content (ex. background)
alignment: Alignment = Alignment.Center Optional alignment parameter used to place the VectorAsset in the given bounds defined by the width and height.
scaleFit: ScaleFit = ScaleFit.Fit Optional scale parameter used to determine the aspect ratio scaling to be used if the bounds are a different size from the intrinsic size of the VectorAsset.
alpha: Float = DefaultAlpha Optional opacity to be applied to the VectorAsset when it is rendered onscreen
colorFilter: ColorFilter? = null Optional ColorFilter to apply for the VectorAsset when it is rendered onscreen

Image

@Composable fun Image(
    painter: Painter,
    modifier: Modifier = Modifier.None,
    alignment: Alignment = Alignment.Center,
    scaleFit: ScaleFit = ScaleFit.Fit,
    alpha: Float = DefaultAlpha,
    colorFilter: ColorFilter? = null
): Unit

Creates a composable that lays out and draws a given Painter. This will attempt to size the composable according to the Painter's intrinsic size. However, an optional Modifier parameter can be provided to adjust sizing or draw additional content (ex. background)

NOTE a Painter might not have an intrinsic size, so if no LayoutModifier is provided as part of the Modifier chain this might size the Image composable to a width and height of zero and will not draw any content. This can happen for Painter implementations that always attempt to fill the bounds like ColorPainter


//Unresolved: androidx.ui.foundation.samples.ImagePainterSample
Parameters
painter: Painter to draw
modifier: Modifier = Modifier.None Modifier used to adjust the layout algorithm or draw decoration content (ex. background)
alignment: Alignment = Alignment.Center Optional alignment parameter used to place the Painter in the given bounds defined by the width and height.
scaleFit: ScaleFit = ScaleFit.Fit Optional scale parameter used to determine the aspect ratio scaling to be used if the bounds are a different size from the intrinsic size of the Painter.
alpha: Float = DefaultAlpha Optional opacity to be applied to the Painter when it is rendered onscreen the default renders the Painter completely opaque
colorFilter: ColorFilter? = null Optional colorFilter to apply for the Painter when it is rendered onscreen

PasswordTextField

@Composable fun PasswordTextField(
    value: String,
    onValueChange: (String) -> Unit = {},
    textStyle: TextStyle = TextStyle.Default,
    mask: Char = '\u2022',
    imeAction: ImeAction = ImeAction.Unspecified,
    onFocus: () -> Unit = {},
    onBlur: () -> Unit = {},
    focusIdentifier: String? = null,
    onImeActionPerformed: (ImeAction) -> Unit = {}
): Unit

A user interface element for entering and modifying password text.

The PasswordTextField component renders an input with masking characters, i.e. bullet. Once input service modify the text, you will get callback onValueChange with new text. Then, you can set this new text so that this component renders up-to-date text from input service.

Example usage:


//Unresolved: androidx.ui.foundation.samples.PasswordTextFieldSample
Parameters
value: String The text to be shown in the TextField. If you want to specify cursor location or selection range, use TextField with TextFieldValue instead.
onValueChange: (String) -> Unit = {} Called when the input service updates the text. When the input service update the text, this callback is called with the updated text. If you want to observe the cursor location or selection range, use TextField with TextFieldValue instead.
textStyle: TextStyle = TextStyle.Default Style configuration that applies at character level such as color, font etc.
mask: Char = '\u2022' The character shown instead of plaint text.
imeAction: ImeAction = ImeAction.Unspecified The IME action. This IME action is honored by IME and may show specific icons on the keyboard. For example, search icon may be shown if ImeAction.Search is specified. Then, when user tap that key, the onImeActionPerformed callback is called with specified ImeAction.
onFocus: () -> Unit = {} Called when the input field gains focus.
onBlur: () -> Unit = {} Called when the input field loses focus.
focusIdentifier: String? = null Optional value to identify focus identifier. You can pass FocusManager.requestFocus to this value to move focus to this TextField. This identifier must be unique in your app. If you have duplicated identifiers, the behavior is undefined.
onImeActionPerformed: (ImeAction) -> Unit = {} Called when the input service requested an IME action. When the input service emitted an IME action, this callback is called with the emitted IME action. Note that this IME action may be different from what you specified in imeAction.

ProvideContentColor

@Composable fun ProvideContentColor(
    color: Color,
    children: () -> Unit
): Unit

Sets color as the preferred content color for children. This color can then be retrieved inside children by using contentColor. Typography and iconography should use this value as their default color.

ProvideTextStyle

@Composable fun ProvideTextStyle(
    value: TextStyle,
    children: () -> Unit
): Unit

This component is used to set the current value of the Text style ambient. The given style will be merged with the current style values for any missing attributes. Any Text components included in this component's children will be styled with this style unless styled explicitly.

ScrollerPosition

@Composable fun ScrollerPosition(initial: Float = 0f): ScrollerPosition

Create and remember the state for a VerticalScroller or HorizontalScroller based on the currently appropriate scroll configuration to allow changing scroll position or observing scroll behavior.

Parameters
initial: Float = 0f initial scroller position to start with

SimpleImage

@Composable fun SimpleImage(
    image: ImageAsset,
    tint: Color? = null
): Unit

Deprecated.

Fits an image into the container with sizes equals to the image size, while maintaining the image aspect ratio. The image will be clipped if the aspect ratios of the image and the parent don't match.

This component has the same behavior as ImageView.ScaleType.CENTER_CROP currently.

Parameters
image: ImageAsset The image to draw.
tint: Color? = null The tint color to apply for the image.

Text

@Composable fun Text(
    text: String,
    modifier: Modifier = Modifier.None,
    style: TextStyle = currentTextStyle(),
    softWrap: Boolean = true,
    overflow: TextOverflow = TextOverflow.Clip,
    maxLines: Int = Int.MAX_VALUE,
    onTextLayout: (TextLayoutResult) -> Unit = {}
): Unit

High level element that displays text and provides semantics / accessibility information.

The default style uses the currentTextStyle defined by a theme. In addition, if no text color is manually specified in style then the text color will be contentColor.

Parameters
text: String The text to be displayed.
modifier: Modifier = Modifier.None Modifier to apply to this layout node.
style: TextStyle = currentTextStyle() Style configuration for the text such as color, font, line height etc.
softWrap: Boolean = true Whether the text should break at soft line breaks. If false, the glyphs in the text will be positioned as if there was unlimited horizontal space. If softWrap is false, overflow and TextAlign may have unexpected effects.
overflow: TextOverflow = TextOverflow.Clip How visual overflow should be handled.
maxLines: Int = Int.MAX_VALUE An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated according to overflow and softWrap. If it is not null, then it must be greater than zero.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.

Text

@Composable fun Text(
    text: AnnotatedString,
    modifier: Modifier = Modifier.None,
    style: TextStyle = currentTextStyle(),
    softWrap: Boolean = true,
    overflow: TextOverflow = TextOverflow.Clip,
    maxLines: Int = Int.MAX_VALUE,
    onTextLayout: (TextLayoutResult) -> Unit = {}
): Unit

High level element that displays text and provides semantics / accessibility information.

The default style uses the currentTextStyle defined by a theme. In addition, if no text color is manually specified in style then the text color will be contentColor.

Parameters
text: AnnotatedString The text to be displayed.
modifier: Modifier = Modifier.None Modifier to apply to this layout node.
style: TextStyle = currentTextStyle() Style configuration for the text such as color, font, line height etc.
softWrap: Boolean = true Whether the text should break at soft line breaks. If false, the glyphs in the text will be positioned as if there was unlimited horizontal space. If softWrap is false, overflow and TextAlign may have unexpected effects.
overflow: TextOverflow = TextOverflow.Clip How visual overflow should be handled.
maxLines: Int = Int.MAX_VALUE An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated according to overflow and softWrap. If it is not null, then it must be greater than zero.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.

TextField

@Composable fun TextField(
    value: String,
    modifier: Modifier = Modifier.None,
    onValueChange: (String) -> Unit,
    textStyle: TextStyle = currentTextStyle(),
    keyboardType: KeyboardType = KeyboardType.Text,
    imeAction: ImeAction = ImeAction.Unspecified,
    onFocus: () -> Unit = {},
    onBlur: () -> Unit = {},
    focusIdentifier: String? = null,
    onImeActionPerformed: (ImeAction) -> Unit = {},
    visualTransformation: VisualTransformation? = null,
    onTextLayout: (TextLayoutResult) -> Unit = {}
): Unit

A user interface element for entering and modifying text.

The TextField component renders an input and additional decorations set by input service which is software keyboard in Android. Once input service modify the text, you will get callback onValueChange with new text. Then, you can set this new text so that this component renders up-to-date text from input service.

Example usage:


//Unresolved: androidx.ui.foundation.samples.StringTextFieldSample

This is the most simple TextField that observes only text update and have control only for the text. If you want to change/observe the selection/cursor location, you can use TextField with TextFieldValue object.

Note: Please be careful if you setting text other than the one passed to onValueChange callback. Especially, it is not recommended to modify the text passed to onValueChange callback. The text change may be translated to full context reset by input service and end up with input session restart. This will be visible to users, for example, any ongoing composition text will be cleared or committed, then software keyboard may go back to the default one.

Parameters
value: String The text to be shown in the TextField. If you want to specify cursor location or selection range, use TextField with TextFieldValue instead.
onValueChange: (String) -> Unit Called when the input service updates the text. When the input service update the text, this callback is called with the updated text. If you want to observe the cursor location or selection range, use TextField with TextFieldValue instead.
textStyle: TextStyle = currentTextStyle() Style configuration that applies at character level such as color, font etc.
keyboardType: KeyboardType = KeyboardType.Text The keyboard type to be used in this text field. Note that this input type is honored by IME and shows corresponding keyboard but this is not guaranteed. For example, some IME may send non-ASCII character even if you set KeyboardType.Ascii.
imeAction: ImeAction = ImeAction.Unspecified The IME action. This IME action is honored by IME and may show specific icons on the keyboard. For example, search icon may be shown if ImeAction.Search is specified. Then, when user tap that key, the onImeActionPerformed callback is called with specified ImeAction.
onFocus: () -> Unit = {} Called when the input field gains focus.
onBlur: () -> Unit = {} Called when the input field loses focus.
focusIdentifier: String? = null Optional value to identify focus identifier. You can pass FocusManager.requestFocus to this value to move focus to this TextField. This identifier must be unique in your app. If you have duplicated identifiers, the behavior is undefined.
onImeActionPerformed: (ImeAction) -> Unit = {} Called when the input service requested an IME action. When the input service emitted an IME action, this callback is called with the emitted IME action. Note that this IME action may be different from what you specified in imeAction.
visualTransformation: VisualTransformation? = null Optional visual filter for changing visual output of input field.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.

TextField

@Composable fun TextField(
    value: TextFieldValue,
    modifier: Modifier = Modifier.None,
    onValueChange: (TextFieldValue) -> Unit,
    textStyle: TextStyle = currentTextStyle(),
    keyboardType: KeyboardType = KeyboardType.Text,
    imeAction: ImeAction = ImeAction.Unspecified,
    onFocus: () -> Unit = {},
    onBlur: () -> Unit = {},
    focusIdentifier: String? = null,
    onImeActionPerformed: (ImeAction) -> Unit = {},
    visualTransformation: VisualTransformation? = null,
    onTextLayout: (TextLayoutResult) -> Unit = {}
): Unit

A user interface element for entering and modifying text.

The TextField component renders an input and additional decorations set by input service which is software keyboard in Android. Once input service modify the text, you will get callback onValueChange with new text. Then, you can set this new text so that this component renders up-to-date text from input service.

Example usage:


//Unresolved: androidx.ui.foundation.samples.EditorModelTextFieldSample
Note: Please be careful if you setting model other than the one passed to onValueChangecallback including selection or cursor. Especially, it is not recommended to modify the modelpassed to onValueChange callback. Any change to text, selection or cursor may be translated tofull context reset by input service and end up with input session restart. This will be visibleto users, for example, any ongoing composition text will be cleared or committed, then softwarekeyboard may go back to the default one.
Parameters
value: TextFieldValue The TextFieldValue to be shown in the TextField.
onValueChange: (TextFieldValue) -> Unit Called when the input service updates the text, selection or cursor. When the input service update the text, selection or cursor, this callback is called with the updated TextFieldValue. If you want to observe the composition text, use TextField with compositionRange instead.
textStyle: TextStyle = currentTextStyle() Style configuration that applies at character level such as color, font etc.
keyboardType: KeyboardType = KeyboardType.Text The keyboard type to be used in this text field. Note that this input type is honored by IME and shows corresponding keyboard but this is not guaranteed. For example, some IME may send non-ASCII character even if you set KeyboardType.Ascii.
imeAction: ImeAction = ImeAction.Unspecified The IME action. This IME action is honored by IME and may show specific icons on the keyboard. For example, search icon may be shown if ImeAction.Search is specified. Then, when user tap that key, the onImeActionPerformed callback is called with specified ImeAction.
onFocus: () -> Unit = {} Called when the input field gains focus.
onBlur: () -> Unit = {} Called when the input field loses focus.
focusIdentifier: String? = null Optional value to identify focus identifier. You can pass FocusManager.requestFocus to this value to move focus to this TextField. This identifier must be unique in your app. If you have duplicated identifiers, the behavior is undefined.
onImeActionPerformed: (ImeAction) -> Unit = {} Called when the input service requested an IME action. When the input service emitted an IME action, this callback is called with the emitted IME action. Note that this IME action may be different from what you specified in imeAction.
visualTransformation: VisualTransformation? = null Optional visual filter for changing visual output of input field.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.

TextField

@Composable fun TextField(
    model: TextFieldValue,
    compositionRange: TextRange?,
    modifier: Modifier = Modifier.None,
    onValueChange: (TextFieldValue, TextRange?) -> Unit,
    textStyle: TextStyle = currentTextStyle(),
    keyboardType: KeyboardType = KeyboardType.Text,
    imeAction: ImeAction = ImeAction.Unspecified,
    onFocus: () -> Unit = {},
    onBlur: () -> Unit = {},
    focusIdentifier: String? = null,
    onImeActionPerformed: (ImeAction) -> Unit = {},
    visualTransformation: VisualTransformation? = null,
    onTextLayout: (TextLayoutResult) -> Unit = {}
): Unit

A user interface element for entering and modifying text.

The TextField component renders an input and additional decorations set by input service which is software keyboard in Android. Once input service modify the text, you will get callback onValueChange with new text. Then, you can set this new text so that this component renders up-to-date text from input service.

Example usage:


//Unresolved: androidx.ui.foundation.samples.CompositionEditorModelTextFieldSample

It is not recommended to use this component unless you are interested in composition region. The composition text is set by input service and you don't have control of it. If you modify composition, the input service may confuse and restart new input session. Also please do not expect no composition range at the beginning of input session. The input service may convert existing text to composition text at the beginning of the input session.

Note: Please be careful if you setting model other than the one passed to onValueChange callback including selection or cursor. Especially, it is not recommended to modify the model passed to onValueChange callback. Any change to text, selection or cursor may be translated to full context reset by input service and end up with input session restart. This will be visible to users, for example, any ongoing composition text will be cleared or committed, then software keyboard may go back to the default one.

Parameters
model: TextFieldValue The TextFieldValue to be shown in the TextField.
onValueChange: (TextFieldValue, TextRange?) -> Unit Called when the input service updates the text, selection or cursor. When the input service update the text, selection or cursor, this callback is called with the updated TextFieldValue.
textStyle: TextStyle = currentTextStyle() Style configuration that applies at character level such as color, font etc.
keyboardType: KeyboardType = KeyboardType.Text The keyboard type to be used in this text field. Note that this input type is honored by IME and shows corresponding keyboard but this is not guaranteed. For example, some IME may send non-ASCII character even if you set KeyboardType.Ascii.
imeAction: ImeAction = ImeAction.Unspecified The IME action. This IME action is honored by IME and may show specific icons on the keyboard. For example, search icon may be shown if ImeAction.Search is specified. Then, when user tap that key, the onImeActionPerformed callback is called with specified ImeAction.
onFocus: () -> Unit = {} Called when the input field gains focus.
onBlur: () -> Unit = {} Called when the input field loses focus.
focusIdentifier: String? = null Optional value to identify focus identifier. You can pass FocusManager.requestFocus to this value to move focus to this TextField. This identifier must be unique in your app. If you have duplicated identifiers, the behavior is undefined.
onImeActionPerformed: (ImeAction) -> Unit = {} Called when the input service requested an IME action. When the input service emitted an IME action, this callback is called with the emitted IME action. Note that this IME action may be different from what you specified in imeAction.
visualTransformation: VisualTransformation? = null Optional visual filter for changing visual output of input field.
onTextLayout: (TextLayoutResult) -> Unit = {} Callback that is executed when a new text layout is calculated.

VerticalScroller

@Composable fun VerticalScroller(
    scrollerPosition: ScrollerPosition = ScrollerPosition(),
    modifier: Modifier = Modifier.None,
    isScrollable: Boolean = true,
    child: () -> Unit
): Unit

A container that composes all of its contents and lays it out, fitting the width of the child. If the child's height is less than the Constraints.maxHeight, the child's height is used, or the Constraints.maxHeight otherwise. If the contents don't fit the height, the drag gesture allows scrolling its content vertically. The contents of the VerticalScroller are clipped to the VerticalScroller's bounds.


//Unresolved: androidx.ui.foundation.samples.VerticalScrollerSample
Parameters
scrollerPosition: ScrollerPosition = ScrollerPosition() state of this Scroller that holds current scroll position and provides user with useful methods like smooth scrolling
modifier: Modifier = Modifier.None Modifier to be applied to the Scroller content layout
isScrollable: Boolean = true param to enabled or disable touch input scrolling, default is true

contentColor

@Composable fun contentColor(): Color

Returns the preferred content color at the call site's position in the hierarchy.

This color should be used for any typography / iconography, to ensure that the color of these adjusts when the background color changes. For example, on a dark background, text should be light, and on a light background, text should be dark.

Return
the preferred content color specified by a parent, defaulting to Color.Black if unspecified.

currentTextStyle

@Composable fun currentTextStyle(): TextStyle

This effect is used to read the current value of the Text style ambient. Any Text components included in this component's children will be styled with this style unless styled explicitly.

isSystemInDarkTheme

@Composable fun isSystemInDarkTheme(): Boolean

This effect should be used to help build responsive UIs that follow the system setting, to avoid harsh contrast changes when switching between applications. The behaviour differs depending on API:

On Build.VERSION_CODES.Q and above: returns the system-wide dark theme setting.

On Build.VERSION_CODES.P and below: returns whether the device is in power saving mode or not, which can be considered analogous to dark theme for these devices.

It is also recommended to provide user accessible overrides in your application, so users can choose to force an always-light or always-dark theme. To do this, you should provide the current theme value in an ambient or similar to components further down your hierarchy, only calling this effect once at the top level if no user override has been set. This also helps avoid multiple calls to this effect, which can be expensive as it queries system configuration.

For example, to draw a white rectangle when in dark theme, and a black rectangle when in light theme:


//Unresolved: androidx.ui.foundation.samples.DarkThemeSample
Return
true if the system is considered to be in 'dark theme'.

Extension functions

drawBackground

fun Modifier.drawBackground(
    paint: Paint,
    shape: Shape
): Modifier

Draws shape with paint behind the content.

drawBackground

@Composable fun Modifier.drawBackground(
    color: Color,
    shape: Shape = RectangleShape
): Modifier

Draws shape with a solid color behind the content.

Parameters
color: Color color to paint background with
shape: Shape = RectangleShape desired shape of the background

drawBackground

@Composable fun Modifier.drawBackground(
    brush: Brush,
    shape: Shape = RectangleShape
): Modifier

Draws shape with brush behind the content.

Parameters
brush: Brush brush to paint background with
shape: Shape = RectangleShape desired shape of the background

drawBorders

fun TableChildren.drawBorders(
    defaultBorder: Border = Border(color = Color.Black, size = Dp.Hairline),
    block: DrawBordersReceiver.() -> Unit
): Unit

Adds border drawing for a Table layout, when placed inside the TableChildren block.

Example usage:


//Unresolved: androidx.ui.foundation.samples.TableWithBorders
Parameters
defaultBorder: Border = Border(color = Color.Black, size = Dp.Hairline) The default Border appearance to be used for borders that do not specify a style.