2

I have a simple question. I want to add an icon to a C# WPF Button control. I do not want to have to write C# code, or edit XAML to do this.

However, when I click on the button in the Designer, there is no option under properties to set an image. How do you do this through the Visual Studio GUI?

2
  • Add the image as a child control of the button.
    – Dai
    Commented Jan 30, 2015 at 22:33
  • this is not that trivial its why not use a ImageButton is that an option..?
    – MethodMan
    Commented Jan 30, 2015 at 22:35

3 Answers 3

6

The easiest/best way to do this is to add an Image control as the Content of the Button.

The property window is somewhat limited in what it can do, and only supports text for that property. This does include bindings, so you could use an Image StaticResource. I couldn't find an easy way to create one from the property designer either though.

So basically, you are stuck with editing XAML. Either with a direct Content property or by creating an element in Resources Its not that bad! Just write:

<Button>
   <Button.Content>
      <Image ImageSource="..."/>
   </Button.Content>
</Button>

Now of course, you could create a custom button that exposed that property via the designer, but thats even more XAML. Its WPF, you are going to have to write XAML, so learning how should be a priority.

2

Visual Studio 2015: create a button. create an image. set the source of the image to the right file of your resources (e.g. a .png file that you included to your project) drag the image over the button. A text shows that asks you to press ALT to replace the text of the button with the image.

I currently don't know how to get both, image and text, for a button.

in XAML, it looks like this:

<Button x:Name="button12" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="75">
   <Image x:Name="image" HorizontalAlignment="Left" Height="24" VerticalAlignment="Top" Width="24" Source="gfx/new.png"/>
</Button>
-1

you could install FontAwesome on your Computer

Goto http://fontawesome.io and download. Open the downloaded ZIP file and inside the font folder there should be .otf file, Install that!

and in the content of the button you could simply type the desired icons code!

For eg: if you want your button to look like this

then install FontAwesome Font and in your button tag type Content="&#xf01e;" FontFamily="FontAwesome"

More codes can be found here http://fontawesome.io/cheatsheet/

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.