Reader Level:

Use of Pen Tool, Text Block, Shapes and Opacity in Expression Blend 4

By Sonia Bhadouria Vishvkarma on Jul 10, 2012
Pen Tool is a Drawing Tool. Shortcut is "P". Generally we can Draw Shapes by using Default Tool's like Rectangle, Ellipse, Line Tool etc but here we can also Draw Shapes by using Pen Tool.

The Pen Tool is a drawing tool.The shortcut is "P". Generally we can draw shapes using the default tools such as Rectangle, Ellipse and Line tools etc but here we can also draw shapes using the Pen Tool. The steps are as follows:

Step 1: Open -> Expression Blend -> New or (Ctrl+Shift+N)

  • Select Silverlight Application + Website.
  • Select Name: Change Name accordingly.
  • Select Location: Change Location accordingly.
  • Hit OK.

Note: A Blank Window appears with a White Background.

Step 2: Here we are going to design a "Birthday Card" using the Pen Tool. Select the Pen Tool from the Tool Box located to the left side of the Workspace in Expression Blend 4 as shown below:


Using Pen Tool draw a line as shown below:


Note: Have a look,we are going to play with "Line" using the points at Artboard as shown below:


Draw a Line as shown below:


Hold the points with the mouse and move the points according to your choice and create any Shape as shown below:

Repeating the same steps as above Draw 4 Lines as shown below:




Note: A final image appears as a Rectangle Box.

Step 3: Select the Rectangle Box using the Selection Tool (V) and drag it to center.

Step 4: Select Object->Path->Convert to Path to give Shape to the rectangle accordingly.


Step 5: Select the Shape using the Selection Tool and use the Fill Color Option from the Property Panel to Fill Color and Stroke as shown below:



Note: In above Figure you can see the Gradient Color (Blue) and Yellow Color as Stroke.

Select Effect -> New -> Drop Shadow Effect from the Property Panel to apply the shadow as shown below:


Note: Here we have to apply ShadowDepth and Color accordingly. Have a look, a Shadow Part appears in the Black Color.


Step 6: Select Text Block (T) from Tool Box located to the Left Side of the Workspace as shown below:


At first type the Name "SONIA" and select the Name by using (Ctrl+A).


Apply Bold (B), Font Size(24pt), Font Color (white or #ffffff or Gradient Type), Font-Family (Vladimir Script) upon Text as shown below:



Note: You can apply Font-Color, Font-Size, Font-Family according to your choice.

Step 7: Again by following the above Step type "HAPPY BIRTHDAY" as shown below:


Step 8: Select Shapes->Star (Regular Polygon) from the Left Side of the Workspace and Draw a Star and follow above step to apply the Fill Color, Stroke and Drop Shadow Effect Properties as shown below:


Copy-Paste the Stars accordingly and using Opacity Property from Property Panel we can manage the Opacity of the Stars accordingly as shown below:



Note: We can draw a star using the Pen Tool; select the Pen Tool from the Toolbox, hold the Points and Draw Lines accordingly as shown below:


Step 9: Now we insert a Cake Image and Select Effect -> Drop Shadow Effect -> Color -> Yellow as shown below:


Note: We can create a "Cake" image or we can search for an image from the Internet and edit it in Photoshop and insert it using Expression Blend.

Final Image



The purpose of this article is to provide knowledge of the Pen Tool, Text Block, Shapes and Opacity.



Custom Software Development
MCN is your source for developing solutions involving websites, mobile apps, cloud-computing, databases, BI, back-end services and processes and client-server applications.

Trending up

Infragistics jQuery Controls