Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use font icon (font-awesome) in XML selector

Is it possible to use font icon in selector instead of drawable ?

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/menu_home_press" android:state_pressed="true"></item>
    <item android:drawable="@drawable/menu_home"></item>
</selector>
like image 673
mohsin raza Avatar asked Feb 08 '16 14:02

mohsin raza


People also ask

How do I use Font Awesome for icons?

You can place Font Awesome icons just about anywhere using the CSS Prefix fa and the icon's name. Font Awesome is designed to be used with inline elements (we like the <i> tag for brevity, but using a <span> is more semantically correct). icon If you change the font-size of the icon's container, the icon gets bigger.

Can I use a Font Awesome icon as a button?

Font Awesome icons work great in buttons. You can even combine them with larger icon styles, pull-right and pull-left , and icon-spin .

Can I use Font Awesome for favicon?

It is not possible that you can use direct awesome font character as favicon without converting into image. You must convert character into image ..


2 Answers

I changed text color in selector instead of drawable. Its working fine.

Create MyTextView class which extends TextView

public class MyTextView extends TextView {

    public MyTextView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context);
    }

    public MyTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public MyTextView(Context context) {
        super(context);
        init(context);
    }

    private void init(Context context) {
        Typeface tf = Typeface.createFromAsset(context.getAssets(),
                "fontawesome-webfont.ttf");
        setTypeface(tf);
    }
}

Create text_color_selector.xml selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#ff0000" android:state_pressed="true" />
    <!-- pressed -->
    <item android:color="#ff0000" android:state_focused="true" />
    <!-- focused -->
    <item android:color="#000000" />
    <!-- default -->
</selector>

And then use it in you layout

 <com.example.mohsin.myapplication.MyTextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="50sp"
        android:clickable="true"
        android:textColor="@drawable/text_color_selector"
        android:text="\uF242">

    </com.example.mohsin.myapplication.MyTextView>
like image 61
mohsin raza Avatar answered Sep 20 '22 02:09

mohsin raza


The easiest way!

Since Android Support Library 26 and Android Studio 3.0 you can use native fonts support in XML.

https://developer.android.com/guide/topics/ui/look-and-feel/fonts-in-xml.html

  1. Create font directory in res directory
  2. Copy font file into font directory
  3. Create new Font resource file near font file

    <?xml version="1.0" encoding="utf-8"?>
    <font-family xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">
        <font
            android:font="@font/font_awesome_font"
            android:fontStyle="normal"
            android:fontWeight="400"
            app:font="@font/font_awesome_font"
            app:fontStyle="normal"
            app:fontWeight="400" />
    </font-family>
    

    Use android:font for API 26 and app:font for support API since 14.

  4. Now you can use fontFamily in TextView:

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="@font/font_awesome"
        android:text="\uF0da" />
    
  5. To insert font-awesome char enter it UTF code with \u

NOTE: Android Studio design preview doesn't display font-awesome char but in application it works correctly.

like image 28
Mikhail Sharin Avatar answered Sep 19 '22 02:09

Mikhail Sharin