The dock panel allows you to dock elements on the window in any direction, either top, bottom, left or right. This is useful when you want to divide the window or screen into specific areas with different functionality. It's also useful because the last element will take the whole remaining space in the center, unless this is disabled in the markup code.
The dock elements in the windows, you need to use the DockPanel.Dock element in the controls that you want to anchor. These controls must be declared inside the Dock element to take advantage of this feature. The DockPanel.Dock attribute takes the value of the position you want the control anchored. Below you can find a XAML markup example:
As you can see, we don't need to indicate the dock position of the last element because it'll automatically centers and takes the rest of the space. Another thing to keep in mind is that the controls only take the space that they need. The rest of the space is taken by the center.
You can also observe that some of the controls take more space than the others. For example, the Top button takes the whole width and also the Bottom one. But the Left and Right they just take the height between the Top and the Bottom. This is because of the order in which the controls were added in the dock panel.
As we mentioned earlier, the last control takes the whole space left in the center. If you want to disable this, just set the LastChildFill property to false and the control won't take the whole space. Below you can see an example:
