Visual way to add DATATRIGGER in Expression Blend 2013

Question

Which is the right procedure to attach a datatrigger to an UI element using expression blend 2013?

If I write datatrigger directly in xaml it works good, but I want to know if is there a "visual way" to do that.

For example, creating a listboxitem style I'm doing something like this:

<DataTemplate x:Key="BoundingBoxTemplate" DataType="{x:Type is:BoundingBoxViewModel}" >
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding IsBorderVisible}" Value="True">
            <Setter TargetName="InsideRectangle" Property="Stroke" Value="Blue" />
        </DataTrigger>
    </DataTemplate.Triggers>
    <Grid>
        <Rectangle x:Name="InsideRectangle" 
                   Width="{Binding Width}" 
                   Height="{Binding Height}" 
                   Fill="Black" 
                   SnapsToDevicePixels="True" />
    </Grid>
</DataTemplate>

Thank you Lorenzo

score 5 · Accepted Answer · answered Nov 16 '14 at 11:13

Here is an example of how you'd do it using the GUI.

Consider this Window:

The goal in my example is to make the Stroke of the Rectangle blue when the Checkbox.IsChecked property changes to True.

For that first we have to add a ChangePropertyAction from Assets > Behaviors.

Drag and drop it onto a window/template/whatever. I put it into the window:

Now if you select it you can specify the Trigger in Properties.

I set the TriggerType to DataTrigger, the Binding to Checkbox.IsChecked and the required value for the Trigger to True.

Next, I specify the Value that should be changed when the Trigger fires.

I set the Target to the Rectangle, specified Stroke as PropertyName and set the Value this property should get when the Trigger fires to blue.

If I now start the application this is the result when I check the CheckBox:

enter image description here

Visual way to add DATATRIGGER in Expression Blend 2013

1 Answers1