View

View is a React Native’s View with additional (flexbox) styling styleNames available.

API

Props

  • View component doesn’t have specific (custom) Props, however, it supports every prop that the standard React Native View component supports. For full list of available props, visit React Native View component documentation

Style names

  • fill-parent: View becomes absolutely positioned and takes all available space of its parent container
  • horizontal: Places all items in a row
    • h-center: Centers item in a row horizontally
    • h-start: Places item to the horizontal start of row
    • h-end: Places item to the horizontal end of row
    • v-center: Centers all items in a row vertically
    • v-start: Places item to the vertical start of row
    • v-end: Places item to the vertical end of row
  • overlay: Applies Overlay background color (as defined in Theme) to View
  • space-between: Places all flex items equally along the main axis
  • vertical: Places all items in a column
    • h-center: Centers all items in a column horizontally
    • h-start: Places item to the horizontal start of column
    • h-end: Places item to the horizontal end of column
    • v-center: Centers all items in a column vertically
    • v-start: Places item to the vertical start of column
    • v-end: Places item to the vertical end of column
  • wrap: Defines whether the flexible items should wrap

Style

  • Supports every Style prop that the standard React Native View component supports

Examples

View


JSX Declaration

<View styleName="...">
    {...}
</View>