Size
Create square-shaped elements with equal width and height.
Import​
src/screens/Component.js
import { size } from "nativeflowcss";
Properties​
| Object | Native Properties |
|---|---|
| size.s_0 | { width: 0, height: 0 } |
| size.s_1 | { width: 4, height: 4 } |
| size.s_2 | { width: 8, height: 8 } |
| size.s_3 | { width: 12, height: 12 } |
| size.s_4 | { width: 16, height: 16 } |
| size.s_5 | { width: 20, height: 20 } |
| size.s_6 | { width: 24, height: 24 } |
| size.s_7 | { width: 28, height: 28 } |
| size.s_8 | { width: 32, height: 32 } |
| size.s_9 | { width: 36, height: 36 } |
| size.s_10 | { width: 40, height: 40 } |
| size.s_11 | { width: 44, height: 44 } |
| size.s_12 | { width: 48, height: 48 } |
| size.s_14 | { width: 56, height: 56 } |
| size.s_16 | { width: 64, height: 64 } |
| size.s_20 | { width: 80, height: 80 } |
| size.s_24 | { width: 96, height: 96 } |
| size.s_28 | { width: 112, height: 112 } |
| size.s_32 | { width: 128, height: 128 } |
| size.s_36 | { width: 144, height: 144 } |
| size.s_40 | { width: 160, height: 160 } |
| size.s_44 | { width: 176, height: 176 } |
| size.s_48 | { width: 192, height: 192 } |
| size.s_52 | { width: 208, height: 208 } |
| size.s_56 | { width: 224, height: 224 } |
| size.s_60 | { width: 240, height: 240 } |
| size.s_64 | { width: 256, height: 256 } |
| size.s_72 | { width: 288, height: 288 } |
| size.s_80 | { width: 320, height: 320 } |
| size.s_96 | { width: 384, height: 384 } |
Custom Sizes​
Custom properties are usually rendered using _(customValue)
Size in React Native does not support
%unit as of now
| Object | Native Properties |
|---|---|
| size.s_(customValue) | { width: customValue, height: customValue } |