Content Widgets Overview¶

Content widgets are the core elements used to render information and support interaction in Lucy Studio.

They display text, images, icons, and interactive controls directly on Canvas.

Category	Purpose	Widget Types
Data Display	Show text, images, and visual assets	`Text`, `Image`, `SVG`, `Icon`
User Controls	Collect input or selection	`TextField`, `Button`, `Checkbox`, `Radio`, `DropDown`, `TabBar`, `Switch`
Containers	Organize repeated UI and nested screens	`Form`, `Component`

Data Display¶

These widgets present visual information on screen.

Widget	Description	Usage Tip
`Text`	Displays a single-style string	Good for labels and short messages
`Image`	Displays raster images (JPG, PNG)	Supports both asset and external URL sources
`SVG`	Displays vector graphics without resolution loss	Recommended for logos and fixed-color icons
`Icon`	Displays built-in or custom font icons	Lightweight for symbolic actions

For details, see Data Display.

These widgets let users input values or choose options.

Widget	Description	Usage Tip
`TextField`	Text input with keyboard and masking options	Use for password and search input
`Button`	Runs an action or script on click	Entry point for commands like save or navigate
`Checkbox`	Captures boolean choice (`true`/`false`)	Best for multi-select
`Radio`	Allows a single selection in a group	Best for mutually exclusive options
`DropDown`	Select one item from an expandable list	Useful for many options in limited space
`TabBar`	Switches content areas in one screen	Use `isScrollable` for many tabs
`Switch`	Toggles on/off state	Clear for enable/disable settings

For details, see User Controls.

Container widgets improve consistency and development efficiency.

Widget	Description	Usage Tip
`Form`	Loads another page into a region of the current page	Essential for parent-child page composition
`Component`	Creates reusable UI blocks with actions	Changes to the base component update all linked instances

For details, see Containers.