Full width toolbar

 Posted by  Programming  Add comments  Tagged with:
May 072010
 

As I ventured into WPF world, some things annoyed me more than others. One of those things was inability of toolbar to have no grip and to be full width.

After some time I found solution for grip problem. Just put toolbar in toolbar tray and set IsLocked attribute to true.

<ToolBarTray IsLocked="True">
    <ToolBar>
        ...
    </ToolBar>
</ToolBarTray>

Extending it’s width proved to be little bit more engaging. It took me a while to notice ActualWidth property of ToolbarTray control. As name says, it will return you actual width of ToolbarTray.

Since we want toolbar to span whole window, it should be inside DockPanel (and docked to top). Synchronizing ActualWidth of ToolbarTray and our Toolbar is then solved by simple data binding:

<DockPanel?
    <ToolBarTray IsLocked="True" DockPanel.Dock="Top">
        <ToolBar MinWidth="{Binding RelativeSource={RelativeSource AncestorType={x:Type ToolBarTray}}, Path=ActualWidth}">
            ...
        </ToolBar>
    </ToolBarTray>

    <Grid>
    </Grid>
</DockPanel>

Sample with everything done (and few things more) is here.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>