Flow components let us split our app UI into independent, reusable pieces. A page layout in Flow has the following components:
Content – Hidden | Presentation | List | Outcomes | Image
Input – Input | Radio | Checkbox | Toggle | Text | Rich Text | Combobox
Data – File Upload | Table | Files | Tiles
Charts – Bar | Line | Pie | Doughnut | Polar Area
Let’s take a look at the image component.
We drag and drop the image component to a container in the page layout. Like other components, this opens a configuration panel on the right-hand-side that lets us customize the component. We can add the image URL in configuration options, as well as our desired display width and height.
The bootstrap img-responsive class is added to the
Images are rendered at runtime, and do not show up when we do a page preview in the drawing tool.
- Sample flow – https://flow.manywho.com/c5a50df2-f24b-4342-9fbd-1c91747ac0cf/play/default/?flow-id=61ffd553-861a-44ba-898d-1f99667d95f9
- Sample package – https://s3.amazonaws.com/mw-documentation/flow-examples/image.json