CODEWITHSUNDEEP
wpfdocking
Jagd
Jagd

Reputation: 7306

Child not displaying in expected position of DockPanel

I have a Window with a DockPanel, and within the DockPanel I have two user controls. The "header" user control is docking at the top of the window like I expect. However, the "footer" user control does not dock at the very bottom of the window, but instead seems to dock about 500 or so pixels below the header. There's maybe another 300 pixels (I'm just guessing by where it appears in the window) below the "footer" of just empty space.

The header control has a DesignHeight of 100, and the footer control has a DesignHeight of 20.

Why is the footer not docking at the very bottom of the Window?

MainWindow.xaml code:

<Window x:Class="RATTA.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:vm="clr-namespace:RATTA.ViewModel"
        xmlns:vw="clr-namespace:RATTA.View"
        Title="RATTA" Height="800" Width="600" Background="WhiteSmoke">

        <DockPanel Width="Auto" Height="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">

            <vw:HeaderVw DataContext="MainHeaderVM" DockPanel.Dock="Top" />

            <vw:FooterVw DataContext="MainFooterVM" DockPanel.Dock="Bottom" />

        </DockPanel>
</Window>

Upvotes: 1

Views: 805

Answers (1)

learningcs
learningcs

Reputation: 1926

The DockPanel.Dock property for the last child in the DockPanel does nothing because the DockPanel's property LastChildFill is set to true by default. Therefore, it doesn't matter what DockPanel.Dock property you assign -- if it's the last child, it's going to fill the remainder of the DockPanel.

The reason why it appears to be about 300px from the header and the bottom of the window is because when the last child fills if the last child's height is explicitly set it will sit in the center of the remaining space.

There are a few solutions which depend on your design intentions.

  • Place another object after the footer (eg. a Grid). This is typical usage of a DockPanel -- toolbars, statusbars, menus, etc. are docked first and the primary content of the view is the last object in the DockPanel (it will fill the remaining space).
  • Place the footer before the header. This will cause the footer to be docked first and the header will fill the remainder, which might be what you want to do.
  • Alternatively, set LastChildFill of the DockPanel to false. This will cause your docked objects to behave correctly but the remaining space in the DockPanel won't be filled if you add another object to it.
  • Use a different control. A Grid could also be a suitable control -- 3 rows, the first with a height of Auto, the second with no specified height (or a height of * or 1* if you want to be explicit), and the third with a height of Auto.

Upvotes: 3

Related Questions