Adding text with fontawesome in button WPF

Question

I'm trying to generate some text underneath a fontawesome icon inside WPF:

<Button HorizontalAlignment="Left" Height="40" Width="40" FontFamily="Arial Black" Foreground="White" Margin="5,30,0,0" fa:Awesome.Content="Folder">
    <StackPanel>
        <TextBlock>
            My Folders
        </TextBlock>
    </StackPanel>
</Button>

The problem now is that it only shows "My Folders" and the fontawesome icon is gone - I can confirm that the icon works (when I remove the textblock it displays it).

Answer 1

This line

fa:Awesome.Content="Folder"

Works by setting ContentControl.Content to target icon character. So it sets Button.Content to character representing Folder icon in your case. But with the next statement you overwrite Button.Content with new value (setting it to StackPanel), so icon is gone. If you want button with icon and text - create one more textblock inside your StackPanel and use it for icon, then remove fa:Awesome.Content="Folder" from button itself. Or better use FontAwesome control instead of TextBlock, like this:

<Button HorizontalAlignment="Left"
        Height="40"
        Width="300"
        FontFamily="Arial Black"
        Foreground="White"
        Margin="5,30,0,0">
    <StackPanel Orientation="Horizontal">
        <fa:FontAwesome Icon="Folder" Margin="0,0,5,0"/>
        <TextBlock>My Folders</TextBlock>
    </StackPanel>
</Button>

Answer 2

Try this out:

<Button HorizontalAlignment="Left" Height="40" Width="40" FontFamily="Arial Black" Foreground="White" Margin="5,30,0,0">
<StackPanel>
    <fa:ImageAwesome Icon="Folder"/>
    <TextBlock>
        My Folders
    </TextBlock>
</StackPanel>