WPF/Silverlight: How to add a command to a modified control template?

Question

I have overridden a control template for a certain 3rd party control that I am using:

So

<Style TargetType="Some3rdPartyControl">
   <Setter Property="Template">
     <Setter.Value>
       <ControlTemplate TargetType="Some3rdPartyControl">
       <Grid>
         ...alot of stuff..
      </Grid>
      </ControlTemplate>
     </Setter.Value>
   </Setter>
</Style>

Basically, I have added a button inside the control template:

<Style TargetType="Some3rdPartyControl">
<Setter Property="Template">
<Setter.Value>
   <ControlTemplate TargetType="Some3rdPartyControl">
   <Grid>
     <Button x:Name="myButton" Width="20" Height="20">
     ...alot of stuff..
   </Grid>
   </ControlTemplate>
   </Setter.Value>
</Setter>
</Style>

Basically, I'd like to hook up an event, err probably a command to this new button... How do I do this? Which type of command is it, and where would it live? I don't have access to the actual .cs class of this third party control.So I'm hoping this command could live somewhere in a file that I generate, is this even possible?

Answer 1

This Command comes from the templated parent ie Some3rdPartyControl ...

Does your Some3rdPartyControl has a Command type depepdency property in it? If yes then you can do a TemplateBinding to that.

       <Button x:Name="myButton" Command="{TemplateBinding Command}" Width="20" Height="20">

Else you will have to create a Command type attached property to your Some3rdPartyControl and use that to TemplateBinding to the Button.

    <Style TargetType="Some3rdPartyControl">
       <Setter Property="Template">
           <Setter.Value>
             <ControlTemplate TargetType="Some3rdPartyControl">
               <Grid>
                 <Button x:Name="myButton" Width="20" Height="20" Command="{TemplateBinding myNamespace:MyAttachedBehavior.MyAttachedCommand}">
                    ...alot of stuff..
               </Grid>
             </ControlTemplate>
           </Setter.Value>
       </Setter>
    </Style>

Now while implementing your Some3rdPartyControl do this...

   <Some3rdPartyControl myNamespace:MyAttachedBehavior.MyAttachedCommand="{Binding CommandFromDataContextViewModel}" />

CommandFromDataContextViewModel is your custom command. Due to TemplateBinding it reaches the Button and when Button click happnes this CommandFromDataContextViewModel command executes.

Does this answer your question?

Answer 2

You can have your command in your ViewModel and can bind that command to the button by simply using the RealtiveSource for binding like this -

 <Style TargetType="Some3rdPartyControl">
    <Setter Property="Template">
    <Setter.Value>
       <ControlTemplate TargetType="Some3rdPartyControl">
       <Grid>
         <Button x:Name="myButton" Width="20" Height="20"
 Command="{Binding DataContext.YourCommandName, RelativeSource={RealtiveSource FindAncestor, AncestorType={x:Type UserControl}}}">
         ...alot of stuff..
       </Grid>
       </ControlTemplate>
       </Setter.Value>
    </Setter>
    </Style>

Answer 3

Do you want a Command Property for your UserControl, or a static Command Definition?

If you want a Command Property, such as the Button.Command property, you need to create your own command definition in the code behind your UserControl. Look up creating your own custom DependencyProperty for that. The command that gets executed would "live" in whatever your DataContext was and the XAML code would look something like this:

<local:MyCustomControl SomeCustomCommand="{Binding SomeCommand}" />

If it's going to be a static Command Definition, like Copy or Paste commands, you need to create the static ICommand somewhere that the XAML can access, and bind the XAML with something like this:

<Button Command="{x:Static local:SomeCustomCommand}" />