Style

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

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

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.

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

Adds an additional click listener identified by key that fires alongside any primary handler installed via onClick or by the underlying component's CommonProps.clickHandler. Multiple additional listeners with distinct keys can coexist on the same view and all fire on click in insertion order.

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.

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

Sets the alpha of the View using a Value.

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.

Applies the default styled attributes from an Android style/theme resource to this component's common view and layout properties — the R.styleable.ComponentLayout set, e.g. background, foreground, padding, margin, minWidth/minHeight, contentDescription and importantForAccessibility. This is the Style equivalent of the legacy Spec builder's create(c, defStyleAttr, defStyleRes) overload.

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.

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.

Sets the background color of the View using a Value.

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.

Creates a Blur LithoRenderEffect with the specified radius along the x and y axis and applies it to the component.

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.

Applies a border using a DSL-style builder for complex configurations.

Applies a uniform border with the same width and color on all edges. This is a simplified API for the most common border use case.

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.

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.

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

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.

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.

Sets a component-level tag on this Component, readable via com.facebook.litho.DebugComponent's componentTag / InspectableComponent.getComponentTag (test / inspection tooling). Unlike viewTag, this is not an Android View tag: it has no mount- or layout-time effect and does not force the Component to be represented as a View.

Sets the container title for app-developer-defined container which can be any type of ViewGroup or layout. Container title will be used to group together related controls, similar to HTML fieldset.

A description of the contents of this Component for accessibility.

Sets whether this View should have a default focus highlight when it gets focus but doesn't have R.attr.state_focused defined in its background. Setting this property will cause the Component to be represented as a View at mount time if it wasn't already. Only effective on API 26+ (Android O); a no-op on older API levels.

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.

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.

Sets the elevation of the View using a Value.

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.

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.

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

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.

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.

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.

Sets a specific preferred height for this component using a Value.

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

auto height

Sets minimum and maximum height constraints.

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

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.

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.

Sets the view which serves as the label of the view represented by this info for accessibility purposes.

Specifies the type of layer backing this view. The layer can be LayerType.LAYER_TYPE_NOT_SET, LayerType.LAYER_TYPE_NONE, LayerType.LAYER_TYPE_SOFTWARE or LayerType.LAYER_TYPE_HARDWARE.

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.

Sets the live region mode for this view. This indicates to accessibility services whether they should automatically notify the user about changes to the view's content description or text, or to the content descriptions or text of the view's children (where applicable).

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

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).

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

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

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

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

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

Sets the minimum time duration between two content change events, which is used in throttling content change events in accessibility services.

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

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

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

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

This Style adds a mount callbacks. The BindFunc is invoked when the Component is mounted, and it receives a BindScope and the content this Component rendered to which can be a View or Drawable. The BindFunc must return an UnbindFunc and it must undo any mutations made to the View in the BindFunc. This API can be used to create higher-order Styles.

Use this Style instead of onBind to force the binder to be applied on a wrapped HostView.

Use this Style instead of onBind to force the binder to be applied on a wrapped HostView.

Note: Please use onBindViewWithDescription instead.

Use this Style instead of onBind to force the binder to be applied on a View; for example if a binder needs to be set on a Row or Column component, or if the binder needs to set common view properties even for components that render a Drawable.

This Style adds a mount callback for state value.

This Style adds a mount callbacks. The BindFunc is invoked when the Component is mounted, and it receives a BindScope and the content this Component rendered to which can be a View or Drawable. The BindFunc must return an UnbindFunc and it must undo any mutations made to the View in the BindFunc. This API can be used to create higher-order Styles.

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.

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.

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.

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.

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.

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:

Sets a listener that will invoke the given lambda when this Component is hovered on. If the component does not render a view then the framework will render it inside a View.

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

Initializes an AccessibilityNodeInfoCompat with information about the host view.

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.

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.

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

Sets a listener that will invoke the given lambda when key event is received by 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.

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.

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.

Called when performing the specified accessibility action on the view. Return true when the action was handled, or false otherwise.

Performs the specified accessibility action on a virtual view child of the host View. Return true when the action was handled, or false otherwise.

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

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

Called when a child of the host View requests sending an AccessibilityEvent. Return true to allow the event to propagate, or false to block it.

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

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.

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.

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.

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.

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.)

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

Registers a callback to be called when a Component becomes visible on screen.

Registers a callback to be called when a Component becomes visible on screen, with a tag for identification.

Returns this Style if it's not null, otherwise returns the default empty Style singleton.

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.

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

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

Visually distinct portion of a window with window-like semantics are considered panes for accessibility purposes. One example is the content view of a large fragment that is replaced. In order for accessibility services to understand a pane's window-like behavior, panes should have descriptive titles. Views with pane titles produce AccessibilityEvent#TYPE_WINDOW_STATE_CHANGEDs when they appear, disappear, or change title.

Sets the transform pivot of a View (used for scale and rotation transforms) to be centered at the given percentages of the View's width and height. The default pivot point is (50f, 50f).

Appends styleProvider to the current style if condition is true.

Appends styleProvider to the current style if value is not null.

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

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

See docs in position.

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

Sets the requested frame rate for the View this Component mounts to. Only effective on API 35+ (Android 15). On older API levels, this is a no-op.

Sets whether the node has requested initial accessibility focus.

Sets the rotation of the View using a Value.

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.

Sets the X-axis rotation of the View using a Value.

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.

Sets the Y-axis rotation of the View using a Value.

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.

Sets the scale (scaleX and scaleY) of the View using a Value.

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.

Sets whether this View should be a focusable element for screen readers

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.

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

Sets both width and height to the same value.

Sets the state description of the component associated to this 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.

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.

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

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

Adds a diff-based transition to the host represented by this 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.

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.

Sets the X-axis translation of the View using a Value.

Sets the Y-axis translation of the View using a Value.

An overload of Style.viewBinder which takes a RenderUnit.Binder that does not require a model.

Creates a Style which will apply the given RenderUnit.Binder to the View rendered by the Component the Style is added to. This abstraction can be used to create higher-level Styles which can apply some property generically to any type of Component.

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.

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.

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.

Sets the visibility of the View rendered by this Component using a DynamicValue. The value should be one of Visibility.Visible or Visibility.Invisible.

Defines the visibility of the Component. The value can be Visibility.Visible or Visibility.Invisible; the default is Visibility.Visible.

Sets a specific preferred width for this component using a Value.

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

auto width

Sets minimum and maximum width constraints.

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

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