如何在项目中使用Font Awesome图标作为ImageButton的图标 [英] How to use Font Awesome icons in project as an icon of ImageButton

查看:147
本文介绍了如何在项目中使用Font Awesome图标作为ImageButton的图标的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在实现如何在Xamarin应用程序中使用Font Awesome图标时遇到问题,我想将它与 ImageButton 作为图标一起使用.而且我发现的大多数教程都没有帮助我理解它的工作原理.

解决方案

Embedded Resource .

  • 在您的 AssemblyInfo.cs App.xaml.cs
  • 使用友好的别名导出它:

    [程序集:ExportFont("file-name.ttf",Alias ="FontAwesome")]

    1. 食用:

     < Label FontFamily ="FontAwesome";文本=&#xf004;"/> 

    有关图标代码的列表,请查看 FontAwesome代码.

    >

    如果您想将其与按钮之类的点击功能一起使用,则可以将标签与


    更新

    最好使用带有 FontImageSource 属性而不是标签的 ImageButton ,您具有按钮的单击功能,而且我发现有趣的是,您可以更改颜色字形图标,根据选定主题进行硬编码或动态编码>,这是一个示例:

     < ImageButton>< ImageButton.Source>< FontImageSource FontFamily =" FontAwesome"字形="{x:静态字体:IconFont.AddressBook}"颜色=" {AppThemeBinding Dark =白色,浅=黑}"//;</ImageButton.Source></ImageButton> 

    您还可以定义一个具有 const string 属性的静态类,每个类都具有与图标字形相对应的代码作为值,并以这种方式的描述作为名称,您只需要提供描述,而不是像我对 Glyph =" {x:Static fonts:IconFont.AddressBook}} 所做的那样,它将看起来像这样:

     静态类IconFont{public const string Ad ="\ uf641";公共常量字符串AddressBook ="\ uf2b9";...} 

    我邀请您关注此视频教程并查看此GitHub页面,它将从您提交的字体字形文件开始为您生成静态c#类.

    I am having a problem to realize how to use Font Awesome icons in my Xamarin application, I want to use it with ImageButtonas icon. And most tutorials I found didn't help me understand how it works.

    解决方案

    As explained in Microsoft Documentation:

    1. You need to first to have the font file I believe .ttf (or .otf).
    2. Add it to your shared project.
    3. Right click on the file and click on "properties", then set it build action to Embedded Resource.
    4. Export it with a friendly alias name in your AssemblyInfo.cs or App.xaml.cs:

    [assembly: ExportFont("file-name.ttf", Alias = "FontAwesome")]

    1. Consume it:

    <Label FontFamily="FontAwesome" Text="&#xf004;"/>
    

    For the list of icons code take a look at FontAwesome codes.


    If you want to use it with click capabilities like a button, then you can use a label with GestureRecognizers:

    <Label FontFamily="FontAwesome" Text="&#xf004;">
         <Label.GestureRecognizers>
             <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
         </Label.GestureRecognizers>
    </Label>
    


    UPDATE

    Even better use an ImageButton with a FontImageSource property instead of a label, you have click capabilities of a button also I found interesting that you can change the color of your glyph icon, weather hard-coded or dynamically depending on the selected theme, here is an example:

    <ImageButton>
        <ImageButton.Source>
            <FontImageSource FontFamily="FontAwesome"
                             Glyph="{x:Static fonts:IconFont.AddressBook}"
                             Color="{AppThemeBinding Dark=White,
                                                     Light=Black}"/>
        </ImageButton.Source>
    </ImageButton>
    

    You can also define a static class having const string properties, each one having as value the code corresponding to an icon glyph and as name a description of it that way you will need to provide only the description instead of the code like I did with Glyph="{x:Static fonts:IconFont.AddressBook}", it will looks something like this:

     static class IconFont
        {
            public const string Ad = "\uf641";
            public const string AddressBook = "\uf2b9";
    ...
    }
    

    I invite you to follow this video tutorial and check out this GitHub Page which generate the static c# class for you starting from a font glyph file that you submit.

    这篇关于如何在项目中使用Font Awesome图标作为ImageButton的图标的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

    查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆