There are four Basic components available:
The most fundamental component for building a UI.
View is a container that supports layout with flexbox, style, some touch handling, and accessibility controls. View maps directly to the native view equivalent on whatever platform React Native is running on, whether that is a
View is designed to be nested inside other views and can have zero to many children of any type.
To alter the name of the component. The name is reflected in the Layout tree. Defaults to View.
When enabled, the element will be defined as accessible (defaults to false).
Text in this input will override what the user's screen reader would read by default.
Additional explanation of what happens when a user interacts with an accessibility element.
Defines the role of the element for the user's screen reader.
Enable to hide accessibility elements within the View (defaults to false).
Enable to prevent the color of the View from being inverted if color inversion is turned on.
Determine how accessibility services should inform the user of any changes made to the View.
Determines the View's importance for accessibility and also how accessibility events work.
Defines how far away a touch event will be registered from the View.
Determines if a View can handle touch events.
Used for scrolling content that contains offscreen subviews (subviews must have
Enable to automatically remove the View from the native hierarchy if it's unneeded in order to optimize performance.
Determine if the View should be rendered offscreen and composited with alpha in order to preserve original colors and blending behavior.
Determine if the View and its children should be rendered into one hardware texture on the GPU.
Enable to render the View as a bitmap before compositing.
A visual indicator to describe an action or an intent.
To alter the name of the component. The name is reflected in the Layout tree. Defaults to Icon.
The icon selected from the icon picker.
The width and height of the icon.
The color of the icon.
The current list of available icons sets are:
A basic component to display text.
To alter the name of the component. The name is reflected in the Layout tree. Defaults to Text.
Max # of Lines
Set the maximum number of lines to be displayed when Truncate Text is set.
Determine how the text will be truncated if the Max # of Lines property is set in conjunction.
Truncate Text property supports the following values:
The line is displayed so that the end fits in the container and the missing text at the beginning of the line is indicated by an ellipsis glyph. e.g., "...wxyz".
The line is displayed so that the beginning and end fit in the container and the missing text in the middle is indicated by an ellipsis glyph. "ab...yz".
The line is displayed so that the beginning fits in the container and the missing text at the end of the line is indicated by an ellipsis glyph. e.g., "abcd..."
Lines are not drawn past the edge of the text container.
Note about using Truncate Text property on Android devices
On Android, when Max # of Lines is set to a value higher than 1, only the
tailfrom Truncate Text value will work correctly.
Note about using Truncate Text property in Web Preview
On Web, only the
tailfrom Truncate Text value is supported.
A visual component to collect and display measurable feedback from app users.
To alter the name of the component. The name is reflected in the Layout tree. Defaults to Star Rating.
The width and height of the icon.
The number of stars to display.
Updated 8 days ago