Button with an Image ?! easy

Ok let’s talk a little bit about a trick here.
Today I will tell you a secret ;). How to make a nice button with an image or an icon in it!
It’s pretty easy let’s see:

in this code snippet we have a Button element and inside of it we have a stackpanel and inside of our stackpanel we have two elements an image element that we will use to put our image in and a textblock that we will type our text in!

In your project in visual studio in your assets folder you have a couple on images there I used the image with the name of smalllogo as you see in the source attribute.

Note:
You use source attribute to let VS know in which folder your image is located.
All your image have to be in your project there is a folder called assets folder put your images there.

But in this picture our image is above the text what should we do to make it in the same line?!!
Yeah as you think of it, easily put the stackpanel orientation to horizontal.
Like that!

But I want some space between the image and the text. Ok you will get what you need.
Just use the margin attribute like so:

The 10 is a 10px space on the left and 0 on top, 0 form right, 0 from bottom.
Now we have a nice button! As I said it is easy :D.