Xamarin Forms 图标

Question

我想知道如何在我的Xamarin Forms应用程序中实现图标。我想使用像glyphicons或font awesome这样的东西。然而，我不知道如何将其实现到我的xaml/c#页面中。

理想情况下，我想要像这样的东西：

如果有人可以提供显示搜索栏或三条线等图标的代码，那就太好了。我可以将其格式化为漂亮的外观。我正在努力学习如何实际拉入图标！

- Connor Meeks

---

谷歌搜索出了几个支持此功能的软件包。你有没有先尝试搜索一下呢？ - Jason

是的，我看到的所有内容都需要自定义渲染和我无法掌握的技术。Iconize似乎不适用于Windows手机。您能否提供适用于iOS、Android和UWP的软件包名称？ - Connor Meeks

@ConnorMeeks，你能否看一下我的答案？这是我几年前第一次实现它的方式，非常好用且简单，你不需要成为Xamarin专家。 - Nurhak Kaya

对于 Xamarin Forms 中的自定义字体，您可以使用此博客。 - Miguel Angel Muñoz

您可以在此处使用派生的 Unicode：https://github.com/fzany/Font-Awesome-Cheat-Charp - Olorunfemi Davis

Answer 1

最简单的方法可能是使用https://github.com/jsmarcus/Xamarin.Plugins。

从Visual Studio或Xamarin Studio中，安装以下软件包：

• Xam.Plugin.Iconize
• Xam.Plugin.Iconize.FontAwesome
• Xam.FormsPlugin.Iconize

注意：如果需要，您可以安装Xam.Plugin.Iconize.Material和许多其他类似软件包。

在Android项目的MainActivity类的OnCreate()方法中添加：

FormsPlugin.Iconize.Droid.IconControls.Init(Resource.Id.toolbar);
Plugin.Iconize.Iconize.With(new Plugin.Iconize.Fonts.FontAwesomeModule());

在iOS项目中，AppDelegate类的FinishedLaunching()方法中，添加类似的行：

FormsPlugin.Iconize.iOS.IconControls.Init();
Plugin.Iconize.Iconize.With(new Plugin.Iconize.Fonts.FontAwesomeModule())

此外，在iOS项目中，需要在info.plist文件中添加以下内容。

<key>UIAppFonts</key>
<array>     
    <string>iconize-fontawesome.ttf</string>
</array>    

现在，在您的XAML中，您有一个工具栏，在标签中，请添加：

<ContentPage ...
xmlns:iconize="clr-namespace:FormsPlugin.Iconize;assembly=FormsPlugin.Iconize" ...
>

并且。

<ContentPage.ToolbarItems>
    <iconize:IconToolbarItem Order="Primary" Clicked="..." Icon="fa-search" IconColor="White" />
</ContentPage.ToolbarItems>

- Kevin Le - Khnle

---

这个能在Windows (UWP)上运行吗？对于那些文件，我需要做什么吗？ - Connor Meeks

不确定Windows。 - Kevin Le - Khnle

尝试在UWP中使用此方法，但遗憾的是它不适用于命令栏图标。 - Denny

我正在可视化图标，但当我点击它时没有任何反应。在Iconlabel中它正常工作。而且iOS的toolbaritem也没问题。 - Josue Martinez

@KevinLe-Khnle 如何在 Label 文本中显示此图标？ - Ramesh

Answer 2

看一下Xamarin Forms的新版本，解决方案已经出来了！我在https://dev59.com/wLLma4cB1Zd3GeqPjf1-#56257444中发布了答案。

但是它可以运行，如下所示：

<Button  Text="Pesquisar">
    <Button.ImageSource>
         <FontImageSource Glyph="&#xf002;" FontFamily="{StaticResource FontIcon}"/>
    </Button.ImageSource>
</Button>

还有这个：

<ContentPage.ToolbarItems>
    <ToolbarItem>
        <ToolbarItem.IconImageSource>
             <FontImageSource Glyph="&#xf002;" FontFamily="{StaticResource FontIcon}"/>
        </ToolbarItem.IconImageSource>
    </ToolbarItem>
</ContentPage.ToolbarItems>

- MatthewLC