Style

open class Style(previousStyle: Style?, item: StyleItem<*>?)

An immutable ordered collection of attributes ( StyleItem s) that can be applied to a component, like width or click handling.

Adding new attributes to a Style (e.g. by calling .background) will return a new Style object. Ordering matters in that the last definition of an attribute 'wins'.

Styles can also be added via the + operator, with attributes from the right-hand side Style taking precedence if the two define different values for the same attribute, similar to adding maps.

Inheritors

Constructors

Link copied to clipboard
constructor(previousStyle: Style?, item: StyleItem<*>?)

Types

Link copied to clipboard
object Companion : Style

An empty Style singleton that can be used to build a chain of style items.

Functions

Link copied to clipboard
inline fun Style.accessibilityHeading(isAccessibilityHeading: Boolean): Style

Whether the view is a heading for a section of content for accessibility purposes.

Link copied to clipboard
inline fun Style.accessibilityRole(accessibilityRole: String?): Style

The Android Talkback "role" this component has. This will be read out when the view is visited in Talkback mode. See AccessibilityRoleType for possible roles.

Link copied to clipboard
inline fun Style.accessibilityRoleDescription(accessibilityRoleDescription: CharSequence?): Style

The description for this Component's accessibilityRole. This will be read out when the view is visited in Talkback mode.

Link copied to clipboard
inline fun Style.addSystemGestureExclusionZone(noinline exclusion: (bounds: Rect) -> Rect): Style

Excludes a rectangle within the local bounds from the system gesture. After layout, []exclusion] is called to determine the Rect to exclude from the system gesture area.

Link copied to clipboard
inline fun Style.alignSelf(align: YogaAlign): Style

Defines how a child should be aligned with a Row or Column, overriding the parent's align-items property for this child.

Link copied to clipboard
inline fun Style.alpha(alpha: DynamicValue<Float>): Style

inline fun Style.alpha(alpha: Float): Style

Sets an alpha on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.aspectRatio(aspectRatio: Float): Style

Defines an aspect ratio for this component, meaning the ratio of width to height. This means if aspectRatio is set to 2 and width is calculated to be 50px, then height will be 100px.

Link copied to clipboard
inline fun Style.background(background: DynamicValue<out Drawable>): Style

inline fun Style.background(background: Drawable?): Style

Sets a background on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.backgroundColor(background: DynamicValue<Int>): Style
inline fun Style.backgroundColor(@ColorInt backgroundColor: Long): Style

inline fun Style.backgroundColor(@ColorInt backgroundColor: Int): Style

Sets ColorDrawable of the given color as a background on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.border(border: Border): Style

Describes how a Border should be drawn around this component. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.clickable(isClickable: Boolean): Style

Sets if the View this Component mounts to should be clickable. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.clipChildren(clipChildren: Boolean): Style

Setting this to false allows child views of this view to draw outside its bounds, overriding the default behavior. It only applies to direct children. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.clipToOutline(clipToOutline: Boolean): Style

Sets whether the View's Outline should be used to clip the contents of the View. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.contentDescription(contentDescription: CharSequence?): Style

A description of the contents of this Component for accessibility.

Link copied to clipboard
inline fun Style.duplicateChildrenStates(duplicateChildrenStates: Boolean): Style

Sets whether this ViewGroup's drawable states also include its children's drawable states. This is used, for example, to make a group appear to be focused when its child EditText or button is focused. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.duplicateParentState(duplicateParentState: Boolean): Style

Sets whether the View gets its drawable state (focused, pressed, etc.) from its direct parent rather than from itself. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.elevation(elevation: DynamicValue<Float>): Style

inline fun Style.elevation(elevation: Dimen): Style

Sets an elevation on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.enabled(isEnabled: Boolean): Style

Sets if the View this Component mounts to should be enabled. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
open operator override fun equals(other: Any?): Boolean
Link copied to clipboard
inline fun Style.flex(grow: Float? = null, shrink: Float? = null, basis: Dimen? = null, basisPercent: Float? = null): Style

Flex allows you to define how this component should take up space within its parent. It's comprised of the following properties:

Link copied to clipboard
inline fun Style.focusable(isFocusable: Boolean): Style

Setting this property will cause the Component to be focusable. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
open fun forEach(lambda: (StyleItem<*>) -> Unit)
Link copied to clipboard
inline fun Style.foreground(foreground: Drawable?): Style

Sets a foreground on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.foregroundColor(foreground: DynamicValue<Int>): Style

inline fun Style.foregroundColor(@ColorInt foregroundColor: Int): Style

Sets ColorDrawable of the given color as a background on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
open override fun hashCode(): Int
Link copied to clipboard
inline fun Style.height(height: Dimen): Style

Sets a specific preferred height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.heightPercent(heightPercent: Float): Style

Sets a specific preferred percent height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.importantForAccessibility(importantForAccessibility: ImportantForAccessibility): Style

Sets whether this Component is "important for accessibility". If it is, it fires accessibility events and is reported to accessibility services that query the screen. The value for this property can be one of the values in ImportantForAccessibility.

Link copied to clipboard
inline fun Style.isReferenceBaseline(isReferenceBaseline: Boolean): Style
Link copied to clipboard
inline fun Style.keyboardNavigationCluster(isKeyboardNavigationCluster: Boolean): Style

Setting this property will cause the Component to be a keyboard navigation cluster. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.layoutDirection(layoutDirection: YogaDirection): Style

Describes the RTL/LTR direction of component. Determines whether {@link YogaEdge#START} and {@link YogaEdge#END} will resolve to the left or right side, among other things. INHERIT indicates this setting will be inherited from this component's parent. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.margin(all: Dimen? = null, horizontal: Dimen? = null, vertical: Dimen? = null, start: Dimen? = null, top: Dimen? = null, end: Dimen? = null, bottom: Dimen? = null, left: Dimen? = null, right: Dimen? = null): Style

Defines margin around the component on a per-edge basis.

Link copied to clipboard
inline fun Style.marginAuto(edge: YogaEdge): Style

Sets margin value for specified edge to auto. The item will extend the margin for this edge to occupy the extra space in the parent, depending on the direction (Row or Column).

Link copied to clipboard
inline fun Style.marginPercent(all: Float? = null, horizontal: Float? = null, vertical: Float? = null, start: Float? = null, top: Float? = null, end: Float? = null, bottom: Float? = null, left: Float? = null, right: Float? = null): Style

Defines margin around the component on a per-edge basis, with a percent value of container's size. See https://yogalayout.dev/docs/margins-paddings-borders for more information.

Link copied to clipboard
inline fun Style.maxHeight(maxHeight: Dimen): Style

Sets a preferred maximum height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.maxHeightPercent(maxHeightPercent: Float): Style

Sets a specific maximum percent height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.maxWidth(maxWidth: Dimen): Style

Sets a preferred maximum width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.maxWidthPercent(maxWidthPercent: Float): Style

Sets a specific maximum percent width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.minHeight(minHeight: Dimen): Style

Sets a preferred minimum height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.minHeightPercent(minHeightPercent: Float): Style

Sets a specific minimum percent height for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.minWidth(minWidth: Dimen): Style

Sets a preferred minimum width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.minWidthPercent(minWidthPercent: Float): Style

Sets a specific minimum percent width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.onClick(noinline action: (ClickEvent) -> Unit): Style

Sets a listener that will invoke the given lambda when this Component is clicked. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

inline fun Style.onClick(enabled: Boolean, noinline action: (ClickEvent) -> Unit): Style

Sets a listener that will invoke the given lambda when this Component is clicked but only if enabled is true. If enabled, setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.onFocusedChanged(noinline action: (FocusChangedEvent) -> Unit): Style

Sets a listener that will invoke the given lambda when this Component's focus changes. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

inline fun Style.onFocusedChanged(enabled: Boolean, noinline action: (FocusChangedEvent) -> Unit): Style

Sets a listener that will invoke the given lambda when this Component's focus changes but only if enabled is true. If enabled, setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.onFocusedVisible(noinline onFocused: (FocusedVisibleEvent) -> Unit): Style

Registers a callback to be called when either the Component occupies at least half of the viewport, or, if the Component is smaller than half the viewport, when it is fully visible.

Link copied to clipboard
inline fun Style.onFullImpression(noinline onFullImpression: (FullImpressionVisibleEvent) -> Unit): Style

Registers a callback to be called when all parts of a Component have been made visible at some point, termed a "full impression". A full impression is defined as:

Link copied to clipboard
inline fun Style.onInitializeAccessibilityEvent(noinline onInitializeAccessibilityEventHandler: (OnInitializeAccessibilityEventEvent) -> Unit): Style

Initializes an AccessibilityEvent with information about the the host View which dispatched the event.

Link copied to clipboard
inline fun Style.onInitializeAccessibilityNodeInfo(noinline onInitializeAccessibilityNodeInfoHandler: (OnInitializeAccessibilityNodeInfoEvent) -> Unit): Style

Initializes an AccessibilityNodeInfoCompat with information about the host view.

Link copied to clipboard
inline fun Style.onInterceptTouch(noinline action: (InterceptTouchEvent) -> Boolean): Style

Sets a listener that will intercept all touch screen motion events. This allows you to watch events as they are dispatched to your children, and take ownership of the current gesture at any point. Implementations should return true if they intercepted the event and wish to receive subsequent events, and false otherwise. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

inline fun Style.onInterceptTouch(enabled: Boolean, noinline action: (InterceptTouchEvent) -> Boolean): Style

Sets a listener that will intercept all touch screen motion events but only if enabled is true. This allows you to watch events as they are dispatched to your children, and take ownership of the current gesture at any point. Implementations should return true if they intercepted the event and wish to receive subsequent events, and false otherwise. If enabled is true, setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.onInvisible(noinline onInvisible: (InvisibleEvent) -> Unit): Style

Registers a callback to be called when a Component becomes fully invisible (e.g. scrolled off or unmounted)

Link copied to clipboard
inline fun Style.onLongClick(noinline action: (LongClickEvent) -> Boolean): Style

Sets a listener that will invoke the given lambda when this Component is long clicked. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

inline fun Style.onLongClick(enabled: Boolean, noinline action: (LongClickEvent) -> Boolean): Style

Sets a listener that will invoke the given lambda when this Component is long clicked but only if enabled is true. If enabled, setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.onPerformAccessibilityAction(noinline onPerformAccessibilityActionHandler: (PerformAccessibilityActionEvent) -> Unit): Style

Called when performs the specified accessibility action on the view.

Link copied to clipboard
inline fun Style.onPerformActionForVirtualView(noinline onPerformActionForVirtualViewHandler: (PerformActionForVirtualViewEvent) -> Unit): Style

Performs the specified accessibility action on a virtual view child of the host View and gives an opportunity to the parent (the host) to implement the desired behavior.

Link copied to clipboard
inline fun Style.onPopulateAccessibilityEvent(noinline onPopulateAccessibilityEventHandler: (OnPopulateAccessibilityEventEvent) -> Unit): Style

Gives a chance to the host View to populate the accessibility event with its text content.

Link copied to clipboard
inline fun Style.onPopulateAccessibilityNode(noinline onPopulateAccessibilityNodeHandler: (OnPopulateAccessibilityNodeEvent) -> Unit): Style

Gives a chance to the component to implement its own accessibility support.

Link copied to clipboard
inline fun Style.onRequestSendAccessibilityEvent(noinline onRequestSendAccessibilityEventHandler: (OnRequestSendAccessibilityEventEvent) -> Unit): Style

Called when a child of the host View has requested sending an AccessibilityEvent and gives an opportunity to the parent (the host) to augment the event.

Link copied to clipboard
inline fun Style.onSendAccessibilityEvent(noinline onSendAccessibilityEventHandler: (SendAccessibilityEventEvent) -> Unit): Style

Called when Sends an accessibility event of the given type. If accessibility is not enabled this method has no effect.

Link copied to clipboard
inline fun Style.onSendAccessibilityEventUnchecked(noinline onSendAccessibilityEventUncheckedHandler: (SendAccessibilityEventUncheckedEvent) -> Unit): Style

Sends an accessibility event. This method behaves exactly as sendAccessibilityEvent() but takes as an argument an empty AccessibilityEvent and does not perform a check whether accessibility is enabled.

Link copied to clipboard
inline fun Style.onTouch(noinline action: (TouchEvent) -> Boolean): Style

Sets a listener that will invoke the given lambda when this Component is touched. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

inline fun Style.onTouch(enabled: Boolean, noinline action: (TouchEvent) -> Boolean): Style

Sets a listener that will invoke the given lambda when this Component is touched but only if enabled is true. If enabled, setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.onUnfocusedVisible(noinline onUnfocused: (UnfocusedVisibleEvent) -> Unit): Style

Registers a callback to be called when the Component is no longer focused, i.e. it is not fully visible and does not occupy at least half the viewport.

Link copied to clipboard
inline fun Style.onVirtualViewKeyboardFocusChanged(noinline onVirtualViewKeyboardFocusChangedHandler: (VirtualViewKeyboardFocusChangedEvent) -> Unit): Style

Called when a virtual view child of the host View has changed keyboard focus and gives an opportunity to the parent (the host) to react (changing visual display, etc.)

Link copied to clipboard
inline fun Style.onVisibilityChanged(noinline onVisibilityChanged: (VisibilityChangedEvent) -> Unit): Style

Registers a callback to be called when the visible rect of a Component changes.

Link copied to clipboard
inline fun Style.onVisible(noinline onVisible: (VisibleEvent) -> Unit): Style

Registers a callback to be called when any part of the Component becomes visible on screen.

Link copied to clipboard
inline fun Style.onVisibleWithTag(tag: String?, noinline onVisible: (VisibleEvent) -> Unit): Style
Link copied to clipboard
inline fun Style.outlineProvider(outlineProvider: ViewOutlineProvider?): Style

Sets a ViewOutlineProvider on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.padding(all: Dimen? = null, horizontal: Dimen? = null, vertical: Dimen? = null, start: Dimen? = null, top: Dimen? = null, end: Dimen? = null, bottom: Dimen? = null, left: Dimen? = null, right: Dimen? = null): Style

Defines padding on the component on a per-edge basis.

Link copied to clipboard
inline fun Style.paddingPercent(all: Float? = null, horizontal: Float? = null, vertical: Float? = null, start: Float? = null, top: Float? = null, end: Float? = null, bottom: Float? = null, left: Float? = null, right: Float? = null): Style

Defines padding on the component on a per-edge basis, with a percent value of container's size. See https://yogalayout.dev/docs/margins-paddings-borders for more information.

Link copied to clipboard
operator fun plus(other: Style?): Style
inline operator fun plus(nextItem: StyleItem<*>?): Style
Link copied to clipboard
inline fun Style.position(all: Dimen? = null, horizontal: Dimen? = null, vertical: Dimen? = null, start: Dimen? = null, top: Dimen? = null, end: Dimen? = null, bottom: Dimen? = null, left: Dimen? = null, right: Dimen? = null): Style

Used in conjunction with positionType to define how a component should be positioned in its parent.

Link copied to clipboard
inline fun Style.positionPercent(all: Float? = null, horizontal: Float? = null, vertical: Float? = null, start: Float? = null, top: Float? = null, end: Float? = null, bottom: Float? = null, left: Float? = null, right: Float? = null): Style

Used in conjunction with positionType to define how a component should be positioned in its parent, with a float value between 0 and 100.

Link copied to clipboard
inline fun Style.positionType(positionType: YogaPositionType): Style

See docs in position.

Link copied to clipboard
fun Style.reportFirstContentDraw(isContentReady: Boolean = true, reporter: FirstDrawReporter): Style

Style prop that provides FirstDrawReporter to report the first draw after isContentReady is first set to true.

Link copied to clipboard
inline fun Style.rotation(rotation: DynamicValue<Float>): Style

inline fun Style.rotation(rotation: Float): Style

Sets the degree that this component is rotated around the pivot point. Increasing the value results in clockwise rotation. By default, the pivot point is centered on the component. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.rotationX(rotationX: Float): Style

Sets the degree that this component is rotated around the horizontal axis through the pivot point. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.rotationY(rotationY: Float): Style

Sets the degree that this component is rotated around the vertical axis through the pivot point. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.scale(scale: Float): Style

Sets the scale (scaleX and scaleY) on this component. This is mostly relevant for animations and being able to animate size changes. Otherwise for non-animation usecases, you should use the standard layout properties to control the size of your component. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.scaleX(scaleX: DynamicValue<Float>): Style
Link copied to clipboard
inline fun Style.scaleY(scaleY: DynamicValue<Float>): Style
Link copied to clipboard
inline fun Style.selected(isSelected: Boolean): Style

Changes the selection state of this Component. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.shadow(elevation: Dimen, outlineProvider: ViewOutlineProvider = ViewOutlineProvider.BOUNDS, @ColorInt ambientShadowColor: Int = Color.BLACK, @ColorInt spotShadowColor: Int = Color.BLACK): Style

Style for attaching a standard Material Design shadow to a component. Refer to https://material.io/design/environment/light-shadows.html for more information.

Link copied to clipboard
inline fun Style.stateListAnimator(stateListAnimator: StateListAnimator?): Style

Attaches the provided StateListAnimator to this Component. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.testKey(testKey: String?): Style

Sets testKey on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.tooltipText(tooltipText: String?): Style

Sets the tooltip text which will be displayed in a small popup next to the view.

Link copied to clipboard
inline fun Style.touchExpansion(all: Dimen? = null, horizontal: Dimen? = null, vertical: Dimen? = null, start: Dimen? = null, top: Dimen? = null, end: Dimen? = null, bottom: Dimen? = null, left: Dimen? = null, right: Dimen? = null): Style

Defines touch Expansion area around the component on a per-edge basis.

Link copied to clipboard
inline fun Style.transitionKey(context: ComponentContext, transitionKey: String?, transitionKeyType: Transition.TransitionKeyType = TransitionKeyType.LOCAL): Style

Sets transition key and Transition.TransitionKeyType on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.transitionName(transitionName: String?): Style

Sets Activity transition name on the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.translationX(translationX: DynamicValue<Float>): Style
Link copied to clipboard
inline fun Style.translationY(translationY: DynamicValue<Float>): Style
Link copied to clipboard
inline fun Style.useHeightAsBaseline(useHeightAsBaseline: Boolean): Style
Link copied to clipboard
fun Style.viewBinder(binder: RenderUnit.Binder<Any?, View, Any>): Style

fun Style.viewBinder(binder: RenderUnit.DelegateBinder<*, View, Any>): Style

Sets the given binder as a Mount binder for View. The usage of this binder will guarantee that there will be an associated View to it (either because it is wrapping a Mounting View or by creating a wrapping ComponentHost.

Link copied to clipboard
inline fun Style.viewId(@IdRes viewId: Int): Style

Adds a View tag to the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.viewTag(viewTag: Any): Style

Adds a View tag to the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.viewTags(viewTags: SparseArray<out Any>): Style

Adds a set of View tags to the View this Component mounts to. Setting this property will cause the Component to be represented as a View at mount time if it wasn't going to already.

Link copied to clipboard
inline fun Style.visibleHeightRatio(visibleHeightRatio: Float): Style

Defines a ratio of the Component height for the visibility callback to be dispatched use together with onVisible and/or with onInvisible.

Link copied to clipboard
inline fun Style.visibleWidthRatio(visibleWidthRatio: Float): Style

Defines a ratio of the Component width for the visibility callback to be dispatched use together with onVisible and/or with onInvisible.

Link copied to clipboard
inline fun Style.width(width: Dimen): Style

Sets a specific preferred width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.widthPercent(widthPercent: Float): Style

Sets a specific preferred percent width for this component when its parent lays it out.

Link copied to clipboard
inline fun Style.wrapInView(): Style

Specifies that this Component should be represented as a View when this hierarchy is mounted.