学习WPF——使用Font-Awesome图标字体（一）

 

一、运行效果图

 

二、图标字体文件下载

http://fontawesome.dashgame.com/（这个网址可以下载图标字体文件）

http://www.fontawesome.com.cn/（这个网址可以下载图标字体文件和查图标编码）

 

（2）解压文件，复制文件备用。

（3）查图标编号

 

二、开始wpf项目

（1）新建windows desktop下的wpf application项目.

 

（2）新建resources文件夹,复制fontawesome-webfont.ttf文件进去.

 

（3）编辑mainwindow.xaml文件

<window x:class="learnwpf.mainwindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        title="mainwindow" height="350" width="525" background="#1874cd">

    <stackpanel orientation="horizontal" verticalalignment="center" horizontalalignment="center">
        <textblock text="" fontsize="80" margin="3" fontfamily="/learnwpf;component/resources/#fontawesome" foreground="#cf1fff"></textblock>
        <textblock text="" fontsize="80" margin="3" fontfamily="/learnwpf;component/resources/#fontawesome" foreground="#1fffff"></textblock>
        <textblock text="" fontsize="80" margin="3" fontfamily="/learnwpf;component/resources/#fontawesome" foreground="#ffffff"></textblock>
        <textblock text="" fontsize="80" margin="3" fontfamily="/learnwpf;component/resources/#fontawesome" foreground="#fb0ae8"></textblock>
    </stackpanel>
</window>

　　（4）运行结果

（5）改进

 1 <window x:class="learnwpf.mainwindow"
 2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4         title="mainwindow" height="350" width="525" background="#1874cd">
 5     <window.resources>
 6         <style x:key="fontawesome" targettype="textblock">
 7             <setter property="fontsize" value="80"/>
 8             <setter property="margin" value="3"/>
 9             <setter property="fontfamily" value="/learnwpf;component/resources/#fontawesome"></setter>
10         </style>
11     </window.resources>
12     <stackpanel orientation="horizontal" verticalalignment="center" horizontalalignment="center">
13         <textblock text="&#xf24e;" style="{staticresource fontawesome}" foreground="#cf1fff"></textblock>
14         <textblock text="&#xf21c;" style="{staticresource fontawesome}" foreground="#1fffff"></textblock>
15         <textblock text="&#xf0c4;" style="{staticresource fontawesome}" foreground="#ffffff"></textblock>
16         <textblock text="&#xf099;" style="{staticresource fontawesome}" foreground="#fb0ae8"></textblock>
17     </stackpanel>
18 </window>