title: Changing Font Icon in WPF using Font Awesome
body: <p>I am making use of Font Awesome's icons to render basic font images within my C# WPF application. During run-time when I attempt to alter the TextBlock to display a different font icon but the unicode representation is displayed instead of the font icon.</p>
  
  <p>I have created a sample application to display this. When either of the buttons are clicked, it replaces the TextBlock's Text property with the unicode for the respective icon. There is a Resources folder in the project which has the <a href="http://fortawesome.github.io/Font-Awesome/" rel="noreferrer">FontAwesome.ttf</a> font file as a Build Resource which the The TextBlock's FontFamily property references. </p>
  
  <p>Here's my sample application's source code:</p>
  
  <p>Code-Behind:</p>
  
  <pre><code>namespace FontAwesomeTest
  {
  public partial class MainWindow : Window
  {
      public MainWindow()
      {
          InitializeComponent();
      }
  
      private void btnGlass_Click(object sender, RoutedEventArgs e)
      {
          tblkFontIcon.Text = "&amp;#xf000;";            
      }
  
      private void btnMusic_Click(object sender, RoutedEventArgs e)
      {
          tblkFontIcon.Text = "&amp;#xf001;";
      }
  
      private void btnSearch_Click(object sender, RoutedEventArgs e)
      {
          tblkFontIcon.Text = "&amp;#xf002;";
      }        
  }
  }
  </code></pre>
  
  <p>XAML:</p>
  
  <pre><code>&lt;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"&gt;
  &lt;Grid&gt;
      &lt;Grid.ColumnDefinitions&gt;
          &lt;ColumnDefinition Width="*"/&gt;
          &lt;ColumnDefinition Width="*"/&gt;
          &lt;ColumnDefinition Width="*"/&gt;
      &lt;/Grid.ColumnDefinitions&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height="50"/&gt;
          &lt;RowDefinition Height="25"/&gt;
          &lt;RowDefinition Height="*"/&gt;
      &lt;/Grid.RowDefinitions&gt;
      &lt;Button Name="btnGlass" Height="35" Width="85" Click="btnGlass_Click" &gt;Glass&lt;/Button&gt;
      &lt;Button Name="btnMusic" Grid.Column="1" Height="35" Width="85" Click="btnMusic_Click"&gt;Music&lt;/Button&gt;
      &lt;Button Name="btnSearch" Grid.Column="2" Width="85" Height="35"  Click="btnSearch_Click"&gt;Search&lt;/Button&gt;
      &lt;TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome"&gt;&amp;#xf000;&lt;/TextBlock&gt;
      &lt;TextBlock Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome"&gt;&amp;#xf001;&lt;/TextBlock&gt;
      &lt;TextBlock Grid.Row="1" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome"&gt;&amp;#xf002;&lt;/TextBlock&gt;
      &lt;TextBlock Name="tblkFontIcon" Grid.Row="2" Grid.ColumnSpan="3" FontSize="64" FontFamily="../Resources/#FontAwesome" HorizontalAlignment="Center" VerticalAlignment="Center"&gt;&amp;#xf011;&lt;/TextBlock&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p></p>
  
  <p>I used the following tutorial to incorporate Font Awesome into my application <a href="http://www.codeproject.com/Tips/634540/Using-Font-Icons" rel="noreferrer">http://www.codeproject.com/Tips/634540/Using-Font-Icons</a></p>
  
  <p>So in essence, how can I change the Icon but have an Icon display - not Unicode?</p>
  
  <p>Thanks in advance.</p>