Box

Box renders a React Native View component.

Usage

<Box justifyContent="center" alignItems="center">
  <Box bg="cornflowerblue" width={128} height={128} shadow={1} />
</Box>

Props

alignItems?: ViewStyle['alignItems']
alignSelf?: ViewStyle['alignSelf']
border?: number | { borderWidth?: number; borderColor?: string; } (index from your borders array or a Border object)
flex?: number
flexDirection?: ViewStyle['flexDirection']
flexGrow?: number
flexShrink?: number
flexWrap?: ViewStyle['flexWrap']
height?: number
justifyContent?: ViewStyle['justifyContent']
m?: number (index from your space array, if negative or higher, it will be used as spacing)
mb?: number (index from your space array, if negative or higher, it will be used as spacing)
ml?: number (index from your space array, if negative or higher, it will be used as spacing)
mr?: number (index from your space array, if negative or higher, it will be used as spacing)
mt?: number (index from your space array, if negative or higher, it will be used as spacing)
mx?: number (index from your space array, if negative or higher, it will be used as spacing)
my?: number (index from your space array, if negative or higher, it will be used as spacing)
p?: number (index from your space array, if negative or higher, it will be used as spacing)
pb?: number (index from your space array, if negative or higher, it will be used as spacing)
pl?: number (index from your space array, if negative or higher, it will be used as spacing)
pr?: number (index from your space array, if negative or higher, it will be used as spacing)
pt?: number (index from your space array, if negative or higher, it will be used as spacing)
px?: number (index from your space array, if negative or higher, it will be used as spacing)
py?: number (index from your space array, if negative or higher, it will be used as spacing)
shadow?: number | { elevation?: number; shadowColor?: string | string; shadowOffset?: { height: number; width: number }; shadowOpacity?: number | number; shadowRadius?: number; } (index from your shadows array or a Shadow object)
width?: number

Any View props