Search

Tuesday, October 8, 2013
0 comments

How to Use ToolBar Control: WPF

10:04 AMTuesday, October 8, 2013
Toolbar control is a container control, that can contains other types of controls like labels, buttons even other containers. In our windows environment, there is also a toolbar which contains our shortcut buttons with images. Wherever we want to go in computer, we can go through a single click on the toolbar’s buttons.

<ToolBar Header="Header of Toolbar Control"/>

The above line of XAML code will place a toolbar control with the header text. The header text will be the above text i.e. “Header of Toolbar Control”. The following image shows the toolbar control:

How to use ToolBar control in WPF XAML

In the right side of this toolbar there is a symbol down arrow key which provides an overflow mechanism. This mechanism is used, when there are more items to fit in the control, to place those items in this overflow area.
<ToolBar VerticalAlignment="Bottom">
<Button Content="File"></Button>
<Button Content="Edit"></Button>
<Button Content="View"></Button>
<Button Content="Help"></Button>
</ToolBar>

Just analyse the above XAML code, it contains four buttons like a simple menu bar. These buttons will be shown in the toolbar control without using the overflow area.

How to use ToolBar control in WPF XAML

Now, if we want to use that overflow area then just decrease the width of this control as I do in following XAML code.
<ToolBar VerticalAlignment="Bottom" Width="150">
<Button Content="File"></Button>
<Button Content="Edit"></Button>
<Button Content="View"></Button>
<Button Content="Help"></Button>
<Button Content="Height"></Button>
<Button Content="Width"></Button>
<Button Content="Margin"></Button>
</ToolBar>

Using this code it will show four buttons by default, and the last three button in the overflow area. It means when we have some more items to be used, then those items will placed on that overflow area.

How to use ToolBar control in WPF XAML

Protected by Copyscape Online Copyright Protection Software

0 comments :

Post a Comment

 
Toggle Footer
Top