DockPanel Tutorial

Introduction

The dock panel is a layout panel, that provides an easy docking of elements to the left, right, top, bottom or center of the panel. The dock side of an element is defined by the attached property DockPanel.Dock. To dock an element to the center of the panel, it must be the last child of the panel and the LastChildFill property must be set to true.

<Window x:Class="DockPanelTutotial.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">

    <Grid>

        <DockPanel LastChildFill="True">

            <Button Content="Top" DockPanel.Dock="Top" Click="Button_Click" />

            <Button Content="Bottom" DockPanel.Dock="Bottom" Click="Button_Click_1"/>

            <Button Content="Left" DockPanel.Dock="Left" Click="Button_Click_2"/>

            <Button Content="Right" DockPanel.Dock="Right" Click="Button_Click_3"/>

            <Button Content="LastChildFill" Click="Button_Click_4"/>

        </DockPanel>

    </Grid>

</Window>

********************************************************************************

using System.Windows;

namespace DockPanelTutotial

{

    /// <summary>

    /// Interaction logic for MainWindow.xaml

    /// </summary>

    public partial class MainWindow : Window

    {

        /// <summary>

        /// Initializes a new instance of the <see cref="MainWindow" /> class.

        /// </summary>

        public MainWindow()

        {

            InitializeComponent();

        }

        private void Button_Click(object sender, RoutedEventArgs e)

        {

            MessageBox.Show("DockPanel.Dock=Top");

        }

        private void Button_Click_1(object sender, RoutedEventArgs e)

        {

            MessageBox.Show("DockPanel.Dock=Bottom");

        }

        private void Button_Click_2(object sender, RoutedEventArgs e)

        {

            MessageBox.Show("DockPanel.Dock=Left");

        }

        private void Button_Click_3(object sender, RoutedEventArgs e)

        {

            MessageBox.Show("DockPanel.Dock=Right");

        }

        private void Button_Click_4(object sender, RoutedEventArgs e)

        {

            MessageBox.Show("LastChildFill=True");

        }

    }

}