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

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:

fig1.png





Using Pen Tool draw a line as shown below:

fig2.png

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

fig2.1.png

Draw a Line as shown below:

fig2.2.png

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:

fig3.png

fig4.png

fig5.png

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.

fig6.png

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:

fig7.png

fig8.png

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:

fig9.png

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

fig10.png

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

fig11.png

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

fig12.png

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

fig13.png

fig14.png

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:

fig15.png

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:

fig16.png

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

fig17.png

fig18.png

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:

fig19.png

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

fig20.png

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

fig21.png

Summary

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

Up Next
    Ebook Download
    View all
    Learn
    View all