WPF: DockPanel.Dock = "Bottom" doesn't work as expected

Question

This concerns WPF.

As a simple test, I have a grid with 3 columns, the third column containing a Dock panel. In turn, this Dockpanel contains a TextBlock and a StatusBar, with the StatusBar having the (attached) attribute Dockpanel.Dock = "Bottom".

So I would expect the StatusBar to be at the bottom of the 3rd column, with the TextBlock - the one that says "I am TextBlock 3" - on top of it (within the same column).

To my surprise, however, the StatusBar appears on the RIGHT side of the TextBlock!

This is the relevant xaml-code (there is no code-behind made by me):

<Window x:Class="Testing.TestWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Testing"
        mc:Ignorable="d"
        Title="TestWindow" Height="500" Width="1000">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" MinWidth="180" MaxWidth="540"  />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0">I am Textblock 1</TextBlock>

        <TextBlock Grid.Column="1">I am Textblock 2</TextBlock>

        <DockPanel Grid.Column="2">
            <TextBlock>I am Textblock 3</TextBlock>
            <StatusBar DockPanel.Dock="Bottom">I am the statusbar</StatusBar>
        </DockPanel>
    </Grid>

</Window>

Anyone know what I'm doing wrong? Thanks.

score 12 · Accepted Answer · answered Dec 18 '15 at 22:05

Update your DockPanel to have LastChildFile="False"

  <DockPanel Grid.Column="2" LastChildFill="false">

The property is true by default, and since the StatusBar is the LastChild of the DockPanel, you see the behavior you are experiencing.

LastChildFill info from docs:

true if the last child element stretches to fill the remaining space; otherwise false. The default value is true.

score 0 · Answer 2 · answered Jan 05 '23 at 21:21

I think that a better solution would have been to put the status bar first and then let the text box, as the last child, fill the area above it. The relevant code would appear as follows.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" MinWidth="180" MaxWidth="540"  />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <TextBlock Grid.Column="0">I am Textblock 1</TextBlock>

    <TextBlock Grid.Column="1">I am Textblock 2</TextBlock>

    <DockPanel Grid.Column="2">
        <StatusBar DockPanel.Dock="Bottom">I am the statusbar</StatusBar>
        <TextBlock TextWrapping="Wrap">I am an incredibly long Textblock 3 and will fill the entire area above the statusbar...</TextBlock>
    </DockPanel>
</Grid>

Then it will end up looking like this.

WPF: DockPanel.Dock = "Bottom" doesn't work as expected

2 Answers2