Using Behaviors : A Quick Walkthrough

March 19th, 2009     |     View Comments

In my previous post, I provided a brief introduction to Behaviors and how they can be used to simplify tasks that were once complicated. My post was deliberately vague on details, so this post will start a series of posts on using behaviors as well as writing your own behaviors. Let’s first look at using behaviors from the point of view of a casual user.

1. Download and Install Expression Blend 3 Preview
First, if you haven’t done so already, download and install Expression Blend 3 Preview. The download takes a bit of time, but the installation should be a breeze.

2. Create a new Silverlight 3 Project
Once you have Expression Blend 3 installed, launch it and create a new Silverlight 3 Application + Web Site via the New Project dialog:

newprojectidialog

Give your project a descriptive name if you want, but it is certainly not mandatory!

3. Draw out a Button
With your project created, draw out a small button and give it the text “Click Me:.

myButton

You can change your button’s text by selecting it and modifying the Content property in the Properties Inspector.

4. Downloading Some Behaviors
You now have a simple app with a button that says Click Me. Too bad clicking on the button doesn’t do anything right now. Let’s change that. What you are going to do is download some sample behaviors I have already created.

Go to the following link and download the behaviors archive to your hard drive: http://gallery.expression.microsoft.com/SampleSLBehaviors

Once you have downloaded the archive, extract the files to a location you can easily access. There will be a SilverlightPreviewBehaviors folder with a References and Project Files folder. Inside your References folder, there will be two files – Microsoft.Expression.Interactivity.dll and SLPreviewBehaviors.dll:

twoAssemblies

5. Adding a Reference to Behaviors
Now that you have downloaded and extracted some behaviors, it’s time to get Blend to recognize it. Go back to your Blend project, find the Project pane, right-click on your References folder, and select the Add Reference menu item:

addingReference

The Add Reference dialog will appear. Browse to the location of your earlier extracted Assembly folder and select the Microsoft.Expression.Interactivity.dll and SLPreviewBehaviors.dll. Once you have selected these DLLs, click Open to add references to these DLLs to your project.

You’ll know you have succeeded when your References folder in the Project contains the names of the two DLLs you added:

image

Note:
We have an easier way of doing this step, but I (or another Blender) will describe that at a later date.

6. Applying a Behavior
With the references added, Blend now is aware of what is contained inside the two DLLs. Launch your Asset Library and navigate to the Behaviors tab. You will see a list of behaviors that you can pick and choose from:

behaviorsTabAssetLibrary

The behavior I want you to use is called HyperlinkAction. Drag and drop your HyperlinkAction from the Asset Library and drop it onto the button on your artboard:

applyingABehavior

Once you have dropped your behavior onto the element, you will notice that your behavior now has focus with properties of the behavior displayed in the Properties Inspector.

7. Modifying Behavior Properties
Right now, your properties inspector will be displaying all of the properties your HyperlinkAction exposes:

hyperlinkProperties

Because HyerlinkAction is the Action variant of a Behavior, the Properties Inspector displays the Trigger properties first followed by any custom properties this behavior exposes. I will explain what the “Action variant of a Behavior” actually means in the future.

The first category you will see is Trigger. A trigger determines what exactly will cause your behavior to fire. In our case, the trigger we are using is EventTrigger, and it will fire when the Loaded event is fired. We probably want this behavior to fire when someone actually Clicks on the button, so click on the EventName drop-down and select Click from the list:

changingToClickEvent

Your behavior will now only trigger when the button is clicked because you changed your EventTrigger’s event to be Click.

The final thing you can change is the URL that we launch when you click. You can change the TargetURL property to something else other than the default value of http://www.live.com.

8. Running your App
The final (and probably the easiest!) step is actually running your app. Simply hit F5. Once your Silverlight application loads in your browser, click on the button you created and attached a behavior to. When you click on the button, the URL you specified earlier will launch. That’s it!

Conclusion
One of our goals with behaviors is to make it very easy for someone to find a behavior and use them in their project. The second goal is to be able to modify the properties of a behavior easily by reusing one’s existing knowledge of the properties inspector. Hopefully, as you can see, finding a behavior from our gallery and using them in a project should be pretty straightforward. At the very least, I hope it is easier than you wiring up the event handler and writing some code yourself :)

Cheers!
Kirupa :)

View Comments to “Using Behaviors : A Quick Walkthrough”

  1. Krilnon Says:

    These triggers really remind me of the map editor in Age of Empires (which is a good thing!). I was able to figure out how to use those when I was 8-or-so years old, so hopefully they will make things a lot easier for non-programmers.

    It looks like there will be a fair amount of customizability in individual triggers, which is a relief, since I can imagine that everyone would want their effects to be pixel-perfect.

  2. Roland Tomczak Says:

    Great news !!! The attached behavior pattern is very useful in WPF. Now, it seems to be perfectly integrated within Blend !

    I’ve tried your Silverlight sample, but.. Is there already a way to use this with WPF ? I guess that we’d only need the equivalent of Microsoft.Expression.Interactivity.dll for WPF ?

    Thanks,

    Roland Tomczak

  3. kirupa Says:

    Kril – yep, triggers are entirely extensible. While I primarily only have examples using the EventTrigger, you can have triggers that work with collisions, time ticks, etc.

    Roland – if you look in the Libraries folder of your Expression Blend 3 Preview folder in Program Files, you will see the equivalent WPF version of the DLL in a folder named WPF :)

  4. Roland Tomczak Says:

    Yes, thanks, I saw it a few hours after sending my post :)

    I’m starting playing with it ! :-)

  5. shaggygi Says:

    I added the Microsoft.Expression.Interactivity.dll ( Under WPF directory ) to my Blend project and do not see the behaviours in control box. Am I doing something wrong? Thanks

  6. Roland Tomczak Says:

    There’re not default behaviors included in this DLL. It just defines the base classes to create your own. But you could recompile the sample ones, given by Kirupa. They works just fine.

    Just one issue : You’ll have to define an empty class with “Microsoft.EXpression.Interactivity.Layout” as namespace.

  7. Blend 3 - User Experience Design Says:

    [...] Kirupa Chinnathambi – Using Behaviors : A Quick Walkthrough [...]

  8. G-Land Says:

    I like this article, I really enjoy read this, and thank you about this article. Have to help me about this. very nice :)

  9. Getting Started with Behaviors in Expression Blend 3 « vincenthome’s Tech Clips Says:

    [...] Getting Started with Behaviors in Expression Blend 3 March 25, 2009 — vincenthome   Step by  step walkthrough using Behaviors [...]

  10. mikekidder Says:

    Really cool stuff, so will the entire DLL that includes your behavior wind up in your XAP file?

  11. kirupa Says:

    mike – yes.

    :)

  12. WPF and Silverlight tips and tricks | WPF Dev Says:

    [...] Using Behaviors : A Quick Walkthrough [...]

  13. Jaime Rodriguez : MIX09 recap series part 1, favorite features and announcements Says:

    [...] Check out Kirupa’s walkthrough on behaviors. [...]

  14. MikeA Says:

    Just curious if you work for Microsoft? If so, I will weight the information here more heavily…. Microsoft standard practice seems to be to scatter great info like this randomly across the web on individual team members blogs and leave us poor peons scambling to figure out what info is official and reliable and what is not.

    Other than that, this is a great post. Thanks for taking the time to write it up!

  15. kirupa Says:

    Mike – yes, I do work for Microsoft (http://blog.kirupa.com/?page_id=2). On the Expression Blend team actually. More specifically, on Behaviors (among a few other things) :P

    I agree with you on how we scatter information without consolidating them in a proper location. There will be a more comprehensive resource for all of this in the near future as we more properly integrate behaviors as part of the Expression Blend UI and Help.

    :)

  16. MikeA Says:

    Thanks for your quick reply on your affiliation! Centralization would be appreciated…mostly because it helps me as a consumer of the data to judge it. When I see an msdn blog address I know what I’m getting is at least somewhat MS official info.

  17. Attached Behavior « Elad’s WPF Blog Says:

    [...] Silverlight 3.0 there is a built in behaviors infrastructure, by using the Behaviors (andor Triggers) attached property which contains a collection of [...]

  18. kirupaBlog - If it isn’t broken, take it apart and fix it! » Blog Archive » Behaviors : Writing Your Own Triggers Says:

    [...] my previous posts, I briefly discussed what behaviors are and how to use them. Let’s now talk about writing your own behaviors. Behaviors is a catch-all word that describes [...]

  19. Simon Says:

    Hi,
    I played a little with Silverlight behaviors. One thing that is cruely missing is the possibility to bind behavior properties to it’s target DataContext properties.

    I had the problem with a “NavigationButton”, where I would have liked to bind the NavigateUri and the TargetFrame properties from ViewModel / other ui elements.

  20. Coffee’s World » Behaviors and Blend Says:

    [...] a quick walkthrough from Kirupa, a comment and some links from Andy Beaulieu, and some commentary from Jose Fajardo about how you [...]

  21. Expression Blend 3のBehaviorサポート - SharpLab. Says:

    [...] 実際のExpression Blendの操作については大西さんによるAkira Onishi’s weblog : Expression Blend 3: Behaviorを使ったコーディングレスでのSilverlight 3アプリのインタラクションデザインというエントリに詳しいのですが、一点補足しますと、Expression Blend 3 PreviewでBehaviorを使うに当たっては、Behaviorを定義したアセンブリを自分で参照に加える必要があります。kirupaBlog – If it isn’t broken, take it apart and fix it! » Blog Archive » Using Behaviors : A …というエントリにある通り、Sample Silverlight 3 Behaviors辺りから適切なのを探してMicrosoft.Expression.Interactivity.dllと、ビヘイビアのdllを参照に加えて下さい。そうしないと、[Asset Library]の[Behaviors]の項には何も表示されません。製品版ではMSお手製ビヘイビアのアセンブリもFCLに同梱されるか、Silverlight Extentionに同梱されてほしいですね。 [...]

  22. Mike Taulty's Blog : Expression Blend 3: More on Actions, Triggers, Behaviors Says:

    [...] A Quick Walkthrough [...]

  23. Coffee’s World » Behaviors day Says:

    [...] start here on Kirupa’s blog and click around there, he’s got a few good pieces on triggers and [...]

  24. Anders Says:

    Hello,
    Do you know how to create an action or a behavior to call a method in the ViewModel (which is the DataContext)? I’m trying to use the InvokeCommandAction with the MVVM pattern, but I’m not sure how to make it work, yet. Any ideas?

  25. Amanda Says:

    Can you update your instructions? I downloaded the behaviors you reference, and it says the DLL’s are in a References and Project Files folder, but they are not. They are in \Bin\Debug

  26. jagoru Says:

    Не могу сказать, что мне не понравилось. Достаточно интересно и втолне интересно, но тем не менее есть кое какие добавления

  27. Coralclub Says:

    Очень много интересных мнений, но всё же давайте попробуем прийти к единому. Мне кажется, что автор молодец.

  28. Gorast Says:

    I dont understand why my SL3 dont look like yours?
    After I drag the HyperlinkAction to my button the only things I get in Properties are Trigger and Common Properties.

    And another thing. I was watching some video tutorials and I see that is very easy to add Trigger. I use SL3 and I dont even see Triggers and Interaction when I click my button in SL3. Is this changed from SL2? Something like AC2 and AC3 in Flash? Do I have to add Triggers only by code?

    Thanks

  29. Will Vega Says:

    Is there any way to remove a behavior from an object when a certain state is entered?

    For example, I want to have a button to navigate to a state, but after click I want the button to navigate to another state. Another example is to have a over state that applies to the whole app when a button is rolled over, then all goes normal when the mouse leaves it (navigates to state default), then onclick I don’t want the out state to happen. I need to remove therefore the behavior from the button.

    Is it possible to do this with Blend without writting code? Also writting code I have tried, this.behaviorName.IsEnabled = false an this.behaviorName.detach() without success. Any help will be appreciated thanks!

  30. MKA Says:

    ? Same for me, the Hyperlink Properties group doesn’t show up. Gorast – did you solve the problem?

  31. hoohi-mach.com Says:

    avast5 0 torrent
    free monopoly 3
    lagu malaysia baru minus one
    embrace after effects cs4
    english esl books
    letter to john
    scatti e ricatti avi
    radio channel
    programa 3d taringa
    paolo pietrangeli
    shaft samuel
    sonia nn
    iron man 2 movie ita
    taylor 039 s
    killzone liberation usa psp lightforce
    miracle on 1 street
    descarga peliculas calidad dvd taringa
    glee 2×6
    1000 signatures 350 x 19
    jaymal jai jaap
    pwnagetool 2.2.5
    key office 2002
    salsa rhythm machine
    milton teens finger fuck
    cumshot surprise lizzy styles
    babe fucked wmv v9 zip
    stox 11
    icehouse glam 1982 .mpg
    yobosh nivine naser
    photo enancer

  32. sms-listing Says:

    SMS Centre is a dedicated team of professionals, we have access to the servers Printout of calls of mobile operators of 92 countries around the world. We will help you in any situation (Treason husband or wife, SMS check your child’s test staff, boss, find out the truth about a person to read SMS messages, see the outgoing print sms and incoming calls, learn the location of a person in any country in the world) without their consent, it will be a secret who will stay with you!

  33. link wheel Says:

    If a company sucks, presumably, so does its HR department. And, having been there, I can bet on the fact, that one would go the FB way to discuss company policy only when other ways fail. And the consistency with which employers detest what employees call

  34. sim so dep Says:

    Can I make a suggestion? I think youve got something good here. But what if you happen to added a couple links to a page that backs up what youre saying? Or perhaps you could possibly give us something to take a look at, something that might join what youre saying to one thing tangible? Just a suggestion. Anyway, in my language, there will not be much good supply like this.

  35. south beach diet recipes Says:

    Hey cool blog, just wondering what anti-spam software program you utilize for feedback as a result of i get heaps on my blog. Anyway, in my language, there are not a lot good source like this.

  36. Sheron Labauve Says:

    I will not debate with your choices because I think you’re right on the money! You have place together normal case for your sentiments and now I know much more to do this unusual subject. Provides Thank you for incredible post and i arrive back for more.

  37. cabbage soup diet Says:

    Have you ever thought-about including extra videos cabbage soup diet to your weblog posts to maintain the readers extra entertained? I imply I just read by the entire article of yours and it was quite good but cabbage soup diet since I’m extra of a visual learner,I discovered that to be more helpful properly let me know how it seems! I really like what you guys cabbage soup diet are all the time up too. Such clever work and reporting! Sustain the good works guys cabbage soup diet I’ve added you guys to my blogroll. It is cabbage soup diet a great article thanks for sharing this informative information.. I’ll go to your weblog repeatedly for some latest post. cabbage soup diet Anyway, in my language, there are usually not a lot good source like this.cabbage soup diet

  38. link wheel Says:

    Thank you link wheel for the wise critique. link wheel Me & my neighbour have been link wheel getting ready to do a link wheel little analysis about that. We received link wheel an excellent guide on that matter link wheel from our local library link wheel and most books where not as influensive as your information. I am very glad to see such information which I used to be searching for a protracted time.This made very glad! Anyway, in my language, there aren’t a lot good source like this.

  39. Flavia Muhlbach Says:

    Adore this blog, ended up coming here for months. Totally going to RSS, but where’s the link?

  40. under sink water filters Says:

    I’ve been hunting for precisely this information. Although I was intending to uncover this article I’m really amazed that your particular experience was so easy to locate and how it properly in comparison to my very own experience.

  41. computer training Says:

    Fantastic site. Plenty of useful info here. I am sending it to several buddies ans also sharing in delicious. And obviously, thank you on your sweat!

  42. Alane Kassa Says:

    company is stricken by the way you addressed this subject. isn’t frequently I encounter a weblog with engrossing articles like yours. I will bookmark your feed to remain up to date with your approaching revisions.Just amazing and do carry on up the good work.

  43. esophageal spasms Says:

    Ah, reminds me of the famous quote”Writing is an adventure. To begin with, it is a toy and an amusement. Then it becomes a mistress, then it becomes a master, then it becomes a tyrant. The last phase is that just as you are about to be reconciled to your servitude, you kill the monster and fling him to the public.” – Winston Churchill

  44. True religion jeans outlet Says:

    I read with great interest.Thanks for you sharing.

  45. Beats by dre sale Says:

    If you necessary to process, you must move on to city middle, he summarize, problem to the accentuate home office within the You.S..

  46. Beats headphones sale Says:

    Accusation in court a few things i was looking for. I didn’t anticipate which i’d acquire a great deal from reading your own write up! You’ve got yourself a coming back website visitor

  47. south beach diet phase 1 Says:

    Hi, 

    Nice post guys……………

  48. guard card california Says:

    I know this isn’t subject specific but, I like your theme and was curious what name of it is? Thanks!

  49. gifts Says:

    weight loss

  50. true religions outlet Says:

    I have really learned new things through the blog post. One other thing to I have seen is that in most cases, FSBO sellers will probably reject people. Remember, they might prefer to not ever use your products and services. But if anyone maintain a gentle, professional connection, offering guide and staying in contact for about four to five weeks, you will usually be capable to win a conversation. From there, a listing follows. Thanks a lot

  51. Josef Tippey Says:

    I used to be content to search for this net-site.I desired in order to due to your time and energy because of this glorious read!! I unquestionably enjoying each little little it and I’ve an individual saved to see new stuff you article.

  52. Silver coins for sale Says:

    Great post. This subject, 30 silver coins Judas Iscariot is very interesting. Great work.

  53. Francene Voran Says:

    My own buddy and i also have been quarrelling about a problem related to this kind of! Now I know that we seemed to be appropriate. Thank you for the important points a person released.

  54. Jerald Schoen Says:

    This is actually wholesome web page. I like the content of it. There are numerous methods of improvement. Initially, you must elaborate the next with increased data. 2nd, you may think about inquiring as well as undertaking meeting more experts. It’s excellent website looked after utes worth added consciousness. Cultivate the wonderful function. I will be content.

  55. Cedric Ulwelling Says:

    Throughout the great design of things you’ll secure a B- for effort. Where you actually confused me was in all the facts. As it is said, details make or break the argument.. And it could not be more true in this article. Having said that, let me say to you what did work. The authoring is actually rather engaging which is probably the reason why I am making the effort to opine. I do not really make it a regular habit of doing that. Secondly, while I can easily notice a jumps in reasoning you come up with, I am not confident of exactly how you appear to unite your ideas that make the actual final result. For the moment I will, no doubt subscribe to your issue however trust in the near future you actually link your dots much better.

  56. Connor Says:

    forums who go above the very same subject areas? Thanks!

  57. Fully Automated Search Engine Optimisation Says:

    Thank you for the good writeup. It if truth be told was once a entertainment account it. Glance complex to more added agreeable from you! By the way, how can we communicate?

  58. nike mercurial indoor Says:

    you are good!very nice.

  59. shijun simith Says:

    Long time no see so excellent article, and I am very interested in your article, but also very much hope you can come to visit our websitePandora Jewelry&Pandora Bracelets

  60. Quick Diet Says:

    I will right away clutch your rss as I can’t to find your email subscription link or newsletter service. Do you have any? Please permit me recognize in order that I may just subscribe. Thanks.

  61. Roger Brust Says:

    Oh my goodness! an amazing article dude. Thank you However I am experiencing issue with ur rss . Don’t know why Unable to subscribe to it. Is there anyone getting identical rss problem? Anyone who knows kindly respond. Thnkx

  62. nike total 90 Says:

    I however cannot have faith I failed to notice about this one until visiting here.Regards once more!You happen to be of course a fellow who can enjoy the wonderful.Stick with it.

  63. Josphine Matsuki Says:

    This is the right blog for anyone who wants to find out about this topic. http://restate.biz You realize so much its almost hard to argue with you (not that I actually would want…HaHa). You definitely put a new spin on a topic thats been written about for years. Great stuff, just great!

  64. hair loss Says:

    this is ways to increase your

  65. k3nn2003 Says:

    the hyperlinkaction doesn’t seem to work with internal Silverlight xaml pages :( it works if it’s set to http://www.microsoft.com (for example) but not with /MainPage.xaml. how can I make this work for my Silverlight internal pages?

Leave a Reply

blog comments powered by Disqus