GitHub

Status Bar

PreviousNext

A thin bar of muted regions along the bottom of a window.

New control
InteractiveStatus Bar demo
<gpui:StatusBar Width="420" HorizontalAlignment="Left" Content="Ready">
  <gpui:StatusBar.Left>
    <StackPanel Orientation="Horizontal" Spacing="8">
      <TextBlock Text="main" />
      <TextBlock Text="0 errors" />
    </StackPanel>
  </gpui:StatusBar.Left>
  <gpui:StatusBar.Right>
    <StackPanel Orientation="Horizontal" Spacing="8">
      <TextBlock Text="Ln 1, Col 1" />
      <TextBlock Text="UTF-8" />
    </StackPanel>
  </gpui:StatusBar.Right>
</gpui:StatusBar>

Usage

gpui:StatusBar draws a 1px top border and three regions in muted 12px text, 8px apart: Left pinned to the start, Right pinned to the end, and the Content filling the middle. The content is centered when both ends are set, at the end when only Left is, and at the start otherwise. Each region holds one element and clips what does not fit; put several in a horizontal StackPanel with Spacing="8", as GPUI Kit's regions are rows with an 8px gap.

Examples

A bar with Left and content, one with content and Right, and one with content alone: with Left set the content moves to the end, otherwise it stays at the start.

Regions
InteractiveStatus Bar demo: Regions
<StackPanel Spacing="12" HorizontalAlignment="Left">
  <gpui:StatusBar Width="420" Left="main" Content="Ready" />
  <gpui:StatusBar Width="420" Content="Ready" Right="UTF-8" />
  <gpui:StatusBar Width="420" Content="Indexing… 42%" />
</StackPanel>

Not covered

  • Nothing: the control covers the component.