October 6th, 2009

Drawing tools in Blend

Silverlight Blend Tutorials, Working with Silverlight, by Gavin Wignall.

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

Although Expression Blend is not as powerful as Expression Design, Adobe Photoshop or Adobe Illustrator, it does have a range of basic drawing tools…

Drawing tools

There are two basic options for drawing, Pen or Pencil.

Pen

The ‘Pen‘ tool is a point and click path creating tool. To create a curved point, click and drag the mouse until the desired angle is right.

The ‘Pen‘ tool can also be used to add and remove points to an existing path.

To add a curve to an existing path, hold down the ‘Alt‘ key and then click and drag a part of the path. To change a curved path back to a straight path, hold down the ‘Alt‘ key and click on the Point that has the curved path.

To move a path between two points, hold down the ‘Ctrl‘ key and drag any line between two points in the path.

Pencil

The ‘Pencil‘ tool is a click and drag drawing tool, after the user lets go of the mouse the line gets automatically converted into a path.

Shape tools

There are three types of drawing tools, ‘Rectangle’, ‘Elipse’ and ‘Line’.

Rectangle

The ‘Rectangle‘ tool draws rectangles and squares as you would expect.

To keep the height and width equal (to create a square), hold down the ‘Shift‘ key while drawing.

To keep the rectangle centred upon the mouse, hold down the ‘Alt‘ key while drawing.

To add curved edges to your rectangle, go to the ‘Properties‘ tab and uncollapse the ‘Appearance‘ options. Change the values of ‘RadiusX‘ and ‘RadiusY‘ to add rounded corners to your rectangle. Alternatively, if you select a rectangle, you can use the handles highlighted on the top left to drag and create curved corners (holding the shift key unlocks the X and Y).

Ellipse

The ‘Ellipse‘ tool draws ellipses and circles as you would expect.

To keep the height and width equal (to create a circle), hold down the ‘Shift‘ key while drawing.

To keep the ellipse centred upon the mouse, hold down the ‘Alt‘ key while drawing.

Line

The ‘Line‘ tool draws straight lines as you would expect.

To keep the line you are drawing locked to fixed angles, hold down the ‘Shift‘ key while drawing.

To keep the line centred upon the mouse, hold down the ‘Alt‘ key while drawing.

Color tools

To change colour settings and access the color palette, first select the item you want to change, then go to the ‘Properties’ tab and open up the ‘Brushes’ and ‘Appearance’ areas.

Here you can change the Fill, Stroke and Opacity settings. The screen shot above shows an Opacity Mask set using a gradient going from 0% to 100%.

Back Top

Responses to “Drawing tools in Blend”

  1. Thanks for the info. is it possible to make this expression drawing tool usable to end user(customer of web site to draw some polyline)?

    Regards
    Jacob

  1. Tweets that mention Drawing tools in Blend » Silverlight Buzz -- Topsy.com (,October 7, 2009)

    [...] This post was mentioned on Twitter by Juan Pablo Schmiede . Juan Pablo Schmiede said: RT @SilverlightNews: Drawing tools in Blend – http://snurl.com/sdygr [...]

  2. Learn Expression Blend in a Month! » Silverlight Buzz (,October 9, 2009)

    [...] Drawing tools in Blend [...]

  3. curved corners (,March 6, 2010)

    [...] hovers, … http://www.elliotswan.com title=A really sweet site>Check out my curved corners …Drawing tools in Blend Silverlight BuzzChange the values of RadiusX and RadiusY to add rounded corners to your rectangle. … the top left [...]

Leave a Reply

Back Top