UWP XAML:具有FontIcon和HamburgerMenuItem的自定义字体未呈现字形

时间:2018-08-09 22:17:35

标签: c# uwp-xaml windows-community-toolkit

我正在应用程序中使用UWP Community Toolkit中的HamburgerMenu控件,因为我想支持Windows 10 Mobile,所以新的NavigationView控件对我来说不是一个选择。

我正在尝试使用自定义字体(FontAwesome)绘制菜单的字形。当我使用NavigationView时,此方法有效,但是现在我尝试使用HamburgerMenu,如果我在后面的代码中创建菜单项,则无法正确显示该字形。

相反,字形参考显示为纯文本。我尝试继承HamburgerMenuGlyphItem并分配Glyph属性,但这也不起作用。

这是我的页面:

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    
    xmlns:ct="using:Microsoft.Toolkit.Uwp.UI.Controls"
    mc:Ignorable="d"
    x:Class="Tweeter.MainPage"
    x:Name="PageMain">

    <Page.Resources>
        <DataTemplate x:Key="HamburgerMenuItem">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="48" />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <FontIcon Grid.Column="0"
                    FontFamily="{StaticResource FontAwesome}" 
                    Glyph="{Binding Icon}" />
                <TextBlock Grid.Column="1" Text="{Binding Label}" />
            </Grid>
        </DataTemplate>
    </Page.Resources>

    <Grid>
        <ct:HamburgerMenu x:Name="navMain"
                        ItemTemplate="{StaticResource HamburgerMenuItem}"
                        ItemInvoked="navMain_ItemInvoked"
                        HamburgerVisibility="Visible"
                        UseNavigationViewWhenPossible="True">

            <Frame x:Name="ContentFrame" Margin="0">
                <Frame.ContentTransitions>
                    <TransitionCollection>
                        <NavigationThemeTransition/>
                    </TransitionCollection>
                </Frame.ContentTransitions>
            </Frame>
        </ct:HamburgerMenu>
    </Grid>
</Page>

这是我代码后面的相关内容:

private void LoadMenu()
{
    List <MenuItem> theMenu = new List<MenuItem>();
    MenuItem m = new MenuItem { Icon = "&#xf099;", Tag = "Feed", Label = "Twitter Feed", PageType=typeof(FeedPage) };

    theMenu.Add(m);
    navMain.ItemsSource = theMenu;
}

public class MenuItem : HamburgerMenuItem
{
    public Type PageType { get; set; }
    public string Icon { get; set; }
}

2 个答案:

答案 0 :(得分:2)

代码隐藏和XAML的Unicode字符语法略有不同。要使其正常工作,请尝试以下操作:

# nmcli dev show | grep DNS

答案 1 :(得分:0)

代替 FontIcon ,只需使用 TextBlocK 字体即可,uwp中的超赞图标最适合文本块。希望这会有所帮助。

或者更好,您可以直接使用它们

Manage Certificates...

更多详细信息: https://blog.codeinside.eu/2016/03/05/using-fontawesome-in-uwp-apps/