Group
The React Native View component, when used as a group, acts as a container for
organizing and structuring UI elements within a distinct section of an app
screen. It facilitates layout management, styling, and nesting of other
components, allowing for cohesive presentation and organization of related
content.
Props
style
| Type: |
Style Object |
| Description: |
Allows additional custom styles to be applied to the View component.
|
<Group style={{ backgroundColor: 'grey' }} ... />
flex
| Type: |
number |
| Description: |
Controls the flex-grow value of the button, determining how much it
should expand or contract relative to its container.
|
<Group flex={1} ... />
width
| Type: |
number |
| Description: |
Sets the horizontal dimension of a container or element.
|
<Group width={1} ... />
height
| Type: |
number |
| Description: |
Sets the vertical dimension of a container or element.
|
<Group height={1} ... />
justifyContent
| Type: |
string |
| Description: |
Aligns child elements along container's main axis, controlling spacing
in flexbox layouts.
|
<Group justifyContent="center" ... />
alignItems
| Type: |
string |
| Description: |
Aligns child elements along the cross axis of their container. |
<Group alignItems="center" ... />
marginHorizontal
| Type: |
number |
| Description: |
Sets margins on left and right sides of an element. |
<Group marginHorizontal={10} ... />
marginVertical
| Type: |
number |
| Description: |
Sets margins on top and bottom sides of an element. |
<Group marginVertical={10} ... />
paddingHorizontal
| Type: |
number |
| Description: |
Sets padding on left and right sides of an element. |
<Group paddingHorizontal={10} ... />
paddingVertical
| Type: |
number |
| Description: |
Sets padding on top and bottom sides of an element. |
<Group paddingVertical={10} ... />
radius
| Type: |
number |
| Description: |
Rounds the corners of an element's border with specified curvature.
|
<Group radius={10} ... />