1 February 2011 by Gergely Orosz

This post is a summary on my 4 part series covering everything I think a developer needs to know about Styles in Silverlight in order to work with them in XAML or programatically. The overview of the series is as follows. All of the topics link to the original, more detailed article: feel free to explore the parts that interest you most!

Introduction

• What are Styles?
• Styles: List of Setters for a Given Type – Styles are collections of property setters to be applied to a visual element. It is mandatory to specify the TargetType for each Style.
  • TargetType
  • Setters
• Defining Styles in XAML – this can be done two ways: either within the Resources section or inline.
  • Defining Styles in the Resources Section – this is the recommended way. Styles defined here need to specify an x:Key attribute and can be reused within the document with StaticResources. Keys need to be unique within a resource section.
  • Defining Styles Inline – declaring styles inline does not have real advantages: it’s lengthy and the Style declared can’t be re-used from the XAML.
• Referencing Styles Defined in XAML from Code Behind – Styles defined in XAML (within the Resources section) can be referenced from code behind.
• Styling Controls Can’t Always Be Done With Styles: Templates and Themes – The visual look of controls can’t always be altered just by setting properties of the control via styles. A more powerful way of customizing control look and feel is via Control Templates and Themes.

Inheritance, Precedence and Other Advanced Topics

• Re-Using Styles for Different Types: the TargetType of the Style can be a parent type of the target object as long as it only sets properties of the parent type.
• Style Inheritance: The BasedOn property – inheriting styles can be done using the BasedOn property. Styles support single inheritance and the depth of inheritance is not limited.
• Implicit Styling – in Silverlight 4 the default styles of elements on a page / control can be specified in a simple way using implicit styles.
• Style Precedence: a Style’s Setters only get applied if the object’s particular property is not animated, not set locally and not set in the control template belonging to the object.
• Style Setter Precedence: setters specifying the value of the same property may be declared within the same Style. The last one of them has the highest precedence and will be used.

Further Advanced Topics

• Style is a Dependency Property. This means that it supports the following features:
  • Data binding: it’s possible to bind styles on to another – even though this is probably a very rare real world scenario.
  • Property changed notifications: it’s not possible to directly subscribe to property changed notifications for the Style property due to the feature missing in Silverlight, however there is a complicated, but working workaround available to detect when the Style is being changed.
  • ClearValue: unsetting the value of a Style is not the same as setting it to null. When wanting to reset or clear the style, ClearValue is the method to be used.
• Declaring Styles In Code Behind is possible, it results in more complex code though then doing the same thing in XAML.
• Other Notes About Styles
  • Only Dependency Properties Can Be Styled: styling CLR properties will result in either a compile time or runtime error.
  • Not All Classes Have Styles: only Ones Derived From FrameworkElement have the Style property and thus can be styled. All of the built-in visual controls, the Control and UserControl class are descendants of this class. It’s worth remembering this when creating custom classes that might need to be styled.

Manipulating Styles at Runtime

• Modifying Styles at Runtime: the IsSealed Property – Modifying the Setters of a Style can only be done if the IsSealed property is set to false. This property is false when the Style is created and is set to true once the Style is applied to any element in the visual tree.
• Cloning Styles – since styles can’t be modified once the IsSealed property is set to true, the most convenient way to modify an existing style is to clone it, than modify the cloned style.
• Merging Styles Runtime – a more advanced scenario from simply modifying a few setters in a Style is merging two Styles into one.
  • Using the BasedOn Property – an easy way of implementing merging of styles is to use the BasedOn property when creating the merged style.
  • Copying Setters of the Styles – another, slightly more complicated approach is to create a Style by manually copying over the Setters from the ChildStyle and then copy the non conflicting Setters from the ParentStyle.
  • An Example of Both Approaches
• Some Bugs when Manipulating Styles at Runtime – there are some smaller bugs I’ve come across when manipulating Styles runtime in Silverlight. These include StrokeDashArray problems and disappearing style setters in Silverlight 3 and WP7.

I hope this summary on styles in Silverlight was helpful.

3 Responses to “Styles in Silverlight: Everything a Developer Needs To Know”

1. Sam Hogarth says:

   February 1, 2011 at 6:08 pm

   Great post and (great post series) Gergely. Certainly came in useful for me! :)
2. Hrvoje says:

   February 2, 2011 at 10:12 am

   Thanx for this great links. It would be very useful to create one PDF for print? Like some small ebook about styles in SL.
   Then someone else publish series of blog post about dependency property/object tips/trick or similar topic, and by end of the year we would have great ebook, with all the information someone could look for :)
3. Johnny says:

   February 16, 2011 at 10:19 am

   Great summary!