WPF Web Based

DockPanel Control: The DockPanel control is a layout panel control. The dockpanel control is very easy and useful control. We can provides an easy docking of elements to the left, right, top, bottom and center of the panel. The DockPanel is used to anchor elements to the edges of the container, and is a good choice to set up the overall structure of the application UI. Elements are docked using the DockPanel.Dock attached property.

It uses DockPanel.Dock attached property to determine the position of the element. The Dock element when Top or Bottom, will make the element appear Top or Bottom of each other, and when its Left and right it is left and right of each other. We will use DockPanel.Dock property in the DockPanel Control.

Defining Dock Panel In XAML:

<Page x:Class="WpfBrowserApplication3.Page2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page2" Loaded="Page_Loaded">
<DockPanel Name="dcPanel">
<Button Name="TopRect" DockPanel.Dock="Top" Background="LightGreen"
        Height="50" Content="Top"/>
<Button Name="LeftRect" DockPanel.Dock="Left" Background="LightBlue"
        Width="50" Content="Left"/>
<Button Name="RightRect" DockPanel.Dock="Right" Background="LightSalmon"
        Width="50" Content="Right"/>
<Button Name="BottomRect" DockPanel.Dock="Bottom" Background="LightCyan"
        Height="50"/>
<Button Name="Fill" Background="LightGray" />
</DockPanel>
</Page>