Shadow
A Shadow component lets you apply shadow around any components. It is very customizable and compatible with Android, iOS and Web. It's not required to define its size: the shadow is smartly applied on the first render and then precisely reapplied on the following ones.
How to use
Nest the component(s) you want to display as children of the Shadow component to have a shadow around it.
Style Properties
Style properties allow you to customize the look and feel of the component. Combinations of styles applied to components can be saved as Stylesheets to easily reuse styles throughout your app. Styles can also be set dynamically using Variables. To learn more about all the different styling properties and how they work, take a look at Intro to Styling.
Component Specific Styles
Property | Description |
---|---|
Distance | The distance of the shadow. |
Start Color | The initial gradient color of the shadow. |
End Color | The final gradient color of the shadow. |
Paint Inside | Apply the shadow below/inside the content. |
Stretch | Force children to occupy all available horizontal space. |
Offset X | Moves the shadow in the X direction |
Offset Y | Moves the shadow in the Y direction |
Configuration Properties
Property | Description |
---|---|
Component Name | An optional descriptive name for the component. If the name is not "Shadow", it will appear as a comment above this component in the generated code. |
Data Properties
Conditional Display
You can conditionally display a component based on a given condition. Learn more about conditionally displaying components in the Conditional Display doc.
Updated 4 months ago