AML TabLayout

TabLayout is the value for the view parameter in a Dashboard when you want to split the dashboard into named tabs. Each tab holds either a CanvasLayout (pixel-positioned) or a LinearLayout (vertically stacked).

Dashboard my_dashboard {
  // ... blocks ...

  view: TabLayout {
    tab summary: LinearLayout {
      label: 'Summary'
      block f1
      block v1
    }
    tab detail: CanvasLayout {
      label: 'Detail'
      width: 1080
      height: 600
      block v2 { position: pos(0, 0, 1080, 600) }
    }
  }
}

Parameters

Parameter	Description
label	Optional display name for the tab container itself.
tab <name>	A named tab. Each tab takes a CanvasLayout or LinearLayout as its body. Tab names must be unique within the layout.

Tab body types

LinearLayout

LinearLayout stacks blocks in a single vertical column — no pixel positioning needed. It's the simplest layout and works well for summary views or narrow content.

Parameter	Description
label	Optional display name shown as the tab heading.
block <name>	References a block declared in the dashboard. List blocks in the order they should appear top-to-bottom.

tab overview: LinearLayout {
  label: 'Overview'
  block f1
  block v1
  block v2
}

CanvasLayout

CanvasLayout gives you pixel-precise control over block position and size. See AML CanvasLayout for the full parameter reference including width, height, grid_size, mobile, and block positioning with pos().

tab detail: CanvasLayout {
  label: 'Detail'
  width: 1080
  height: 800
  block v1 { position: pos(0, 0, 540, 400) }
  block v2 { position: pos(540, 0, 540, 400) }
}

Full example

A two-tab dashboard with a shared filter block:

Dashboard sales_overview {
  block f1: FilterBlock {
    label: 'Date range'
    type: 'date'
  }
  block v1: VizBlock {
    label: 'Revenue by month'
    viz: LineChart { dataset: ecommerce }
  }
  block v2: VizBlock {
    label: 'Orders by region'
    viz: BarChart { dataset: ecommerce }
  }
  block t1: TextBlock {
    content: @md ## Notes;;
  }

  view: TabLayout {
    tab charts: CanvasLayout {
      label: 'Charts'
      width: 1080
      height: 500
      block f1 { position: pos(0, 0, 300, 60) }
      block v1 { position: pos(0, 70, 540, 400) }
      block v2 { position: pos(540, 70, 540, 400) }
    }
    tab notes: LinearLayout {
      label: 'Notes'
      block t1
    }
  }
}

See also

• AML Dashboard: full dashboard syntax including blocks, interactions, and settings
• AML CanvasLayout: pixel-positioning reference with mobile layout options