Elevation ✱
Control shadow depth to create elevation effects.
✱ represents it's an iOS-only prop
Import
src/screens/Component.js
import { fx } from "nativeflowcss";
Properties
The Shadow property works in a similar way, but supports Android as well as iOS
| Object | Native Properties |
|---|---|
| fx.elevation_0 | { elevation: 0 } |
| fx.elevation_1 | { elevation: 1 } |
| fx.elevation_2 | { elevation: 2 } |
| fx.elevation_3 | { elevation: 3 } |
| fx.elevation_4 | { elevation: 4 } |
| fx.elevation_5 | { elevation: 5 } |
| fx.elevation_6 | { elevation: 6 } |
| fx.elevation_7 | { elevation: 7 } |
| fx.elevation_8 | { elevation: 8 } |
| fx.elevation_9 | { elevation: 9 } |
| fx.elevation_10 | { elevation: 10 } |
Custom Elevation
Custom properties are usually rendered using _(customValue)
| Object | Native Properties |
|---|---|
| fx.elevation_(customNumber) | { elevation: customNumber } |
caution
Only supported for Android 5.0+, check elevation API for more details