Looking at Triggers and Actions
April 27th, 2009 | 9 Comments
Like I’ve mentioned several times earlier, behaviors in Expression Blend 3 are made up of extensible Triggers, Actions, and Behaviors. What I really have not done is explain in greater conceptual detail what each of those pieces do and how far you can push our default implementation. In this post, let’s fix that by giving Triggers and Actions their long-awaited detailed overview.
In a Nutshell
If I had to sum up what triggers and actions do, the following sentence is it:
Pretty simple, right? Let me take a few steps back and look at a few examples. When I flip on a light switch switch, the light needs to turn on. When I click on a button, a sound needs to play. When I hit a certain time, the application should close. What I have just described are simple cause-and-effect relationships, and in a nutshell, Triggers and Actions are nothing more than digital manifestations of them. The cause (When) is controlled by the Trigger, and the effect (Do) is controlled by the Action:
All of the examples involving Actions that I have shown you over the past few blog posts follow a similar pattern:

In the Blend UI, we suppress a lot of the details for you. You only drag and drop an Action onto an element, and the trigger is either automatically set as specified by the Action, or you can set it yourself. That seems simple…sort of!
Sneaky Like a Fox
What makes Triggers and Actions more interesting is how sneaky they actually can be. When you drag an Action onto an element in Blend, your Action is parented under this button:

What is worth looking into is what the Trigger and Action are looking at, and let’s assume the Trigger we are looking at is an EventTrigger. Dropping an Action onto the above button will set the Trigger’s source to that of the button itself, and it will also set your Action’s target to be that of the button as well:
What you have the ability to do is set the Source to some other element besides your button. Let’s say you have a checkbox you want to set as your EventTrigger’s Source instead.
With our current Behaviors implementation, you can simply change the Source of your Trigger to that of your checkbox very easily by setting the Trigger’s SourceName property to that of your checkbox:
This means that your Action will do something when the event you are listening for on your CheckBox fires.
You’ve just seen how we can set the source of a trigger, our EventTrigger, to that of another element besides the one your Action is parented under. To make things a bit more interesting, you also have the ability to target your Action to affect an element other than the one you are parented under as well!
If your Action inherits from TargetedTriggerAction instead of just TriggerAction, you gain access to the TargetName property that allows you to specify which element you want your Action to affect. So you can have something such as the following:
Your Action is parented under the Button, but your EventTrigger is actually listening for events from a CheckBox. When the trigger fires, your Action does its thing on a blue rectangle that it is targeting.The actual Button is merely the Action’s host and it derives no benefit from it because neither the Action nor the Trigger care about it. Sad, isn’t it?
Rationale Behind This
Right now, you are probably wondering why we allow you to do something like this. It isn’t as if you have to manually modify XAML for this. We provide UI today that allows you to easily do this. The reason has to to do with different approaches individuals have on how the relationship between a trigger and Action should work.
I tend to like the following approach where my Action is on the element that will be the Source of my trigger:
This is known as the Tell approach because I am telling my Action to affect something else. The other approach is known as Listen, and it is where you place your Action on the element that is being affected as opposed to the Source of the trigger:
There is no right or wrong way to approach how you wire up your Triggers and Actions. The thing to note is that our Behaviors API is flexible enough to support both, and our UI makes it easy for you to pick either Listen or Tell without having to do anything crazy.
Cheers!
Kirupa
:





May 4th, 2009 at 8:18 am
Hi,
I appologiese for posting this here, but I just wanted to say that code form http://www.kirupa.com/developer/actionscript/xmldataflash2.htm didn’t work. I fixed by replacing
if(loaded) {….
into
if(xmlData.loaded) { …….
I have Adobe Flash CS4.
All best,
Bozidar
P.S. Your website is one of the best created and designed that I have seen. Thank you for it.
May 12th, 2009 at 5:16 am
Hi Kirupa,
this is mansoor.can i have the code for hardrock memorabilla….
Thanks,
Mansoor
May 12th, 2009 at 10:11 pm
hi,
this is vass … i hve gone through the material what u have enclosed in it was really good and esay 2 understand .. it help me to hve an quick idea … thx
May 16th, 2009 at 3:45 pm
[...] my earlier article a few weeks ago, I described the basics of Triggers and Actions. Triggers and Actions satisfy your standard, run-of-the-mill, cause and effect condition where [...]
May 16th, 2009 at 3:48 pm
Hi Mansoor,
The code for HardRock Memorabilia is not publically available, but you can get a basic overview of how to create a custom, filtered view using Deep Zoom here: http://blog.kirupa.com/?p=212
Cheers!
Kirupa
June 5th, 2009 at 4:41 am
[...] my earlier article a few weeks ago, I described the basics of Triggers and Actions. Triggers and Actions satisfy your standard, run-of-the-mill, cause and effect condition where [...]
June 6th, 2009 at 2:19 pm
[...] an earlier post, I described how you can change what your EventTrigger and Action (based on TargetedTriggerAction) [...]
July 8th, 2009 at 11:29 pm
I am just curious why not bother the trouble Re-Invent the wheel again? The WPF 3.5 already provide a framework for Trigger and TriggerAction. Basically every UIElement or DataTemplate/ControlTemplate can have a collection of Triggers and Each Trigger can have either Setters or TriggerActions when Trigger fire. Both Trigger and TriggerAction are abstract base class that user can extended. What you can do is fix the problem in current Trigger/Action implementation and provide a better UI in Blend to support it. I believe the native Trigger/Action is much more efficient then this one.
July 9th, 2009 at 5:37 pm
Hi Jasom – a large part of the reason had to do with providing Trigger/Action support in Silverlight. For WPF, we tried to be as close as possible to the existing Trigger and TriggerAction implementation, but there were some changes that needed to made.