electric beach

Christian Schormann

Tuesday, March 24, 2009

Blend 3 Behaviors: Interactivity Without Code

Blend 3 introduces a powerful design pattern for interactivity: Behaviors. Behaviors allow designers to create production-quality interactivity without writing code. They work in WPF and Silverlight.

For those of you who are missing triggers in Silverlight: Behaviors give you the same power as triggers and actions plus more, in a modular and extensible fashion, not just for WPF but also for Silverlight!

In Blend 1 and 2, there is quite a bit of interactivity that can be created without code:

  • You can create animations (storyboards) and trigger their playback
  • You can create working interactive control skins
  • You can use data binding to automatically display data or modify the state of your user interface
  • You can interactively create, apply and edit data templates that completely customize the appearance and visualization of data

For many common interactions, however, in Blend 1 and 2 you still have to fall back to code. This is even more unsatisfactory once you realize how generic a lot of common interactivity code actually is – there just usually is no good place and model to encapsulate and package bits of interactivity in a reusable, designer-friendly manner.

Blend 3 therefore introduces a new concept called behaviors for both Silverlight and WPF. Behaviors are self-contained, re-usable snippets of interactivity that can be assigned interactively to art board content. These snippets inject their DNA, the interactivity they represent, into the element they are assigned to and make them interactive.

Designers can use behaviors right on the Blend art board – they can be applied to elements with drag and drop, and many have configuration options available through the property inspector. The building blocks of behaviors are very modular, which makes behaviors flexible and adaptive in their application. Best of all, behaviors allow designers to add production-quality interactivity to their designs. Behaviors are not just a prototyping tool that is impossible to use in a production scenario.

Developers (or, of course, designers that like to wear a developer hat once in a while) can create new behaviors in code. Once created, the behaviors show up in the Blend asset tool, similar to custom controls. Behaviors are extremely general and extensible and enable design teams to build their own re-usable vocabulary of interactivity.

For those readers familiar with Triggers and Actions in WPF: Behaviors are a logical extension to the existing models – they build on and extend the idea behind Triggers and Actions. And very importantly, with the Behaviors mechanism in Blend 3, all this power is available for Silverlight too, even though the Silverlight platform does not have built-in support for Triggers. We will talk more about the technical details behind behaviors in future posts.

Behaviors can be used for simple things, such as opening and closing dialogs, running animations, setting properties, validating input or navigating between screens. Behaviors can also be used to encapsulate complex code-driven animations.

Behaviors also can be used for more complex interaction that go way beyond what triggers in WPF can handle, such as making objects drag-able in a container. We even have written internal behaviors that simulate physics or that allow for on-the-fly scripting.

While we will ship Blend 3 with a set of standard behaviors, probably one of the best features of the behaviors pattern is that it is highly extensible – you can write your own, or even better, somebody else can write new behaviors for you. Behaviors are a great new element of the designer-developer workflow: For developers, they provide a well-supported design pattern that makes it possible to encapsulate interactivity well separated from actual UI instances. For a designer, behaviors are building blocks that make interactivity possible beyond the boundaries and limitations of classical custom controls.

Behaviors add a lot of flexibility all across Blend: Control skins can be made much more flexible using a behavior that can change visual states of a control in reaction to events. Prototypes can be brought to live with interaction behaviors. There are countless other examples.

Blend 3 will ship with a set of Behaviors useful in many general scenarios. We also plan to continuously provide additional behaviors out of band. And we of course hope that the community will begin creating and sharing behaviors as well – our new Expression Gallery is one location where you can publish your behaviors to the world. There are already several samples up there, written by members of the Blend team and the community…

posted by cs at 17:18  

16 Comments

  1. Where can I find basic walkthroughs on how to create a behavior?

    Comment by shaggygi — March 25, 2009 @ 03:46

  2. [...] Blend 3 Behaviors: Interactivity Without Code (Christian Schormann) [...]

    Pingback by Dew Drop – March 25, 2009 | Alvin Ashcraft's Morning Dew — March 25, 2009 @ 05:13

  3. Dear Christian;

    I watched both of your sessions and I really, really love the SketchFlow and the fact that you didn’t make shortcuts. This is the most important tool to bring non-Microsoft developers and designers to SL and WPF. Great Job!

    I would like to suggest to accompany the release with a good and detail set of training videos to get us up to speed. After all, since this is a visual tool, I think video training serves a better purpose than tutorials and blogs. Too much time to write and then read all these new features.

    Thank you and enjoyed your “well spoken” presentations!
    ..Ben

    Comment by BenHayat — March 27, 2009 @ 08:34

  4. Hi Ben,
    thanks for your kind words, much appreciated. We certainly plan to have a lot of material available when we launch, in a wide variety of formats, including video.

    Regards,
    CS

    Comment by cs — March 28, 2009 @ 20:17

  5. [...] For introductory information on Behaviors the motivation for them, please see my previous post here. [...]

    Pingback by Silverlight Travel » Blend 3: Triggers, Actions, Behaviors — March 30, 2009 @ 12:49

  6. [...] of what all three mean, check out Jeff Kelly’s blog post as well as Christian Schormann’s two overview blog posts on this [...]

    Pingback by kirupaBlog - If it isn’t broken, take it apart and fix it! » Blog Archive » Writing Behaviors : Triggers (DoubleClickTrigger to be Exact!) — April 9, 2009 @ 21:26

  7. [...] Behaviors in WPF and Silverlight are one of the features that were introduced with Blend 3, and unlike attached behaviors, they benefit from full designer support in Blend 3, thus providing a much higher level of accessibility to developers and designers alike. [...]

    Pingback by hardcodet.net » Blog Archive » WPF Behavior Samples — April 13, 2009 @ 00:21

  8. [...] has been looking in-depth at Behaviors. His posts cover a thorough overview of Behaviors (Blend 3 Behaviors: Interactivity Without Code); followed by an exploration of the major concepts used in the creation of Behaviors including the [...]

    Pingback by The Silverlight Blog - Home — May 6, 2009 @ 13:48

  9. [...] Blend 3 Behaviors- Interactivity Without Code [...]

    Pingback by Mike Taulty's Blog : Expression Blend 3: More on Actions, Triggers, Behaviors — May 8, 2009 @ 05:18

  10. [...] of what all three mean, check out Jeff Kelly’s blog post as well as Christian Schormann’s two overview blog posts on this [...]

    Pingback by Top-silverlight » Blog Archive » Behaviors : Writing Your Own Triggers — June 2, 2009 @ 00:24

  11. [...] has been looking in-depth at Behaviors. His posts cover a thorough overview of Behaviors (Blend 3 Behaviors: Interactivity Without Code); followed by an exploration of the major concepts used in the creation of Behaviors including the [...]

    Pingback by Top-silverlight » Blog Archive » Product Feature Highlight: Expression Blend 3 – Behaviors — June 2, 2009 @ 23:53

  12. [...] Overview of Behaviors [...]

    Pingback by WPF Body Behavior « Code Blitz — June 23, 2009 @ 22:24

  13. [...] Often, when faced with this design constraint, using a behavior is a good alternative. A behavior is simply an attached property that provides access to the element it’s attached to, and therefore to the whole tree it belongs to. I used a similar technique in my drag and drop blog post. More recently, Blend 3 has embraced this technique by providing support for applying behaviors at design time, and has generated a community around the creation of reusable behaviors. You can read more about Blend’s support for behaviors in Christian’s blog. [...]

    Pingback by Bea Stollnitz » How can I add labels to a WPF pie chart? – Implementation details — September 7, 2009 @ 10:54

  14. [...] I decided to have some kind of automated way to do this. I needed something that you could call that would put in the right rectangles in the right places with the right colours but was easy to manage, so I wrote a behavior. If you’re unfamiliar with Silverlight Behaviors (apologies for the American spelling, but that’s what they’re called) then read this post by Christian Schormann from the Blend team. [...]

    Pingback by Silverlight Grid Row Gradients « Jim Lynn — June 30, 2010 @ 16:54

  15. [...] vous expliquer plus concrètement  ce qu’est une behavior, je vous renvoie vers le billet de Christian Schormann qui se charge parfaitement de faire [...]

    Pingback by C#, Silverlight, WPF, Linq … » Création d’une Behavior par un développeur — July 31, 2010 @ 12:46

  16. [...] introduction to the concept of behaviors in WPF here and here by Christian [...]

    Pingback by JAPF » Blog Archive » A WPF behavior to improve grouping in your ListBox — November 12, 2010 @ 06:44

RSS feed for comments on this post. TrackBack URI

Sorry, the comment form is closed at this time.

Powered by WordPress