The final release of Silverlight 2 will have a much more
polished set of default control template skins than those that were in Beta1
and Beta2. Our goal with the default control templates is to have a look
that is professional and attractive, can be used in the majority of
applications as-is (without requiring you to author custom style templates),
and which is also easily tweakable using Expression Blend.
Today's RC build has skins that are close to the final look
we plan to ship (there are a few final tweaks we are doing post RC on the focus
color of controls, as well as to tighten up and tweak a few issues in some of
the control templates). Below is the default look for the DataGrid,
RadioButton, CheckBoxes, and the DatePicker controls with today's RC build:
Figure 9
Note that the DatePicker control above allows users to type
in a date (with a masked edit to ensure it is a valid date), or they can click
the calendar icon to the right of the textbox and select the date using a popup
Calendar control:
Figure 10
One of the most powerful features of
Silverlight and WPF, of course, is the ability for designers and developers to
completely customize the look and feel of any control. This goes beyond
simple styling of colors and fonts - you can literally completely change the
visual UI of a control, as well as customize its behavior (for example: add
animation) without writing any code.
Within Expression Blend, simply right-click on
any Silverlight control and choose the "Edit Control Parts" sub-menu
to open and edit its control template:
Figure 11
When in control template editing mode, you can
manipulate any sub-element of a control (for example: a checkbox's inner
content), as well as customize each "state" its in (notice the states
pane circled in red below). This allows designers to customize what the
control looks like in individual states (for example: checked, unchecked,
mouseover, etc). Silverlight will then automatically handle animating the
control from state to state depending on the user action:
Figure 12
You can learn more about how Silverlight's Visual State
Model works from my previous blog post here.
Previous releases of Silverlight often rendered graphics on
sub-pixel locations - which could cause lines and shapes to sometimes appear
"fuzzy". The RC of Silverlight has a new features called
"layout rounding" that causes the layout system to round the final
measure of a control to an integer ("pixel snapping"), which results
in crisper lines and fewer rendering artifacts. This feature is now on by
default, and helps make applications look nicer.