This article describes how to create a simple style with one trigger in Microsoft Expression Interactive Designer. We will create a blue rectangle which becomes red when the mouse is over it.

Step 1 - Create a rectangle

Draw a rectangle using the "Rectangle" tool from the Tools palette
Click on the "Selection" tool on the tools palette

Step 2 - Clear the Fill property

EID by default sets a Fill to your rectangle which would override our Style settings, so we need to delete that property (if you switch to the xaml view, you will notice that there is a Fill attribute specified for the rectangle):
In the Properties palette, Click on the Fill property and Select "Clear/Default" -
this should clear the property

Step 3 - Create a Style for the rectangle

In the timeline, right click on your rectangle->Edit Style->Create Empty Style (usually you should be able to do this in the scene, but now, because the Fill property is not set, the rectangle may not selectable in the scene - known issue)

Click "Ok" in the "Create Style Resource" dialog

Step 4 - Set a default Fill for the rectangle inside the Style

Bring up the "Timeline" palette - note that we are currently editing the style (the node displayed should be "Style"). In order to get the mouse events at runtime, our rectangle will need a Fill; so we will set a Fill in the Style.

In the Appearance palette, set the Fill to "blue" (because we are in the Style editing mode, this will create a Setter inside the style)

Step 5 - Add a Trigger for the IsMouseOver

Click on the "Create New State" button; a new tab called "[No Triggers]" is displayed in the timeline; Click on it
Bring up the "Timeline Properties" palette (using the "View" menu)
Create a new trigger: Click on the "Add" button in the "Timeline Properties" to add a new trigger; in the first textbox type "IsMouseOver" and "true" in the second one; now the tab is called "IsMouseOver"
Ensure that the "IsMouseOver" tab is selected and change the "Fill" color in the "Appearance" palette to your desired color (e.g. "red")
Click the "Return Scope To Root" button (in the Timeline palette) to end the style editing mode

The final xaml

The final xaml looks like:
		<Storyboard x:Key="OnLoaded"/>
		<Style x:Key="RectangleStyle1" TargetType="{x:Type Rectangle}">
			<Setter Property="Fill" Value="sc#1, 0, 0, 1"/>
						<Condition Property="IsMouseOver" Value="True"/>
					<Setter Property="Fill" Value="sc#1, 1, 0, 0"/>
<Rectangle Stroke="#FF000000" Style="{DynamicResource RectangleStyle1}"
	Width="Auto" Height="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
	MinWidth="0" MinHeight="0" Margin="128,99,183,202" x:Name="Rectangle"