What we will learn: In this lesson we are going to create a picture button. Purpose of using picture buttons in any application is to increase the usability and to beautify the application.

Assumptions: Before proceeding further i’ll assume that you have created a blank windows phone (SilverLight) application in visual studio/Blend.

Now follow these steps with me:

  1. Add a hyperlink button in your project which is available in the toolbox of the visual studio or if you are using Expression Blend it is available in the Assets window as shown in figure below:
    You can add this control with the following code also:

  2. Now write click the button and go to edit template -> edit copy as shown below:
  3. Now a dialog will appear asking for name(key) and define in (scope) of the template, choose the name of your own and define it in application level.
  4. Now select the inner border of your button control and insert an image control inside it or just drag/drop the image in this template of the button as shown below:
  5. That’s all now just give a url/link to your button inside navigate.uri property as shown in the snippet below:


Hope you got the idea of how to create an image control. If you found any problem in this article, feel free to ask me.