wpf: is there a way to passing button click event to content template?

32 Views Asked by At

I want to use animation in the content template(the example is click event,actually may be other event even custom event),so is it possible to passing the event to content template?

<Button Content="Hello">
    <!--work-->
    <!--<Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To=".5" Duration="0:0:0.500"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>-->

    <!--not work-->
    <Button.ContentTemplate>
        <DataTemplate>
            <Grid x:Name="Grid">
                <TextBlock Text="{Binding}"/>
            </Grid>
            <DataTemplate.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="Grid" Storyboard.TargetProperty="Opacity" From="1" To=".5" Duration="0:0:0.500"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </Button.ContentTemplate>
</Button>
2

There are 2 best solutions below

0
AudioBubble On BEST ANSWER

You must move the trigger either to the ControlTemplate or to a Style.
If you are only interested in animating the button's opacity (and not the opacity of a particular template child, simply move the trigger to the Button:Triggers collection.

Note, if you don't add any special elements to the DataTemplate, it is completely redundant. The Button will implicitly add a TextBlock to host the text content

Unless you want to change the layout or override the default layout behavior you should implement the trigger in a Style or add it directly to the Button.Triggers collection:

Trigger in Button.Triggers

<Button Content="Hello!">
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <DoubleAnimation Storyboard.TargetProperty="Opacity"
                           From="1"
                           To=".5"
                           Duration="0:0:0.500" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

Trigger in Style

<Button Content="Hello!">
  <Button.Style>
    <Style TargetType="Button">
      <Style.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation Storyboard.TargetProperty="Opacity"
                               From="1"
                               To=".5"
                               Duration="0:0:0.500" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Style.Triggers>
    </Style>
  </Button.Style>
</Button>

Trigger in ControlTemplate
Note, this solution requires to implement the default behavior of the control for example mouse over effects.

<Button Content="Ah dutty and ah like it so!">
  <Button.Template>
    <ControlTemplate TargetType="Button">
      <Border Background="{TemplateBinding Background}"
              BorderBrush="{TemplateBinding BorderBrush}"
              BorderThickness="{TemplateBinding BorderThickness}">
        <ContentPresenter />
      </Border>
      <ControlTemplate.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation Storyboard.TargetProperty="Opacity"
                               From="1"
                               To=".5"
                               Duration="0:0:0.500" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </ControlTemplate.Triggers>
    </ControlTemplate>
  </Button.Template>
</Button>
0
mm8 On

so is it possible to passing the event to content template?

No, you can add a trigger to an element in the template but not the template itself.

The DataTemplate is not aware that it is, or may be, applied to a Button.

You can only add a Click event trigger to an actual Button element, which may be located in the template.