CODEWITHSUNDEEP
c#wpf
cosmo
cosmo

Reputation: 761

Adding text with fontawesome in button WPF

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).

Upvotes: 6

Views: 6730

Answers (2)

praty
praty

Reputation: 573

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>

Upvotes: 1

Evk
Evk

Reputation: 101613

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>

Upvotes: 10

Related Questions