How to define condition variable on xaml ?

Question

I define some style on some button. The style supposed to change the button bitmap in 'mouse over'.

The problem is that there are two scenario with two different bitmap => that mean Scenario 1: the original bitmap is B1 and in 'mouse over' it need to be change to B2 Scenario 2: the original bitmap is C1 and in 'mouse over' it need to be change to C2

Those two scenario need to be on same button. In my implementation the original & 'mouse over' bitmaps are hard coded - and i don't now how to change it in the xaml.

I mean that i need some 'if' condition in the xaml that will know if I'm run on Scenario 1 or Scenario 2. . .

How can i do it ?

Thanks for any help.

Answer 1

just see this link...

http://stackoverflow.com/questions/1261908/wpf-how-to-create-image-button-with-template

Answer 2

I'd probably go with attached properties and MultiTriggers in that scenario. Something like this

public class ImageMode
{
    private static readonly DependencyProperty ModeProperty = DependencyProperty.RegisterAttached(
      "Mode",
      typeof(string),
      typeof(ImageMode)
      );
    public static void SetMode(DependencyObject element, string value)
    {
        element.SetValue(ModeProperty, value);
    }
    public static string GetMode(DependencyObject element)
    {
        return (string)element.GetValue(ModeProperty);
    }
}

XAML

<BitmapImage x:Key="B1" UriSource="Resources\B1.png"/>
<BitmapImage x:Key="B2" UriSource="Resources\B2.png"/>
<BitmapImage x:Key="C1" UriSource="Resources\C1.png"/>
<BitmapImage x:Key="C2" UriSource="Resources\C2.png"/>

<Style x:Key="FourStateImageButton" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Button>
                    <Image Name="c_image" Source="{StaticResource B1}"/>
                </Button>
                <ControlTemplate.Triggers>
                    <Trigger Property="AttachedProperties:ImageMode.Mode" Value="C">
                        <Setter TargetName="c_image" Property="Source" Value="{StaticResource C1}"/>
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsMouseOver" Value="True" />
                            <Condition Property="AttachedProperties:ImageMode.Mode" Value="B" />
                        </MultiTrigger.Conditions>
                        <Setter TargetName="c_image" Property="Source" Value="{StaticResource B2}"/>
                    </MultiTrigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsMouseOver" Value="True" />
                            <Condition Property="AttachedProperties:ImageMode.Mode" Value="C" />
                        </MultiTrigger.Conditions>
                        <Setter TargetName="c_image" Property="Source" Value="{StaticResource C2}"/>
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Button Style="{StaticResource FourStateImageButton}" AttachedProperties:ImageMode.Mode="B"/>

Best of luck