Reader Level:
ARTICLE

Tile Brush in Silverlight 3 Application in Blend 3

Posted by Diptimaya Patra Articles | XAML July 28, 2009
Tile Brush In Silverlight 3 Application In Blend 3, How can we change the background of any control to an Image.
  • 0
  • 0
  • 11100
Download Files:
 

Introduction

Every time you could have imagined for any background image for your application and for some controls. In Silverlight 2 and Silverlight 3 Beta it was not so easy to put Images as Background and do some Tiling. Using Tile Brush in Silverlight 3 we will be able to use images as background. In this article we will see how can we achieve that.

Crating Silverlight Project

Fire up Blend 3 and create a Silverlight Application. Name it as TileBrushInSL3.

image1.gif

  1. First thing we will do Image Brush is for the Grid (LayoutRoot).
     
  2. Select the Grid, go to the Properties Panel Choose the Brush Category and choose Tile Brush.
     
  3. Choose any Image (PNG or JPEG), and it's done.

    image2.gif

    image3.gif

    You can Stretch in of four types here:
     
    • None
    • Fill
    • Uniform
    • Uniform To Fill

    Try out the above Stretch modes and you will get your best one match for your control.

    Now we will add some controls and see how Tile Brush is effected here.
     
  4. Add a TextBlock and do the same we did earlier steps and you will find something similar to the following.

Without Tile Brush

image4.gif

With Tile Brush

image5.gif

Isn't that cool! I have just changed the Font Size of the TextBlock to look good.

Suppose you have a List Box in your application do change the Background Brush to Tile Brush and it will look like below.

image6.gif

Similarly you can change your other Controls and their Brush to Tile Brush and play with it.

Enjoy Coding.

COMMENT USING

Trending up