Tips

Skinning is a way to completely replace the look of your control. In order to do that, you have to define new template and set it to the Control.Template property.

Building your own template allows you to make the control look and feel in the way you like. You might add new elements or remove the existing, you can also edit the visual states and transitions.

In the example the button shape is changed. All animations are removed for simplicity.

   1: <UserControl.Resources>

   2:     <Style x:Key="myButtonTemplate" TargetType="Button">

   3:         <Setter Property="Template">

   4:             <Setter.Value>

   5:                 <ControlTemplate TargetType="Button">

   6:                     <Grid>

   7:                         <Path Margin="2"  x:Name="BackgroundGradient" Stretch="Fill" Stroke="#FF94C2D8" 

   8:                               StrokeThickness="2" Opacity="1"

   9:                               Data="M44,-135 L137,-136 L163.00137,-114.43846 L138.14738,-98.33696 L40.513062,-96.888382 L65.010727,-116.44418 z" >

  10:                               

  11:                             <Path.Fill>

  12:                                 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

  13:                                     <GradientStop Color="#FFA3AEB9" Offset="0"/>

  14:                                     <GradientStop Color="#FF8399A9" Offset="0.375"/>

  15:                                     <GradientStop Color="#FF718597" Offset="0.375"/>

  16:                                     <GradientStop Color="#FF617584" Offset="1"/>

  17:                                 </LinearGradientBrush>

  18:                             </Path.Fill>

  19:                         </Path>

  20:                         <ContentPresenter

  21:                             x:Name="contentPresenter"

  22:                             Content="{TemplateBinding Content}"

  23:                             ContentTemplate="{TemplateBinding ContentTemplate}"

  24:                             VerticalAlignment="{TemplateBinding VerticalContentAlignment}"

  25:                             HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

  26:                             Margin="{TemplateBinding Padding}"/>

  27:                     </Grid>

  28:                 </ControlTemplate>

  29:             </Setter.Value>

  30:         </Setter>

  31:     </Style>

  32: </UserControl.Resources>

That's it!

Styling control is a very easy way to tweak the minor visual characteristic of the control such as foreground and background colors, the font style and size, padding, etc. Usually the styles are stored as resources which allows you to reuse them whenever you want.

The Style has TargetType specifying the type of the object the style can be applied to and a key used to identify the style. The Style contains numerous Setters, which describe the values which you want to set to specific properties.

To apply style to a control simply specify the Style property of the control to point to the static resource with a specific key name.

Silverlight doesn't support mouse wheel event. There is a way to catch them if we ask to the browser for them. This workaround works well if the page with your Silverlight application fits in the browser. If the page is bigger in height a scroll appears. Then the whole content of the page is scrolled and the SL application doesn't receive the wheel event until one end is reached.

Hook up to the event. Different names are used in the different browsers.

C#

using System.Windows.Browser;

...

These are the differences:

• Is it possible to apply a style to all elements in your application?

Unforunately, the Beta 2 does not support implicit styles using the TargetType attribute like WPF. To apply a style to all elements you must explicitly set a value to each Style property.

• Is it possible to extend a style?

In Silverlight styles cannot be based on other styles. In WPF that is possible using the BasedOn attribute

• Is it possible to change the style of a control more than once?

No.

Changing the default style or template of a control from the standard library is the same as with any other control. Except to create your own style it is good to know the parts and the states that compose the standard style. Microsoft has released the full XAML of a number of controls along with description of their visual states and state groups - Control Styles and Templates. Additionally using the reflector you can extract the styles of some slightly different controls, we did that and uploaded the generic.xaml file for you.

Just use the following line.

C#

Application.Current.Host.Content.IsFullScreen = true;   

Entering full-screen mode in Silverlight has some restrictions. To ensure that it is initiated by the user entering full-screen mode is possible only in response to one of these input events: MouseLeftButtonDown. MouseLeftButtonUp, KeyDown, KeyUp.

That's it!

Typically validation occurs when in a two-way binding the business object (source property) is updated with data from the user input (target property). During the update there are two places where validation occurs.

1. First, the binding engine uses a implementation of IValueConverter to convert the data from one type to the other. Usually this converter has some validation. Unfortunately, Silverlight doesn't provide a way for custom validation for binding, like in WPF. There is no ValidationRule class that is used in WPF to provide the custom rule for the validation.

The callback function of a routed event has the second parameter e of type RoutedEventArgs or its inheritor. The Source property of this parameter holds reference to the object that raised the event. In contrast to that the sender parameter holds reference to the object where the event handler was invoked.

C#

void RoutedEventRaised( object sender, RoutedEventArgs e )

{

    object source = e.Source;

}

That's it!

Some of the new features in C# 3.0 allow you to write shorter code that is easier to read and maintain. The following code couples have the same results.

• Short syntax for object initialization initialization.

  C#

   

  ObjectType objectName = new ObjectType();

  objectName.PropertyName = newValue;

  objectName.PropertyName2 = newValue2;

   

  C#

  ObjectType objectName = new ObjectType(){ PropertyName = newValue, PropertyName2 = newValue2 };

• Syntaxt for anonymous types

C#

SomeVeryLongNameOfType objectName = new SomeVeryLongNameOfType();

C#

var objectName = SomeVeryLongNameOfType();

• Short syntax for collection initialization

C#

CollectionType collectionName = new CollectionType();

collectionName.Add( newItem1 );

..

Currently only Silverlight controls that derive from System.Windows.Controls.ContentControl support disabling. Those that support have IsEnabled property. However in the release version of Silverlight 2.0 IsEnabled will be a property of the System.Windows.Control class. Also, if the property is changed on a parent control the new value will be applied to all the children of the control.

C#

myButton.IsEnabled = false;

XAML

<Button IsEnabled="False"/>

If you need to disable your controls before the release you must write your own implementation.