Slide show content from my talk at Silicon Valley Code Camp 10/03/2009.

1. Behaviors in Silverlight & WPF XAML Solutionsfor XAML Problems Joe Gershgorin http://twitter.com/ThatJoeG joe@bitspy.com

2. Demo Attached Behavior

4. Default values

5. Property Inheritance

6. Data Binding

7. Animation

8. Property Change Notification

9. Styling

10. In WPF Only:

11. Property Invalidation

13. Dependency Properties Properties on steroids private static void OnHighlightBorderBrushPropertyChanged (DependencyObject d, DependencyPropertyChangedEventArgs e) { varmyClass = (MyClass)d; }

14. Dependency Properties Properties on steroids Unless you enjoy punishment, once you understand dependency properties use a code generator to create them. For WPF I use Dr. WPF Code Snippets available from here: http://drwpf.com/Blog/Default.aspx?tabid=36&EntryID=22

15. Dependency Properties Properties on steroids Other code generators include Resharper templates and snippets for Silverlight from the Silverlight Contrib Project http://silverlightcontrib.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=21368 ReSharper Live Templates * SLDependProp - Generates a Dependency Property without a change callback * SLDependPropChanged - Generates a Dependency Property with a change callback * SLDependPropAttached - Generates an Attached Dependency Property * SLInlineSBCompletedHandler - Generates an inline Storyboard Completed handler * SLRoutedEvent - Generates a RoutedEvent

16. Dependency Properties Properties on steroids ReSharper File Templates * ClientAccessPolicy.xml File Template * CrossDomain.xml File Template * Silverlight Value Converter Template * Silverlight Panel Visual Studio Code Snippets * sldp - Generates a Dependency Property without a change callback * sldpc - Generates a Dependency Property with a change callback * sldpa - Generates an Attached Dependency Property * slevent - Generates a RoutedEvent * slsbc - Generates an inline Storyboard Completed handler * slpanel - Generates a Panel * slrss - A super basic collection class that loads an RSS feed * slvc - Silverlight Value Converter Template

17. Dependency Properties Properties on steroids KirupaChinnathambi’s Dependency Property Generator http://www.kirupa.com/blend_silverlight/dependency_property_generator.htm

20. Demo Blend Behavior

22. Attached property

23. Static class that acts on other classes

24. Classes instance that acts on other class instances

25. XAML Addon

27. Native support in Blend to detect behaviors in a open project, allow you to drag and drop a behavior onto an element on the design surface. Behaviors can be found in the asset panel and properties of the behavior can be set in the Blend properties pane.

28. Microsoft provided API for building Behaviors in both Silverlight & WPF.

29. Expression Gallery website to share and rate behaviors:http://gallery.expression.microsoft.com/en-us/site/search?f[0].Type=RootCategory&f[0].Value=behaviors&f[0].Text=Behaviors

32. Adds new item templates in both Visual Studio & Blend to create Actions, Triggers & Behaviors

33. Sketch Flow Player

36. Overrides

37. OnAttached

38. Good place to write init code, and event subscriptions

39. OnDeataching

40. Clean up resources, unsubscribe to events here

41. Methods

42. Attach & Detach

45. AssociatedObject

48. Triggers & Actions

50. The When, EventTrigger, KeyTrigger, etc..)

52. The What, Move, Shake, Change Opacity, Issue Command, etc..

56. Overrides

57. OnAttached

58. Good place to write init code, and event subscriptions

59. OnDeataching

60. Clean up resources, unsubscribe to events here

61. Methods

62. Attach & Detach

63. Can be used by code behind to attach/detach the behavior to a XAML element.

64. InvokeActions

67. Properties

68. Actions

69. Gets the actions associated with this trigger

70. AssociatedObject

71. The object you’re attached to (Grid, Button, etc..)

72. AssociatedObjectTypeConstraint

76. Overrides

77. OnAttached

78. Good place to write init code, and event subscriptions

79. OnDeataching

80. Clean up resources, unsubscribe to events here

81. Abstract Overrides

82. Invoke (object)

83. Called by trigger to Invoke this action’s behavior

84. Methods

85. Attach & Detach

88. Properties

89. IsEnabled(default is true)

90. Gets or sets value indicating if whether this action will run when invoked

91. AssociatedObject

92. The object you’re attached to (Grid, Button, etc..)

93. AssociatedObjectTypeConstraint

96. Target

97. Gets the target object. If TargetName is unset or cannot be resolved, default to AssociatedObject.

98. TargetName

99. Gets or sets the string name of the target. If TargetName is unset or cannot be resolved, default to AssociatedObject.

100. TargetTypeConstraint

102. Demo TargetedTriggerActionToggleVisibilityAction

103. Explore Blend Sample Behaviors Library of useful sample behaviors and effects http://expressionblend.codeplex.com/ rogram Filesicrosoft Expressionlend 3 Samples..xpression.Samples.Interactivity.dll rogram Filesicrosoft Expressionlend 3 Samples..icrosoft.Expression.Interactions.dll rogram Filesicrosoft Expressionlend 3 Samples..xpression.Samples.Shaders.dll Media Behaviors PlayMedia Action to play a media element. PauseMedia Action to pause a media element. TogglePlayPauseMedia Toggles a media element between play and pause mode. RewindMedia Action to rewind a media element. StopMedia Action to stop a media element.

104. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Triggers MouseGestureTrigger Triggers an event when the user makes a mouse gesture on the element. The gesture can be defined in Blend's property inspector. MouseEventTrigger Allows triggering from complex mouse events such as double click or mouse clicks with modifier keys. StateChangedTrigger Fires when a state is changing (or has changed). Can trigger when a specific state has changed or when any state has changed.

105. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Data Behaviors CallDataMethod An action which calls a method on the data context. Good for tying an event in your View to do something in the ViewModel for MVVM styled applications. InvokeDataCommand Example of invoking the CheckOut command when a button is clicked: #An example of calling the Remove method when a button is clicked: <i:EventTrigger EventName="Click"> <si:CallDataMethod Target="{Binding ShoppingCart.CurrentItem}" Method="Remove"/> </i:EventTrigger> #An example of calling the Remove method when a button is clicked: <i:EventTrigger EventName="Click"> <si:InvokeDataCommand Command="{Binding ShoppingCart.CheckOutCommand}"/> </i:EventTrigger>

106. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Data Behaviors DataEventTrigger Triggers an action when an event on the data context is raised (as opposed to EventTrigger’s routed event on a UI element). SetDataProperty Action which sets a property when executed. It can either set the value directly, or increment the value by the specified amount. #XAML syntax to play a sound every time the MessageSent event is raised from the User object: <si:DataEventTrigger Source="{Binding User}" EventName="MessageSent"> <im:PlaySoundAction Source="Bell.wma"/> </si:DataEventTrigger> #XAML syntax to increment a value when a button is clicked: <i:EventTrigger EventName="Click"> <si:SetDataProperty Binding='{Binding ItemCount, Mode=TwoWay}‘ Increment='True' Value='1'/> </i:EventTrigger>

107. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Data Behaviors DataStateBehavior Switches between two VSM states depending on the value of a binding. This is a convenient shorthand for two DataTriggers with GoToState actions. With Blend 3’s support for VSM in DataTemplates this makes it easy to have states for data. #XAML syntax for a DataTemplate with VSM and a DataStateBehavior to switch between the two states depending on whether the user is logged in or not: <DataTemplate x:Key='User'> <Grid> <VisualStateManager.VisualStateGroups> </VisualStateManager.VisualStateGroups> <i:Interaction.Behaviors> <si:DataStateBehavior Binding='{Binding IsLoggedIn}' Value='True‘ TrueState='LoggedInState' FalseState='LoggedOutState'/> </i:Interaction.Behaviors> </Grid> </DataTemplate>

108. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Data Behaviors DataStateSwitchBehavior Similar to the DataStateBehavior, allows switching between more than two states- useful for encapsulating more conditional state logic. FluidBindProperty Behavior which acts as a proxy for databound properties in order to animate the changing of the value. #XAML syntax of binding the height of a rectangle to a property and having it grow with an elastic ease: <si:FluidBindProperty Binding='{Binding Population}' PropertyName='Height' Duration='0:0:0.1'> <si:FluidBindProperty.Ease> <ElasticEaseEasingMode="EaseOut"/> </si:FluidBindProperty.Ease> </si:FluidBindProperty>

109. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Data Behaviors PropertyChangedTrigger Fires whenever a property changes, regardless of the new value. <si:PropertyChangedTrigger Binding="{Binding IsActive}"> <si:PlayMedia/> </si:PropertyChangedTrigger>

110. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Additional Behaviors CallMethod ClippingBehavior Provides a rounded rectangular clipping that scales with the element. Useful since Silverlight and WPF clipping geometries don't scale with objects. GoToNextState Go to the next state in a VisualStateManager. Useful for quickly navigating between various states. GoToPreviousState Go to the previous state in a VisualStateManager. Useful for quickly navigating between various states. SetProperty Similar to ChangePropertyAction but allows incrementing as well as setting. ShowMessageBox Displays a standard message box to the user

111. Explore Blend Sample Behaviors Library of useful sample behaviors and effects Prototyping Behaviors ListBoxAddOne Action which duplicates a random item in the ItemsSource collection of a ListBox. Useful for SketchFlow prototypes where you want to show adding a new item. ListBoxRemoveOne Action which removes a random item in the ItemsSource collection of a ListBox. Useful for SketchFlow prototypes to simulate removing an item. ListBoxRemoveThisItem Action for use inside of a ListBoxItem which will remove the item from the data collection of the owning ListBox. Effects This contains many of the effects from the WPF FX (http://www.codeplex.com/fx) project packaged up with full design-time support inside of Blend.

113. Identical API. Behaviors, Triggers, TriggerActions & TargetedTriggerActions abstract classes are available in both WPF in Silverlight System.Windows.Interactivity assembly.

114. Binding Support

115. Silverlight (as of version 3) only supports binding to a property of an object that does derives from FrameworkElement.

116. Behaviors, EventTriggers & TriggerActions abstract classes derive from DependencyObject.

118. Colin Eberhardt's Binding Helper Behavior:

119. http://www.scottlogic.co.uk/blog/wpf/2009/02/relativesource-binding-in-silverlight/

120. Adds Binding support to Silverlight 2:

121. ElementName,

122. RelativeSource Self

124. Morten's Surrogate Binders Behavior:

125. http://www.sharpgis.net/post/2009/05/03/Using-surrogate-binders-in-Silverlight.aspx

126. Adds Binding support to Non FrameworkElement object properties such as the Angle property of a Rotate RenderTransform.<TextBoxRenderTransformOrigin="0.5,0.5“ Text="Hello Universe!" binders:SurrogateBind.Value="{Binding Path=MoreValues.Heading}" binders:SurrogateBind.Target="RenderTransform.Children.Item[1].Angle" > <TextBox.RenderTransform><TransformGroup><ScaleTransform /> <RotateTransform /></TransformGroup></TextBox.RenderTransform> </TextBox>

128. Delay’s SetterValueBindingHelper:

129. http://blogs.msdn.com/delay/archive/2009/05/07/one-more-platform-difference-more-or-less-tamed-settervaluebindinghelper-makes-silverlight-setters-better.aspx

130. Adds Binding support to Style setters

131. Support binding to attached properties via a style setter too.<Style TargetType="Button"> <!-- WPF syntax: <Setter Property="Content" Value="{Binding}"/> --> <Setter Property="local:SetterValueBindingHelper.PropertyBinding"> <Setter.Value> <local:SetterValueBindingHelper Property="Content" Binding="{Binding}"/> </Setter.Value> </Setter> </Style>

133. Creating Behaviors & Actions that Support Binding

134. http://compiledexperience.com/blog/posts/Blendable-MVVM-Commands-and-Behaviors

135. Use BindingListener helper class available in Expression.Samples.Interactivity.dll

136. BindingListener uses the AssociatedObject as a relay for bindings.

139. Adding Binding Support for existing Trigger Actions Properties

140. Use TriggerActionBindingHelperBehaviorhelper class created by Joe Gershgorin (me), will release soon.

141. A Behavior that adds binding support to any TriggerAction property. A behavior for a behavior.

143. API parity in WPF and Silverlight

144. Facilitate MVVM design pattern

145. Reusable Encapsulated Functionality

146. Designer (Blend) friendly

147. XAML solutions for XAML problems

149. http://www.microsoft.com/downloads/details.aspx?FamilyID=F1AE9A30-4928-411D-970B-E682AB179E17&displaylang=en

150. Download Expression Blend Samples Codeplex Release:

151. http://expressionblend.codeplex.com/

152. Useful sample behaviors and effects

153. nRoute Toolkit: http://www.orktane.com/Blog/post/2009/09/29/Introducing-nRouteToolkit-for-Silverlight-%28Part-I%29.aspx

155. Kirupa’s blog: http://blog.kirupa.com/?cat=18

156. Shawn Wildermuth Writing Behavior Tutorials:

157. http://wildermuth.com/2009/05/16/Writing_Behaviors_for_Silverlight_3_-_Part_1

158. http://wildermuth.com/2009/05/16/Writing_Behaviors_for_Silverlight_3_-_Part_2

159. Video Tutorials:

161. Foothill Silverlight & WPF Classes

162. http://videos.visitmix.com/MIX09/

163. http://silverlight.net/learn/videocat.aspx?cat=12#sl3

164. http://silverlight.net/forums/51.aspx

165. Great General Silverlight Resources:

166. http://timheuer.com/blog/