Flexible

Presentations v1.0 zero-schema

Sizes its child within a Row or Column by flex factor; a Tight fit fills the available space (the classic Expanded behaviour).

Required fields

PresentationType Child

Properties

PresentationType string required

Sizes its child within a Row or Column by flex factor; FlexFit Tight fills the available space, Loose (default) allows the child to be smaller.

Allowed Flexible

Flex integer, object optional

The flex property, used with Flexible, determines how much space a child widget should occupy relative to the other children within a Flex container. Accepts a responsive value map ({"sm": …, "md": …, "lg": …}).

Default 1

FlexFit string optional

The fit property, used with the Flexible widget, controls whether a child widget should fill the available space

Default "Loose"

Allowed Loose Tight

Child object required

The Child property defines the child widget to be made flexible.

{ "$id": "/schema/Presentations/Flexible/1.0/index.json", "type": "object", "title": "Flexible", "$schema": "http://json-schema.org/draft-07/schema#", "required": [ "PresentationType", "Child" ], "properties": { "PresentationType": { "enum": [ "Flexible" ], "type": "string", "description": "Sizes its child within a Row or Column by flex factor; FlexFit Tight fills the available space, Loose (default) allows the child to be smaller." }, "Flex": { "type": [ "integer", "object" ], "description": "The flex property, used with Flexible, determines how much space a child widget should occupy relative to the other children within a Flex container. Accepts a responsive value map ({\"sm\": …, \"md\": …, \"lg\": …}).", "default": 1 }, "FlexFit": { "enum": [ "Loose", "Tight" ], "type": "string", "description": "The fit property, used with the Flexible widget, controls whether a child widget should fill the available space ", "default": "Loose" }, "Child": { "type": "object", "description": "The Child property defines the child widget to be made flexible." } }, "examples": [ { "PresentationType": "Flexible", "Flex": 1, "Child": { "PresentationType": "TextInput", "Name": "Search", "HintText": "Search" } } ], "x-icon": "<svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.7\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 12h16M8 8l-4 4 4 4M16 8l4 4-4 4\"/></svg>", "description": "Sizes its child within a Row or Column by flex factor; a Tight fit fills the available space (the classic Expanded behaviour).", "x-exports": { "html": true, "ios": true }, "x-family": "Presentations", "x-name": "Flexible", "x-version": "1.0", "x-source-package": "zero-schema" }