Search code examples
c#wpfstyleseventtrigger

How do I assign an EventTrigger to a reusable Button in its parent?


My reusable Button is basically a single button, of which ControlTemplate consists of a TextBlock and an Image. The Text property of TextBlock binds to a DependencyProperty to be exposed; similarly, the Source property of Image binds to a DependencyProperty. Here is the code for this Button.

<Button x:Class="Core.Resource.UserControlResource.NavigationButton1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:Core.Resource.UserControlResource"
         mc:Ignorable="d" 
         x:Name="myself">
<Button.Style>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="63"></ColumnDefinition>
                            <ColumnDefinition Width="63"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Image Name="IconImage" Height="42" Width="42" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Source="{Binding ElementName=myself, Path=ScreenIcon}" />
                        <TextBlock Grid.Column="1" Text="{Binding ElementName=myself, Path=ScreenTitle}" FontSize="25" TextWrapping="Wrap" VerticalAlignment="Center"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Button.Style>

where ScreenTitle and ScreenIcon are the aforementioned DependecyProperty.

Now, I want to use this Button in its "parent", a UserControl. The code will be like

<UserControl x:Class="Core.ParentControl"
         x:Name="parent"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 xmlns:usrCtrlResrc="clr-namespace:Core.Resource.UserControlResource;assembly=Core.Resource"
 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         >
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="32"/>
        <ColumnDefinition Width="32"/>
    <Grid.ColumnDefinitions>
    <usrCtrlResrc:NavigationButton1 ScreenTitle="sample Screen Title" ScreenIcon="/Core.Resource;component/MediaResource/pencilEdit.png">
    <TextBlock Grid.Column="1" Name="txtBlk" Text="SampleSample"/>
</Grid>

However, in order to add reactions when the Button is clicked (say to change the Grid.ColumnSpan property of TextBlock "txtBlk" to 2), what I want to do else is assign EventTriggers to my reusable Button in the "parent". I initially thought of two ways, but none of them works.

  • In my reusable Button, bind Style.Triggers to a DependencyProperty to get exposed to its "parent". However, it pops up "The property Triggers does not have an accessible setter".
  • Move the Style of my reusable Button to a ResourceDictionary and assign a Key for the "parent" to use. However, by doing this, I am not sure how to handle my two DependencyProperty, because it is not supposed to have code-behind for a ResourceDictionary file.

Any other workarounds? Thanks in advance.


Solution

  • I finally resolve this problem by directly override its Triggers. Code is as below.

    <usrCtrlResrc:NavigationButton1 ScreenTitle=... ScreenIcon=...>
        <usrCtrlResrc:NavigationButton1.Triggers>
            <EventTrigger RoutedEvent="usrCtrlResrc:NavigationButton1.Click">
                <EventTrigger.Actions>
                    <BeginStoryboard>
                        <Storyboard>
                            ...
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger.Actions>
            </EventTrigger>
        </usrCtrlResrc:NavigationButton1.Triggers>
    </usrCtrlResrc:NavigationButton1>