Classic Button
Usage
The Classic Button is a neutral variant suitable for secondary actions. It supports multiple variants (Primary, Secondary, Ghost, Danger), border styles, and fill modes.
YAML Export
1. Copy the YAML from the component view.
2. Paste it into your Canvas app.
3. Ensure the control name is unique.
4. Bind the OnSelect property to your action formula.
Color Modes
- Default colors: Uses predefined colors (not editable).
- Custom colors: Edit background, text, and border colors directly.
- Theme Tokens: Uses tokens from Theme Builder (Pro feature).
Export Modes
- Safe: Minimal props, basic functionality.
- Advanced: Includes styling, states, and advanced properties (Pro feature).
Examples
Basic Usage
Button1:
Type: Button
Text: "Click me"
OnSelect: Navigate(HomeScreen)
With Custom Colors
When using Custom Colors mode, the YAML will include explicit color values:
Button1:
Type: Button
Text: "Click me"
Fill: RGBA(37, 99, 235, 1)
Color: RGBA(255, 255, 255, 1)
With Theme Tokens (Pro)
When using Theme Tokens mode, colors reference your theme:
Button1:
Type: Button
Text: "Click me"
Fill: AppTheme.BrandPrimary
Color: AppTheme.OnSurface