Come utilizzare icone e simboli da "Font Awesome" su Applicazione Android nativa

Sto cercando di utilizzare Font Awesome sulla mia applicazione, sono stato in grado di integrare il font utilizzando Typeface.createFromAsset(), ma voglio anche usare le icone fornite da questo font, ma finora non sono stato in grado di farlo.

Questo particolare carattere contiene icone all'interno dell'Area uso privato Unicode (PUA), ad esempio controlli del lettore multimediale, accesso al file system, frecce, ecc.

Qualcuno ha usato caratteri che contengono icone e simboli su Android, è possibile?

Font Awesome sembra funzionare bene per me nella mia app Android. Ho fatto quanto segue:

1. Copiato fontawesome-webfont.ttfnella mia cartella dei test
2. Ho trovato le entità personaggio per le icone che volevo, usando questa pagina: http://fortawesome.github.io/Font-Awesome/cheatsheet/

3. Creata una voce in strings.xml per ogni icona. Ad esempio per un cuore:

   <string name="icon_heart">&#xf004;</string>

4. Riferito a detta voce nella vista del mio layout XML:

    <Button
        android:id="@+id/like"
        style="?android:attr/buttonStyleSmall"
        ...
        android:text="@string/icon_heart" />

5. Ho caricato il carattere nel mio metodo onCreate e impostato per le viste appropriate:

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

Prova IcoMoon: http://icomoon.io

• Scegli le icone che desideri
• Assegna caratteri a ciascuna icona
• Scarica il font

Supponiamo che tu abbia scelto l'icona di riproduzione, gli abbia assegnato la lettera 'P' e scaricato il file icomoon.ttf nella cartella delle risorse. Ecco come si mostra l'icona:

xml:

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

Giava:

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

Ho parlato della creazione di bellissime app Android, che include spiegazioni sull'uso dei caratteri icona, oltre ad aggiungere sfumature per rendere le icone ancora più belle: http://www.sqisland.com/talks/beautiful-android

La spiegazione del carattere dell'icona inizia nella diapositiva 34: http://www.sqisland.com/talks/beautiful-android/#34

Forse è troppo tardi, ma ho avuto la stessa necessità, quindi ho pubblicato questo https://github.com/liltof/font-awsome-for-android È una versione xml di Android pronta per l'uso del font eccezionale, proprio come ha detto Keith Corwin

Spero che possa aiutare gli altri.

Come sopra è un ottimo esempio e funziona alla grande:

Typeface font = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf" );

Button button = (Button)findViewById( R.id.like );
button.setTypeface(font);

MA! > questo funzionerà se stringa all'interno del pulsante impostato da XML:

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

Se è necessario aggiungerlo in modo dinamico, è possibile utilizzare questo:

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

Se si desidera setText programmatico senza aggiungere stringa a string.xml

vedi il suo codice esadecimale qui:

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

sostituisci & # xf066; a 0xf066

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

Esiste una libreria piccola e utile progettata per questo scopo :

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

Ottieni la demo su Google Play .

È possibile aggiungere facilmente un'icona basata sul carattere nel layout:

<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"
    />

Puoi gonfiare l'icona-carattere come Drawableda xml:

<?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"
    />

Codice Java:

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

link:

• Pagina del progetto
• Repository Github

Ho creato questa classe di supporto in C # (Xamarin) per impostare programmaticamente la proprietà text. Funziona abbastanza bene per me:

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
}

Dovrebbe essere abbastanza facile da convertire in Java, penso. Spero che aiuti qualcuno!

Una delle librerie che utilizzo per Font Awesome è questa:

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

In particolare,

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

La documentazione è di facile comprensione.

Innanzitutto, aggiungi le dipendenze necessarie in build.gradle:

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

In secondo luogo, puoi aggiungerlo nel tuo 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"
/>

ma assicurati di aggiungere questo nel tuo layout di root se vuoi usare l'esempio di codice sopra:

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

La libreria FontView ti consente di utilizzare caratteri normali / unicode come icone / grafica nella tua app. Può caricare il carattere tramite risorse o un percorso di rete.

Il vantaggio di questa libreria è che:

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

Esempio:

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);

C'è un'altra bella soluzione che puoi usare direttamente nei tuoi file xml di layout e che non richiede di usare setTypeface.

È Iconify di Joan Zapata . Puoi leggere qui le novità di Iconify v2 . Include 9 diverse librerie di caratteri che puoi semplicemente usare aggiungendo dipendenze al tuo file build.gradle .

Nei file di layout xml è possibile scegliere tra questi widget:

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

Inizialmente creare la cartella delle risorse e copiare l'icona fontawesome (.ttf) Come creare la cartella delle risorse?

app -> tasto destro del mouse -> nuovo -> cartella -> cartella delle risorse

passo successivo scaricare come scaricare il file .ttf? fai clic qui -> e fai clic sul pulsante di download dopo il download estrai e apri i caratteri web. infine scegli la cartella delle risorse incolla in stile testo vero (ttf).

come progettare file XML e Java in Android?

app -> res -> valori string.xml

resources
    string name="calander_font" >&#xf073; <string
resources

questo esempio di un carattere in più Unicode fai clic qui

Activity_main.xml

 <TextView
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:id="@+id/calander_view"/>

MainActivity.java

calander_tv = (TextView)findViewById(R.id.calander_view);

Typeface typeface = Typeface.createFromAsset(getAssets(),"/fonts/fa-solid-900.ttf");
calander_tv.setTypeface(typeface);
calander_tv.setText(R.string.calander_font);

Produzione:

Immagine di uscita

Sono un po 'in ritardo alla festa ma ho scritto una vista personalizzata che ti consente di farlo, per impostazione predefinita è impostato su entypo, ma puoi modificarlo per utilizzare qualsiasi iconfont: controlla qui: github.com/MarsVard/IconView

// modifica la libreria è vecchia e non più supportata ... nuova qui https://github.com/MarsVard/IonIconView

Nel caso in cui hai bisogno solo di alcune fantastiche icone dei caratteri, puoi anche usare http://fa2png.io per generare normali immagini pixel. Ma se aggiungi nuove icone / pulsanti regolarmente, consiglierei la versione .ttf come più flessibile.

Se qualcuno si chiede come aggiungerlo programmaticamente, devi farlo in questo modo.

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

Come tutte le risposte sono fantastiche ma non volevo usare una libreria e ogni soluzione con un solo codice java di riga ha reso il mio Activitiese Fragmentsmolto disordinato. Quindi ho scritto la TextViewlezione come segue:

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;
}
}

quello che dovresti fare è copiare il ttffile del font nella assetscartella e usare questo cheat sheet per trovare ogni stringa di icone.

spero che questo ti aiuti.