首页 文章

如何在Native Android Application上使用“Font Awesome”中的图标和符号

提问于
浏览
143

我正在尝试在我的应用程序上使用Font Awesome,我能够使用 Typeface.createFromAsset() 集成字体,但我也想使用此字体提供的图标,但到目前为止我还没有能够这样做 .

此特定字体包含Unicode专用区(PUA)内的图标,用于媒体播放器控件,文件系统访问,箭头等内容 .

有没有人在Android上使用包含图标和符号的字体,这有可能吗?

14 回答

  • 2

    如果有人想知道如何添加程序,你必须这样做 .

    button_info.setText(R.string.icon_heart);
        button_info.append(" Hallo"); //<<--- This is the tricky part
    
  • 6

    在我的Android应用程序中,Font Awesome似乎对我很好 . 我做了以下事情:

    <string name="icon_heart">&#xf004;</string>
    
    • 在我的xml布局视图中引用了所述条目:
    <Button
         android:id="@+id/like"
         style="?android:attr/buttonStyleSmall"
         ...
         android:text="@string/icon_heart" />
    
    • 在我的onCreate方法中加载了字体并将其设置为适当的视图:
    Typeface font = Typeface.createFromAsset( getAssets(), "fontawesome-webfont.ttf" );
    ...
    Button button = (Button)findViewById( R.id.like );
    button.setTypeface(font);
    
  • 27

    试试IcoMoon:http://icomoon.io

    • 选择所需的图标

    • 为每个图标指定字符

    • 下载字体

    比如说,您选择了播放图标,为其分配了字母'P',并将文件 icomoon.ttf 下载到您的资产文件夹中 . 这是您显示图标的方式:

    XML:

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textSize="48sp"
      android:text="P" />
    

    Java的:

    Typeface typeface = Typeface.createFromAsset(getAssets(), "icomoon.ttf");
    textView.setTypeface(typeface);
    

    我已经就制作漂亮的Android应用程序进行了讨论,其中包括使用图标字体的说明,以及添加渐变以使图标更漂亮:http://www.sqisland.com/talks/beautiful-android

    图标字体说明从幻灯片34开始:http://www.sqisland.com/talks/beautiful-android/#34

  • 4

    也许为时已晚,但我有同样的需求,所以我已经发布了这个https://github.com/liltof/font-awsome-for-android这是一个Android准备好的xml版本的字体真棒可用就像Keith Corwin说的

    希望它会帮助别人 .

  • 2

    以上是很好的例子,效果很好:

    Typeface font = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf" );
    
    Button button = (Button)findViewById( R.id.like );
    button.setTypeface(font);
    

    但! >如果从xml设置的按钮内的字符串,这将有效:

    <string name="icon_heart">&#xf004;</string>
    button.setText(getString(R.string.icon_heart));
    

    如果需要动态添加它可以使用:

    String iconHeart = "&#xf004;";
    String valHexStr = iconHeart.replace("&#x", "").replace(";", "");
    long valLong = Long.parseLong(valHexStr,16);
    button.setText(getString((char)valLong+"");
    
  • 10

    有一个小而有用library designed for this purposes

    dependencies {
        compile 'com.shamanland:fonticon:0.1.9'
    }
    

    Get demo on Google Play.

    enter image description here

    您可以在布局中轻松添加基于字体的图标:

    <com.shamanland.fonticon.FontIconView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/ic_android"
        android:textSize="@dimen/icon_size"
        android:textColor="@color/icon_color"
        />
    

    你可以从xml中将font-icon膨胀为 Drawable

    <?xml version="1.0" encoding="utf-8"?>
    <font-icon
        xmlns:android="http://schemas.android.com/apk/res-auto"
        android:text="@string/ic_android"
        android:textSize="@dimen/big_icon_size"
        android:textColor="@color/green_170"
        />
    

    Java代码:

    Drawable icon = FontIconDrawable.inflate(getResources(), R.xml.ic_android);
    

    链接:

  • 0

    如果你想要编程的setText而不添加字符串到string.xml

    在这里看到它的十六进制代码:

    http://fortawesome.github.io/Font-Awesome/cheatsheet/

    替换&#xf066;到0xf066

    Typeface typeface = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf");
        textView.setTypeface(typeface);
        textView.setText(new String(new char[]{0xf006 }));
    
  • 294

    我在C#(Xamarin)中创建了这个帮助类,以编程方式设置text属性 . 它对我来说非常好用:

    internal static class FontAwesomeManager
    {
        private static readonly Typeface AwesomeFont = Typeface.CreateFromAsset(App.Application.Context.Assets, "FontAwesome.ttf");
    
        private static readonly Dictionary<FontAwesomeIcon, string> IconMap = new Dictionary<FontAwesomeIcon, string>
        {
            {FontAwesomeIcon.Bars, "\uf0c9"},
            {FontAwesomeIcon.Calendar, "\uf073"},
            {FontAwesomeIcon.Child, "\uf1ae"},
            {FontAwesomeIcon.Cog, "\uf013"},
            {FontAwesomeIcon.Eye, "\uf06e"},
            {FontAwesomeIcon.Filter, "\uf0b0"},
            {FontAwesomeIcon.Link, "\uf0c1"},
            {FontAwesomeIcon.ListOrderedList, "\uf0cb"},
            {FontAwesomeIcon.PencilSquareOutline, "\uf044"},
            {FontAwesomeIcon.Picture, "\uf03e"},
            {FontAwesomeIcon.PlayCircleOutline, "\uf01d"},
            {FontAwesomeIcon.SignOut, "\uf08b"},
            {FontAwesomeIcon.Sliders, "\uf1de"}
        };
    
        public static void Awesomify(this TextView view, FontAwesomeIcon icon)
        {
            var iconString = IconMap[icon];
    
            view.Text = iconString;
            view.SetTypeface(AwesomeFont, TypefaceStyle.Normal);
        }
    }
    
    enum FontAwesomeIcon
    {
        Bars,
        Calendar,
        Child,
        Cog,
        Eye,
        Filter,
        Link,
        ListOrderedList,
        PencilSquareOutline,
        Picture,
        PlayCircleOutline,
        SignOut,
        Sliders
    }
    

    我认为应该很容易转换为Java . 希望它可以帮到某人!

  • 0

    我用于Font Awesome的库之一是:

    https://github.com/Bearded-Hen/Android-Bootstrap

    特别,

    https://github.com/Bearded-Hen/Android-Bootstrap/wiki/Font-Awesome-Text

    文档很容易理解 .

    首先,在build.gradle中添加所需的依赖项:

    dependencies {
        compile 'com.beardedhen:androidbootstrap:1.2.3'
    }
    

    其次,您可以在XML中添加:

    <com.beardedhen.androidbootstrap.FontAwesomeText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        fontawesometext:fa_icon="fa-github"
        android:layout_margin="10dp" 
        android:textSize="32sp"
    />
    

    但如果要使用上面的代码示例,请确保在根布局中添加此项:

    xmlns:fontawesometext="http://schemas.android.com/apk/res-auto"
    
  • 0

    FontView库允许您在应用程序中使用普通/ unicode字体字符作为图标/图形 . 它可以通过资产或网络位置加载字体 .

    这个库的好处是:

    1 - it takes care of remote resources for you
    2 - scales the font size in dynamically sized views
    3 - allows the font to easily be styled.
    

    https://github.com/shellum/fontView

    例:

    Layout:

    <com.finalhack.fontview.FontView
            android:id="@+id/someActionIcon"
            android:layout_width="80dp"
            android:layout_height="80dp" />
    

    Java:

    fontView.setupFont("fonts/font.ttf", character, FontView.ImageType.CIRCLE);
    fontView.addForegroundColor(Color.RED);
    fontView.addBackgroundColor(Color.WHITE);
    
  • 3

    还有另一个很好的解决方案,您可以直接在布局xml文件中使用,而不需要使用 setTypeface .

    这是Joan Zapata的Iconify . 你可以阅读here Iconify v2 中的新内容 . 它包含9种不同的字体库,您可以通过向 build.gradle 文件添加依赖项来简单地使用它们 .

    在布局xml文件中,可以在这些小部件之间进行选择:

    com.joanzapata.iconify.widget.IconTextview
    com.joanzapata.iconify.widget.IconButton
    com.joanzapata.iconify.widget.IconToggleButton
    
  • 0

    我参加派对有点晚了,但我写了一个自定义视图,让你这样做,默认设置为entypo,但你可以修改它以使用任何iconfont:在这里查看:github.com/MarsVard/IconView

    //编辑图书馆已经过时了,不再受支持了...这里有一个新的https://github.com/MarsVard/IonIconView

  • 1

    如果您只需要几个字体真棒图标,您还可以使用http://fa2png.io生成普通像素图像 . 但是如果你经常添加新的图标/按钮,我建议.ttf版本更灵活 .

  • 1

    由于所有的答案都很棒,但我不想使用一个库,每个解决方案只有一行java代码使我的 ActivitiesFragments 非常混乱 . 所以我写了 TextView 类如下:

    public class FontAwesomeTextView extends TextView {
    private static final String TAG = "TextViewFontAwesome";
    public FontAwesomeTextView(Context context) {
        super(context);
        init();
    }
    
    public FontAwesomeTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }
    
    public FontAwesomeTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }
    
    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    public FontAwesomeTextView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        init();
    }
    
    private void setCustomFont(Context ctx, AttributeSet attrs) {
        TypedArray a = ctx.obtainStyledAttributes(attrs, R.styleable.TextViewPlus);
        String customFont = a.getString(R.styleable.TextViewPlus_customFont);
        setCustomFont(ctx, customFont);
        a.recycle();
    }
    
    private void init() {
        if (!isInEditMode()) {
            Typeface tf = Typeface.createFromAsset(getContext().getAssets(), "fontawesome-webfont.ttf");
            setTypeface(tf);
        }
    }
    
    public boolean setCustomFont(Context ctx, String asset) {
        Typeface typeface = null;
        try {
            typeface = Typeface.createFromAsset(ctx.getAssets(), asset);
        } catch (Exception e) {
            Log.e(TAG, "Unable to load typeface: "+e.getMessage());
            return false;
        }
    
        setTypeface(typeface);
        return true;
    }
    }
    

    您应该做的是将字体 ttf 文件复制到 assets 文件夹中 . 并使用this cheat sheet查找每个图标字符串 .

    希望这可以帮助 .

相关问题