¿Cómo personalizo el diseño de WPF StatusBar?
layout controls (3)
En realidad, siguiendo la respuesta de Kent probé esto y funciona bien:
<StatusBar>
<StatusBarItem DockPanel.Dock="Right">
<TextBlock>Go!</TextBlock>
</StatusBarItem>
<StatusBarItem DockPanel.Dock="Right">
<TextBlock>Set</TextBlock>
</StatusBarItem>
<StatusBarItem DockPanel.Dock="Right">
<ProgressBar Value="30" Width="80" Height="18"/>
</StatusBarItem>
<!-- Fill last child is true by default -->
<StatusBarItem>
<TextBlock>Ready</TextBlock>
</StatusBarItem>
</StatusBar>
Agregar más de un elemento secundario a una barra de StatusBar
WPF da como resultado un diseño deficiente con poca opción de personalización. Por ejemplo, este código:
<Window x:Class="StatusBar.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<StatusBar DockPanel.Dock="Bottom">
<StatusBarItem>
<TextBlock>Ready</TextBlock>
</StatusBarItem>
<StatusBarItem>
<TextBlock>Set</TextBlock>
</StatusBarItem>
</StatusBar>
<Label>Main Content</Label>
</DockPanel>
</Window>
Resultados en:
Este no es el diseño ideal, ya que el "Conjunto" se aprieta contra el "Listo".
¿Cómo obtengo un control total sobre el diseño del control WPF StatusBar
?
Por defecto, StatusBar
usa un DockPanel
para DockPanel
sus hijos. Esto funciona bien para un artículo, pero tiende a crear problemas e inconvenientes cuando se trabaja con más de un niño.
Para obtener un alto nivel de control sobre el posicionamiento de los hijos de la barra de estado, puede cambiar el DockPanel
por una Grid
:
<Window x:Class="StatusBar.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<StatusBar DockPanel.Dock="Bottom">
<StatusBar.ItemsPanel>
<ItemsPanelTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</StatusBar.ItemsPanel>
<StatusBarItem>
<TextBlock>Ready</TextBlock>
</StatusBarItem>
<StatusBarItem Grid.Column="1">
<ProgressBar Value="30" Width="80" Height="18"/>
</StatusBarItem>
<StatusBarItem Grid.Column="2">
<TextBlock>Set</TextBlock>
</StatusBarItem>
<StatusBarItem Grid.Column="3">
<TextBlock>Go!</TextBlock>
</StatusBarItem>
</StatusBar>
<Label>Main Content</Label>
</DockPanel>
</Window>
Esto resulta en:
Para una discusión más profunda, por favor visite mi blog here .
Solo como referencia para aquellos que leen las excelentes respuestas anteriores, me gustaría sugerir algo aún más simple que logre los mismos resultados. (No DockPanel
ni DockPanel
ni StatusBar
).
<Window>
.
.
<Grid Margin="2">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="15"/>
</Grid.RowDefinitions>
<SomeContainer Grid.Row="0" /> <!-- Main Content.. -->
<Grid Grid.Row="1">
<!-- Status bar laid out here (using similar approach)-->
</Grid>
</Window>
Descargo de responsabilidad: Esto fue hace mucho tiempo cuando comencé con WPF.