Using Resources to share styling in Blend

From Gavin Wignall

This post is part of a string of posts found here: Learn Blend in a Month.

When styling up a control, Expression Blend allows you to apply that style to other controls. This firstly allows file sizes to be kept  down as the style is only written in the XAML once. Secondly this allows you to retain consistency across multiple controls set to the same style, when making changes to one, all controls set to that style will update automatically.

more here

Silverlight 3 Quick Tip Styling Improvements

Silverlight 3 bring long-awaited improvements in styling mechanism: “BasedOn” mechanism, Merged Resource Dictionaries and eliminates “write once” style setting behavior. Let’s see those features.

BasedOn

Styles can be “derived” from one another. Perfect for cascading/inheriting styles.

Let’s define style for a… Button (well, in demos it is always a Button, TextBox, etc. ;))

<Style x:Key="BaseButtonStyle" TargetType="ButtonBase">
     <Setter Property="Width" Value="100"/>
     <Setter Property="Height" Value="25"/>
     <Setter Property="Margin" Value="5"/>
</Style>

To “derive” from existing style we should specify BasedOn property

<Style x:Key="DerivedButtonStyle" TargetType="ButtonBase" 
  BasedOn="{StaticResource BaseButtonStyle}">
      <Setter Property="Background" Value="Red"/>
      <Setter Property="BorderBrush" Value="Blue"/>
      <Setter Property="BorderThickness" Value="3"/>
</Style>

more here

Building a Silverlight Line-Of-Business Application – Styling Part 7.2

In Part 7.1 of this series I looked at the importance of styling your Silverlight applications. In this article I will be taking a look at fashions in user interface design of late, and what basic elements can be identified as working towards beautiful and functional applications. Also I will address some of the “controversy” from my previous article and provide some opinions and responses to the comments I received.

Before we start, I have a disclaimer. I’m a developer, not a graphics designer – so I’m writing these styling articles from a developer’s perspective (and with the same limited graphical design skills many other developers share). I have spent a lot of time as a developer producing user interfaces as a part of the systems I have designed though, so hopefully I can provide some useful information that I have gained over the years to other developers from my own trial and error experiences – though these are not necessarily the opinions of an expert in this area. I have built up my own philosophies on user interface design that I practise (of which this particular article is predominantly composed), so please feel free to question these and provide your own alternative (or additional) views in the comments.

Source Code and Live Demo*

more here

Creating, Binding and Styling a Bubble Chart

The Bubble Chart is part of the Silverlight toolkit and is available for Silverlight 2 and Silverlight 3 at http://silverlight.codeplex.com/. This chart uses the size of the “bubbles” to display more data.  For this article I used the Silverlight 3 version of the toolkit and the newly released Expression Blend 3 and Silverlight 3.

FinishedChart
more here

Styling Charts with the Silverlight Toolkit

Author: Pete Brown, Lead Architect, Applied Information Sciences, Inc. , MVP Client Application Dev (Silverlight / WPF)
Blog: http://www.irritatedVowel.com/Blog

Expression Newsletter, subscribe now to get yours.

Summary

In this article, Pete Brown covers various ways to alter the look and feel for the chart control included in the Silverlight Toolkit. While focusing primarily on the Pie Chart, the techniques are transferable to the other types of charts in the toolkit. This article is recommended for designers who are comfortable working with XAML or developers who are comfortable working with Expression Blend.

Introduction

The Silverlight Toolkit is a set of controls and styles from Microsoft, made available outside the normal Silverlight development cycle. Full sourced code, tests and XAML is available on CodePlex.

While the toolkit includes tons of great controls, one of the most anticipated in the business application development community is the native Silverlight charting. Vector-based presentation technologies like Silverlight and WPF naturally lend themselves to the easy creation of charting. However, building a robust charting control is a non-trivial task. Luckily, the Silverlight Toolkit team has already done all the heavy lifting for you.

more here

Flash vs Silverlight: Theming and Styling

Theming and Styling are the most important element for RIA Technology. Both Flash and Silverlight have provided a wide range of methods in styling the controls and UI.

Today, I will just use a simple example to illustrate how to style the UI in both of the technology. Please also note that the styling will apply to the default UI directly. That means you don’t have to specific class name or style name to the UI.

Flash vs Silverlight: Theming and Styling.

Microsoft Silverlight Control Model

Microsoft Silverlight 2: Control Model

Learn about the different types of controls in Silverlight, the differences between UserControls and custom controls, and how to customize their appearance through styling and skinning. Also learn how Microsoft Expression Blend can be used to customize the look of controls.

  • Karen Corby is a Program Manager on the Silverlight team who focuses on control customization and HTTP networking. She holds a MS in Computer Science from Stanford University. In her spare time, Karen enjoys hiking, reading, travel, and photography. Her blog is http://scorbs.com/work.