WPF custom toolbar

Question

I am new with WPF.I want create custom toolbar with standart buttons on it as below.when i drag and drop controll from toolbox, all buttons should added automatically with text and images.I also want to add property CommandName for each button and when clicked i want bind command in viewmodel with command name.could you please help me ?

    <ToolBar VerticalAlignment="Top">
        <Button>Add</Button>
        <Separator></Separator>
        <Button>Update</Button>
        <Separator></Separator>
        <Button>Delete</Button>
        <Separator></Separator>
        <Button>Clear</Button>
        <Separator></Separator>
        <Button>Logout</Button>
        <Separator></Separator>
        <Button>Excel</Button>

    </ToolBar>

Answer 1

You will need RelayCommand class which you can get from here.

Then you create a RelayCommand in your ViewModel and bind the command with your button as following

<Button Command="{Binding YourCommandName}">

So basically you need a custom control. Put those buttons in control template of custom control. Expose click events for those buttons. Let say name of click event for Add button is ClickAdd. Then bind command as following to Add button in XAML

<local:YourCustomControl>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="ClickAdd">
            <i:InvokeCommandAction Command="{Binding YourCommandName}">  </i:InvokeCommandAction>
        </i:EventTrigger>
    </i:Interaction.Triggers>
</local:YourCustomControl>

xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"

Answer 2

thank you very much. problem was i didnt set DefaultStyleKey.So when i drag and drop control from toolbox the buttons that i add in controltemplate didn't apper on window.basicly solution is

 public class StToolBar:ToolBar
    {
        public StToolBar()
        {
            this.DefaultStyleKey = typeof(StToolBar);
        }
    }

Generic.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:UserControl">
    <Style TargetType="{x:Type local:StToolBar}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:StToolBar}">
                        <ToolBar>
                            <Button>Add</Button>
                            <Button>Update</Button>
                        </ToolBar>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>


</ResourceDictionary>