Zmiana ikony czcionki w WPF przy użyciu czcionki niesamowitej

Question

Korzystam z ikon Font Awesome, aby renderować podstawowe obrazy czcionek w mojej aplikacji C# WPF. Podczas wykonywania, gdy próbuję zmienić TextBlock, aby wyświetlić inną ikonę czcionki, ale zamiast ikony czcionki wyświetlana jest reprezentacja Unicode.

Utworzono przykładową aplikację do wyświetlenia tego. Po kliknięciu jednego z przycisków, zastępuje on właściwość TextBlock Text z symbolem Unicode dla odpowiedniej ikony. W projekcie znajduje się folder Zasoby, który ma plik czcionki FontAwesome.ttf jako zasób kompilacji, do którego odwołuje się właściwość FontFamily obiektu TextBlock.

Oto kod źródłowy mojej przykładowej aplikacji za:

Code-Behind:

namespace FontAwesomeTest 
{ 
public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 
    } 

    private void btnGlass_Click(object sender, RoutedEventArgs e) 
    { 
     tblkFontIcon.Text = "";    
    } 

    private void btnMusic_Click(object sender, RoutedEventArgs e) 
    { 
     tblkFontIcon.Text = ""; 
    } 

    private void btnSearch_Click(object sender, RoutedEventArgs e) 
    { 
     tblkFontIcon.Text = ""; 
    }   
} 
} 

XAML:

<Window x:Class="FontAwesomeTest.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Font Awesome Test Window" Height="300" Width="330" Name="FontAwesomeTestWindow"> 
<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="50"/> 
     <RowDefinition Height="25"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Button Name="btnGlass" Height="35" Width="85" Click="btnGlass_Click" >Glass</Button> 
    <Button Name="btnMusic" Grid.Column="1" Height="35" Width="85" Click="btnMusic_Click">Music</Button> 
    <Button Name="btnSearch" Grid.Column="2" Width="85" Height="35" Click="btnSearch_Click">Search</Button> 
    <TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf000;</TextBlock> 
    <TextBlock Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf001;</TextBlock> 
    <TextBlock Grid.Row="1" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf002;</TextBlock> 
    <TextBlock Name="tblkFontIcon" Grid.Row="2" Grid.ColumnSpan="3" FontSize="64" FontFamily="../Resources/#FontAwesome" HorizontalAlignment="Center" VerticalAlignment="Center">&#xf011;</TextBlock> 
</Grid> 

Użyłem poniższy poradnik do włączenia Czcionka Niesamowite do mojego aplikacja http://www.codeproject.com/Tips/634540/Using-Font-Icons

Więc, w zasadzie, w jaki sposób mogę zmienić ikonę, ale mam wyświetlacz Icon - nie Unicode?

Z góry dziękuję.

Answer 1

UPDATE

znalazłem inny wpis w tym temacie - Add Icon font in wpf myślę, że to powinno być bardziej prawdopodobne, aby to, co chcesz.

Upewnij się, że czcionka została dodana jako zasób. Następnie kliknąć na poniższy ciąg:

<Setter Property="TextElement.FontFamily" Value="pack://application:,,,/fonts/#FontAwesome" /> 

W ciągu powyżej, jestem przy założeniu, że czcionka jest nazwa (nie w fontu filename) jest FontAwesome.

Wystarczy:

1. Dodaj czcionki do projektu, powiedzmy, że można umieścić je w folderze „czcionki”
2. zmienić działanie Build, aby zasóbnieOsadzony zasób
3. Dodaj swój styl, aby ustawić rodzinę czcionek, tak jak powyżej wycinek kodu, i ustaw TextBlock.Text na ikonę, którą lubisz i zastosuj styl do TextBlock.

Aby zmienić ikonę, aktualizując właściwość TextBlock.Text, należy ustawić właściwość Text z obsługiwanym łańcuchem unicode.

spróbować czegoś jak

tblkFontIcon.Text = "\uf000"; 

zamiast

tblkFontIcon.Text = ""; 

Jeśli your're przy użyciu kodu z Using Font Icons

to prawdopodobnie brakowało sekcję "Jak to działa" w tym poście . Należy użyć tego rozszerzenia znaczników, zamiast używać właściwości TextBlock.Text.

W jego przykładowy kod:

<RibbonButton Label="Import data" 
    LargeImageSource="{WpfTools:ImageFromFont Text=&#xf01a;, 
    FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown}" /> 

zwrócić uwagę na WpfTools:ImageFromFont, to Markup Extention, pozwala XAML parser do konwersji

{WpfTools:ImageFromFont Text=, 
     FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown} 

do ImageSource i przypisany do właściwości LargeImageSource .

Więc w XAML, można wymienić TextBlock z Image, to powinno być coś takiego:

<Image Source="{WpfTools:ImageFromFont Text=&#xf000;, 
     FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown}" /> 

Jeśli chcesz zmienić ikonę, trzeba będzie zmienić ImageSource siebie, po prostu śledź numer Using Font Icons, aby utworzyć własną metodę lub po prostu skopiuj poniższy kod z tego samouczka.

private static ImageSource CreateGlyph(string text, 
     FontFamily fontFamily, FontStyle fontStyle, FontWeight fontWeight, 
     FontStretch fontStretch, Brush foreBrush) 
{ 
    if (fontFamily != null && !String.IsNullOrEmpty(text)) 
    { 
     Typeface typeface = new Typeface(fontFamily, fontStyle, fontWeight, fontStretch); 
     GlyphTypeface glyphTypeface; 
     if (!typeface.TryGetGlyphTypeface(out glyphTypeface)) 
       throw new InvalidOperationException("No glyphtypeface found"); 

     ushort[] glyphIndexes = new ushort[text.Length]; 
     double[] advanceWidths = new double[text.Length]; 
     for (int n = 0; n < text.Length; n++) 
     { 
      ushort glyphIndex = glyphTypeface.CharacterToGlyphMap[text[n]]; 
      glyphIndexes[n] = glyphIndex; 
      double width = glyphTypeface.AdvanceWidths[glyphIndex] * 1.0; 
      advanceWidths[n] = width; 
     } 

     GlyphRun gr = new GlyphRun(glyphTypeface, 0, false, 1.0, glyphIndexes, 
            new Point(0, 0), advanceWidths, 
            null, null, null, null, null, null); 
     GlyphRunDrawing glyphRunDrawing = new GlyphRunDrawing(foreBrush, gr); 
     return new DrawingImage(glyphRunDrawing); 

    } 
    return null; 
} 

Answer 2

wiem, że to jest stare pytanie, ale czcionki Niesamowite posiada pakiet Nuget nazwie FontAwesome.UWP i FontAwesome.WPF. Wystarczy pobrać jedną z tych.

Jeśli będziesz używać nazw follow ikona import do kodu XAML:

xmlns:fa="http://schemas.fontawesome.io/icons/" 

używać go do swojego przycisku tak:

<Button x:Name="btnButton"> 
    <Button.Content> 
     <fa:ImageAwesome Icon="LongArrowLeft"/> 
    </Button.Content> 
</Button> 

i wreszcie w swoim C# kod za:

using FontAwesome.WPF; // on the top of the code 
btnButton.Content = FontAwesomeIcon.LongArrowRight;