WPF DockPanel with Toolbar and Statusbar

Ivan-Mark Debono picture Ivan-Mark Debono · Nov 12, 2013 · Viewed 11.6k times · Source

I'm learning WPF and am trying to have a form that consists of a toolbar at the top, a statusbar at the bottom and the rest will be occupied by controls used for data entry.

This is what I have so far:

<Window x:Class="MyApp.MyForm"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MyForm" Height="346" Width="459">
    <DockPanel>
        <ToolBarTray DockPanel.Dock="Top">
            <ToolBar>
                <Button Command="New" Content="New" />
                <Button Command="Open" Content="Open" />
                <Button Command="Save" Content="Save" />
            </ToolBar>
        </ToolBarTray>
    </DockPanel>
</Window>

How do I add a statusbar at the bottom and another panel that will occupy the rest of the form?

Answer

Ehsan Hafeez picture Ehsan Hafeez · Nov 12, 2013

You can use DockPanel to arrange your controls. like this Toolbar will be dock at top, Statusbar at bottom and rest space will be assigned to datagrid because we have set the "LastChildFill" to true in dockpanel.

<Window x:Class="MyApp.MyForm"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MyForm" Height="346" Width="459">
<DockPanel LastChildFill="True">
    <ToolBarTray DockPanel.Dock="Top">
        <ToolBar>
            <Button Command="Edit" Content="Edit" />
            <Button Command="Delete" Content="Delete" />
            <Button Command="Refresh" Content="Refresh" />
        </ToolBar>
    </ToolBarTray>
<StatusBar Name="statusbar" DockPanel.Dock="Bottom">statusbar</StatusBar>
<DataGrid Name="grdEmployees" ItemsSource="{Binding EmpCollection}" />

enter image description here