0

我的 Xamarin.Forms(5.0) 应用程序中有 FontAwesome 设置（我使用的是 Microsoft 的底部选项卡式模板）。

我可以毫无问题地在其中一个页面上的图像中显示图标。我似乎无法在 TabBar 元素中显示其中一个字体图标。

在模板中有两个导航元素；“关于”和“浏览”。引用的这些图标似乎是添加到特定 iOS 和 Android 项目中的 .png 文件。我想引用 webfont 图标。

这是我的 AppShell.xaml 代码。有人能看出这有什么问题吗？您在下面看到的所有代码都是模板生成的，除了local2命名空间声明和“显示”ShellContent项。

FontAwesomeBrands只是一个.otf使用 IconFont2Code 网站从文件生成的类。

    <?xml version="1.0" encoding="UTF-8"?>
    <Shell xmlns="http://xamarin.com/schemas/2014/forms" 
           xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
           xmlns:local="clr-namespace:Business.Mobile.Views"
           xmlns:local2="clr-namespace:Business.Mobile"
           Title="Business.Mobile"
           x:Class="Business.Mobile.AppShell">
    
        <Shell.Resources>
            <ResourceDictionary>
                <Style x:Key="BaseStyle" TargetType="Element">
                    <Setter Property="Shell.BackgroundColor" Value="{StaticResource Primary}" />
                    <Setter Property="Shell.ForegroundColor" Value="White" />
                    <Setter Property="Shell.TitleColor" Value="White" />
                    <Setter Property="Shell.DisabledColor" Value="#B4FFFFFF" />
                    <Setter Property="Shell.UnselectedColor" Value="#95FFFFFF" />
                    <Setter Property="Shell.TabBarBackgroundColor" Value="{StaticResource Primary}" />
                    <Setter Property="Shell.TabBarForegroundColor" Value="White"/>
                    <Setter Property="Shell.TabBarUnselectedColor" Value="#95FFFFFF"/>
                    <Setter Property="Shell.TabBarTitleColor" Value="White"/>
                </Style>
                <Style TargetType="TabBar" BasedOn="{StaticResource BaseStyle}" />
                <Style TargetType="FlyoutItem" BasedOn="{StaticResource BaseStyle}" />
            </ResourceDictionary>
        </Shell.Resources>
    
        <TabBar>
            <ShellContent Title="About" Icon="icon_about.png" Route="AboutPage" ContentTemplate="{DataTemplate local:AboutPage}" />
            <ShellContent Title="Browse" Icon="icon_feed.png" ContentTemplate="{DataTemplate local:ItemsPage}" />
            <ShellContent Title="Shows" Icon="{x:Static local2:FontAwesomeBrands.Audible}"  ContentTemplate="{DataTemplate local:ItemsPage}" />
        </TabBar>
    
        <!--
            If you would like to navigate to this content you can do so by calling
            await Shell.Current.GoToAsync("//LoginPage");
        -->
        <TabBar>
            <ShellContent Route="LoginPage" ContentTemplate="{DataTemplate local:LoginPage}" />
        </TabBar>
    
    </Shell>

这是在我的 AssemblyInfo.cs 文件中。

    using Xamarin.Forms;
    using Xamarin.Forms.Xaml;
    
    [assembly: XamlCompilation(XamlCompilationOptions.Compile)]
    [assembly: ExportFont("fa-brands-400.otf", Alias = "FaBrands")]

一切都在共享项目的根目录中。该fa-brands-400.otf文件的属性设置为EmbeddedResource. 再一次，它正在使用我添加到 AboutPage.xaml 的图像。

4

1 回答 1

3

您需要指定您正在使用FontImageSource才能指定Glyph和FontFamily属性，否则默认情况下它将通过您指定的字符串查找本地图像。

<TabBar>
    <ShellContent Title="About" Icon="icon_about.png" Route="AboutPage" ContentTemplate="{DataTemplate local:AboutPage}" />
    <ShellContent Title="Browse" Icon="icon_feed.png" ContentTemplate="{DataTemplate local:ItemsPage}" />

  <ShellContent Title="Shows">
      <ShellContent.Icon>
           <FontImageSource FontFamily="FaBrands"
                            Glyph="{x:Static local2:FontAwesomeBrands.Audible}"/>
      </ShellContent.Icon>
 </ShellContent.Icon>
</TabBar>
于 2021-03-25T23:26:58.653 回答