windows phone silverlight font-awesome 和 appbar 图标

Question

我正在制作一个 windows phone 8 silverlight 应用程序。我在我的应用程序的主页上使用 font-awesome 图标。它们确实在设计器中正确显示，但是当我运行模拟器上的应用程序时，它们无法正确显示。

此外，我使用正常的 76 X 76 px PNG 文件图像作为应用栏图标，它们甚至无法在设计器中正确显示，它们不适合应用栏图标，而不是他们试图逃避圆圈。我正在从下面的模拟器攻击image/screenshot，你可以看到并告诉我解决方案。 提前致谢

来自模拟器的图像

图片来自 visual studio

的设计师

XAML ApplicationBar 代码

<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar>
        <shell:ApplicationBarIconButton IconUri="/Assets/AppBar/scan.png"
                                        IsEnabled="True"
                                        Text="Scan"/>
        <shell:ApplicationBarIconButton IconUri="/Assets/AppBar/search.png"
                                        IsEnabled="True"
                                        Text="Search"/>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

MainPage 图标文本块的应用程序资源

<phone:PhoneApplicationPage.Resources>
    <ResourceDictionary >
        <Style TargetType="TextBlock"
               x:Key="MainPageIcon">
            <Setter Property="FontSize"
                    Value="80" />
            <Setter Property="Width"
                    Value="90" />
            <Setter Property="FontFamily"
                    Value="/Resources/FontAwesome.otf#FontAwesome" />
            <Setter Property="TextAlignment"
                    Value="Center" />
        </Style>
    </ResourceDictionary>
</phone:PhoneApplicationPage.Resources>

XAML 用于主页上的其中一个图标

<TextBlock Text="&#xf02a;"  Style="{StaticResource MainPageIcon}"/>

Answer 1

其实，图片大小并不重要。重要的是 - 它是实际图标周围的透明边框。在实际图像周围添加透明的宽边框，一切就绪。

图片不正确：https://i.stack.imgur.com/pNuJg.png

正确的图片：https://i.stack.imgur.com/qPdRc.png

VS XAML设计师截图：https://i.stack.imgur.com/9Jgpg.png

模拟器截图：https://i.stack.imgur.com/ZuCUE.png

windows phone silverlight font-awesome 和 appbar 图标

windows phone silverlight font-awesome and appbar icon

silverlight

xaml

appbar

windows-phone-8

font-awesome