Skip to main content
The Stac Conditional allows you to conditionally render widgets based on a boolean expression. It evaluates the condition at runtime and renders either the ifTrue or ifFalse widget.

Properties

PropertyTypeDescription
conditionStringRequired. The boolean expression to evaluate at runtime.
ifTrueStacWidgetRequired. The widget to render when condition evaluates to true.
ifFalseStacWidgetThe widget to render when condition evaluates to false. Renders empty if null.

Example

StacConditional(
  condition: 'user.isLoggedIn == true',
  ifTrue: StacText(data: 'Welcome back!'),
  ifFalse: StacText(data: 'Please sign in'),
)

Conditional with Complex Widgets

StacConditional(
  condition: 'items.length > 0',
  ifTrue: StacListView(
    children: [
      StacText(data: 'Your items:'),
      // ... list items
    ],
  ),
  ifFalse: StacCenter(
    child: StacColumn(
      mainAxisAlignment: StacMainAxisAlignment.center,
      children: [
        StacIcon(icon: 'empty_box', size: 64.0),
        StacSizedBox(height: 16.0),
        StacText(data: 'No items found'),
        StacSizedBox(height: 8.0),
        StacElevatedButton(
          child: StacText(data: 'Add Item'),
          onPressed: StacNavigateAction(routeName: '/add-item'),
        ),
      ],
    ),
  ),
)

Condition Expression Syntax

The condition property accepts expressions that are evaluated against the current state. Common patterns include:
  • Equality: user.role == 'admin'
  • Boolean check: user.isVerified == true
  • Comparison: cart.total > 100
  • Length check: items.length > 0
  • Null check: user.name != null
The condition is evaluated at runtime by Stac’s expression resolver against the current application state.