WPF Using template with DataTriggers

Question

I have a button that has two images attached to its DataContext.
The displayed image is bind to the button IsEnabled property.
Here is the XAML for the button:

<Button Name="SubmitButton" IsEnabled="{Binding IsSubmitEnabled}" Background="Transparent"> 
<Image Name="SubmitButtonImage" Height="50" Width="291" MinHeight="50" MinWidth="291">
    <Image.Style>
        <Style TargetType="{x:Type Image}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsSubmitEnabled}" Value="True">

                    <Setter Property="Source" Value="/Resources/startup/Submit_enabled.png"></Setter>
                </DataTrigger>

                <DataTrigger Binding="{Binding IsSubmitEnabled}" Value="False">
                    <Setter Property="Source" Value="/Resources/startup/Submit_disabled.png"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

Now instead of specifying the image in DataTrigger Value I want to use a template that is defined in the file like this:

        <ControlTemplate x:Key="SubmitEnabledTemplate" TargetType="{x:Type Button}">
        <Border                 
            Height="{TemplateBinding Height}"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="true">
            <Image Source="/Resources/startup/Submit_enabled.png"></Image>
        </Border>
    </ControlTemplate>

    <ControlTemplate x:Key="SubmitDisabledTemplate" TargetType="{x:Type Button}">
        <Border                 
            Height="{TemplateBinding Height}"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="true">
            <Image Source="/Resources/startup/Submit_disabled.png"></Image>
        </Border>
    </ControlTemplate>

Any ideas how to do that?

Answer 1

Try a DataTemplate Trigger , here is an example which may be relevant:

<ItemsControl ItemsSource="{Binding Path=Groups}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>

            <ContentControl x:Name="cc" Content="{Binding}" ContentTemplate="{DynamicResource ItemTemplate}"/>

            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Path=IsLeaf}" Value="False">

                    <Setter TargetName="cc" Property="ContentTemplate" Value="{DynamicResource GroupTemplate}"/>
                </DataTrigger>
            </DataTemplate.Triggers>

        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

See DataTemplate.Triggers property.

Answer 2

WPF has option to switch control template also CODE:

    <Window.Resources>
    <ControlTemplate x:Key="SubmitEnabledTemplate" TargetType="{x:Type Button}">
        <Border                 
            Height="{TemplateBinding Height}"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="true">
            <Image Source="/Resources/startup/Submit_enabled.png"></Image>
        </Border>
    </ControlTemplate>

    <ControlTemplate x:Key="SubmitDisabledTemplate" TargetType="{x:Type Button}">
        <Border                 
            Height="{TemplateBinding Height}"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="true">
            <Image Source="/Resources/startup/Submit_disabled.png"></Image>
        </Border>
    </ControlTemplate>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="50" />
    </Grid.RowDefinitions>
    <Button Grid.Row="0">
        <Button.Style>
            <Style TargetType="Button">
                <Setter Property="Template"
                        Value="{StaticResource SubmitEnabledTemplate}"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsSubmitButtonEnabled}"
                                 Value="False">
                        <Setter Property="Template"
                                Value="{StaticResource SubmitDisabledTemplate}"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>   
</Grid>