Pages

Tuesday 12 March 2013

The DockPanel layout in WPF

The DockPanel layout in WPF

A DockPanel is useful when you want to position various elements on the edges of your window. For example, you might put a menu and a toolbar at the top, an explorer bar at the left, and a status bar at the bottom. The remaining space would contain the main content with which the user interacts. As with a StackPanel, if you put a series of items on the same side, they will stack one after the other. In fact, if you add all the items at the top or the left, the behavior will be similar to that of a StackPanel.


Defining Dock Panel In XAML

<DockPanel x:Name="dockPanel1">
            <ToolBarTray Background="White" DockPanel.Dock="Top">
                <ToolBar Band="1" BandIndex="1">
                    <Button>File</Button>
                    <Button>Edit</Button>
                    <Separator/>
                    <Button>Gelp</Button>
                </ToolBar>
            </ToolBarTray>
            <StatusBar DockPanel.Dock="Bottom">
                <StatusBarItem>
                    <TextBlock>Ready</TextBlock>
                </StatusBarItem>
            </StatusBar>
            <StackPanel DockPanel.Dock="Left">
                <Expander Header="Useful">
                    <StackPanel>
                        <Button>Don't</Button>
                        <Button>Press</Button>
                        <Button>Me!</Button>
                    </StackPanel>
                </Expander>
                <Expander Header="Less useful"></Expander>
                <Expander Header="Silly"></Expander>
            </StackPanel>
            <Button Padding="10 10">
                <TextBlock TextWrapping="Wrap" TextAlignment="Center">This is all
of the remaining space that is not docked</TextBlock>
            </Button>
        </DockPanel>

No comments:

Post a Comment