Verwendung von Symbolen und Symbolen aus „Font Awesome“ in der nativen Android-Anwendung

Ich versuche, Font Awesome in meiner Anwendung zu verwenden. Ich konnte die Schriftart mithilfe von integrieren Typeface.createFromAsset(), aber ich möchte auch die von dieser Schriftart bereitgestellten Symbole verwenden, aber bisher war dies nicht möglich.

Diese bestimmte Schriftart enthält Symbole im Unicode Private Use Area (PUA), z. B. für Media Player-Steuerelemente, Dateisystemzugriff, Pfeile usw.

Hat jemand Schriftarten verwendet, die Symbole und Symbole auf Android enthalten? Ist dies überhaupt möglich?

Font Awesome scheint in meiner Android-App gut für mich zu funktionieren. Ich habe folgendes gemacht:

1. Kopierte fontawesome-webfont.ttfin meinen assests Ordner
2. Auf dieser Seite wurden die Zeichenentitäten für die von mir gewünschten Symbole gefunden: http://fortawesome.github.io/Font-Awesome/cheatsheet/

3. Erstellt für jedes Symbol einen Eintrag in der Datei strings.xml. ZB für ein Herz:

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

4. In der Ansicht meines XML-Layouts wurde auf diesen Eintrag verwiesen:

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

5. Laden Sie die Schriftart in meine onCreate-Methode und legen Sie sie für die entsprechenden Ansichten fest:

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

Probieren Sie IcoMoon aus: http://icomoon.io

• Wählen Sie die gewünschten Symbole aus
• Weisen Sie jedem Symbol Zeichen zu
• Laden Sie die Schriftart herunter

Angenommen, Sie haben das Wiedergabesymbol ausgewählt, ihm den Buchstaben "P" zugewiesen und die Datei icomoon.ttfin Ihren Asset-Ordner heruntergeladen . So zeigen Sie das Symbol:

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

Ich habe einen Vortrag über das Erstellen schöner Android-Apps gehalten, der Erklärungen zur Verwendung von Symbolschriftarten sowie das Hinzufügen von Verläufen enthält, um die Symbole noch schöner zu machen: http://www.sqisland.com/talks/beautiful-android

Die Erklärung der Symbolschrift beginnt auf Folie 34: http://www.sqisland.com/talks/beautiful-android/#34

Vielleicht zu spät, aber ich hatte das gleiche Bedürfnis, also habe ich diese https://github.com/liltof/font-awsome-for-android veröffentlicht. Es ist eine android-fähige XML-Version der Schrift, die fantastisch verwendet werden kann, genau wie Keith Corwin sagte

Hoffe, es wird anderen helfen.

Wie oben ist ein gutes Beispiel und funktioniert gut:

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

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

ABER! > Dies funktioniert, wenn Sie eine Zeichenfolge innerhalb der Schaltfläche aus XML festlegen:

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

Wenn Sie es dynamisch hinzufügen müssen, können Sie Folgendes verwenden:

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

Wenn Sie programmatic setText möchten, ohne string.xml einen String hinzuzufügen

Siehe den hexadezimalen Code hier:

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

Ersetzen Sie & # xf066; bis 0xf066

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

Es gibt eine kleine und nützliche Bibliothek, die für diese Zwecke entwickelt wurde :

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

Holen Sie sich eine Demo bei Google Play .

Sie können Ihrem Layout ganz einfach ein auf Schriftarten basierendes Symbol hinzufügen:

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

Sie können das Schriftart-Symbol wie Drawableaus XML aufblasen :

<?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-Code:

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

Links:

• Projektseite
• Github Repo

Ich habe diese Hilfsklasse in C # (Xamarin) erstellt, um die Texteigenschaft programmgesteuert festzulegen. Es funktioniert ziemlich gut für mich:

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
}

Sollte einfach genug sein, um nach Java zu konvertieren, denke ich. Hoffe es hilft jemandem!

Eine der Bibliotheken, die ich für Font Awesome verwende, ist folgende:

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

Speziell,

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

Die Dokumentation ist leicht zu verstehen.

Fügen Sie zunächst die erforderlichen Abhängigkeiten in build.gradle hinzu:

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

Zweitens können Sie dies in Ihr XML einfügen:

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

Stellen Sie jedoch sicher, dass Sie dies in Ihrem Root-Layout hinzufügen, wenn Sie das obige Codebeispiel verwenden möchten:

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

In der FontView-Bibliothek können Sie normale / Unicode-Schriftzeichen als Symbole / Grafiken in Ihrer App verwenden. Es kann die Schriftart über Assets oder einen Netzwerkspeicherort laden.

Der Vorteil dieser Bibliothek ist, dass:

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

Beispiel:

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

Es gibt eine weitere nette Lösung, die Sie direkt in Ihren Layout-XML-Dateien verwenden können und die Sie nicht verwenden müssen setTypeface.

Es ist Joan Zapatas Iconify . Hier können Sie lesen , was in Iconify v2 neu ist . Es enthält 9 verschiedene Schriftartenbibliotheken, die Sie einfach verwenden können, indem Sie Ihrer build.gradle- Datei Abhängigkeiten hinzufügen .

In den Layout-XML-Dateien können Sie zwischen folgenden Widgets wählen:

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

Erstellen Sie zunächst einen Asset-Ordner und kopieren Sie das Fontawesome-Symbol (.ttf). Wie erstelle ich einen Asset-Ordner?

App -> Rechtsklick -> Neu -> Ordner -> Asset-Ordner

nächster Schritt herunterladen Wie lade ich eine .ttf-Datei herunter? Klicken Sie hier -> und klicken Sie nach dem Download auf den Download-Button und öffnen Sie die Web-Schriftarten. Wählen Sie schließlich True Asset Style (ttf) und fügen Sie den Asset-Ordner ein.

Wie entwerfe ich XML- und Java-Dateien in Android?

app -> res -> values ​​string.xml

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

In diesem Beispiel für eine Schriftart mehr Unicode klicken Sie hier

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

Ausgabe:

Ausgabebild

Ich bin etwas spät zur Party, aber ich habe eine benutzerdefinierte Ansicht geschrieben, mit der Sie dies tun können. Standardmäßig ist sie auf entypo eingestellt. Sie können sie jedoch so ändern, dass sie eine beliebige Symbolschrift verwendet: Überprüfen Sie sie hier: github.com/MarsVard/IconView

// Die Bibliothek bearbeiten ist alt und wird nicht mehr unterstützt ... neue hier https://github.com/MarsVard/IonIconView

Falls Sie nur wenige großartige Symbole für Schriftarten benötigen, können Sie auch http://fa2png.io verwenden , um normale Pixelbilder zu generieren. Wenn Sie jedoch regelmäßig neue Symbole / Schaltflächen hinzufügen, würde ich die .ttf-Version als flexibler empfehlen.

Wenn sich jemand fragt, wie man es programmgesteuert hinzufügt, muss man es so machen.

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

Da alle Antworten großartig sind, ich aber keine Bibliothek verwenden wollte und jede Lösung mit nur einem einzeiligen Java-Code meine Activitiesund Fragmentssehr chaotisch machte. Also habe ich die TextViewKlasse wie folgt überschrieben:

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

Was Sie tun sollten, ist die Schriftartdatei ttfin den assetsOrdner zu kopieren. Und verwenden Sie diesen Spickzettel, um die einzelnen Symbolzeichenfolgen zu finden.

hoffe das hilft.