So verwenden Sie FontAwesome in einer Android-App

In diesem Tutorial zeige ich Ihnen, wie Sie das verwenden FontAwesome Icon Pack in einem Android-Projekt. FontAwesome spart aus mehreren Gründen viel Zeit.

Zunächst müssen Sie sich keine Gedanken über die unterschiedlichen Bildschirmdichten auf verschiedenen Smartphones machen. Wenn Sie verwenden möchten PNG Dateien müssen Sie mindestens vier verschiedene Versionen jedes Symbols in Ihr Paket aufnehmen. Darüber hinaus können Ihre Symbole auf einigen ultradichten HD-Displays körnig erscheinen. Dies ist etwas, das Sie definitiv vermeiden möchten. Bei FontAwesome müssen Sie jedoch nur einen hinzufügen TTF Datei.

Zweitens können Sie sich auf eines der umfangreichsten und umfassendsten kostenlosen Symbolsätze verlassen. Inzwischen sind Benutzer an den Stil von FontAwesome gewöhnt, wie er im Web weit verbreitet ist. Sie müssen keine Zeit damit verschwenden, nach einem schönen, umfassenden und kostenlosen Icon-Set für den kommerziellen Gebrauch zu suchen. Ich sage nicht, dass diese Sets nicht existieren, weil sie tun sie, aber sie sind ziemlich selten.

1. Wie FontAwesome funktioniert

Nehmen wir uns einen Moment Zeit, um zu verstehen, wie FontAwesome funktioniert. Die Idee hinter dem FontAwesome-Symbolpaket ist einfach: Die Symbole werden wie Zeichen behandelt. Sie haben vielleicht bemerkt, dass einige exotische Charaktere werden als Text behandelt. Sie können dies beispielsweise einfach kopieren und einfügen b Charakter oder dies Charakter. Sie können dies sogar in einem einfachen Texteditor tun. Es ist auch möglich, ihre Größe und Farbe zu ändern. Dies liegt daran, dass der Browser – und der Texteditor – diese Zeichen als Text betrachten.

FontAwesome erweitert dieses Konzept um eine Vielzahl von Symbolen. Sie können sich das als Wörterbuch vorstellen, das Unicode-Zeichen, die nicht eingegeben werden können und die nicht verwendet werden, mit einem bestimmten Symbol vergleicht.

Schau es dir an FontAwesome Spickzettel um zu sehen, wovon ich spreche. Sie wählen ein Symbol aus der Liste aus, notieren sich dessen Unicode-Zeichen und verwenden es in a TextViewund weist Android an, es mit der Schriftart FontAwesome zu rendern.

2. Importieren Sie die Schriftartdatei

Schauen wir uns ein Beispiel an. Laden Sie die FontAwesome TrueType-Datei herunter und importieren Sie sie in Ihr Projekt. Sie können die FontAwesome-Ressourcen von herunterladen GitHub.

Wenn Sie FontAwesome herunterladen, erhalten Sie ein Archiv, das eine Reihe von Dateien und Ordnern enthält. Die meisten davon sind nützlich für Webprojekte. Wir sind nur interessiert an fontawesome-webfont.ttf, die sich in der befindet Richtlinien Dossier.

Navigieren Sie in Ihrem Android-Projekt zu app> src> main. das Main Das Verzeichnis muss einen Ordner mit dem Namen enthalten Vermögenswerte. Wenn es keinen gibt, erstellen Sie ihn. in dem Vermögenswerte Verzeichnis, erstellen Sie einen anderen Ordner, Richtlinienund hinzufügen fontawesome-webfont.ttf in dieser Datei.

verbunden :  So konvertieren Sie AVI- und MKV-Dateien, um Videos zu iTunes hinzuzufügen

Notiere dass der Richtlinien Verzeichnis ist nicht erforderlich. Sie können die FontAwesome-Schriftartdatei in der hinzufügen Vermögenswerte Verzeichnis, aber es ist praktisch, Dateien des gleichen Typs in einem dedizierten Verzeichnis zu haben. Solange sich die FontAwesome-Schriftartdatei in der Vermögenswerte Verzeichnis oder ein Unterverzeichnis davon, Sie können loslegen.

3. Erstellen Sie eine Hilfsklasse

Nachdem Sie die FontAwesome-Schriftartdatei erfolgreich in Ihr Android-Projekt aufgenommen haben, ist es Zeit, sie zu verwenden. Wir werden eine Hilfsklasse erstellen, um dies zu vereinfachen. Die Klasse, die wir verwenden werden, ist android.graphics.Typeface. das Typeface Klasse gibt die Schriftart und den intrinsischen Stil einer Schriftart an. Dies wird verwendet, um festzulegen, wie Text beim Zeichnen (und Messen) angezeigt wird.

Beginnen wir mit der Erstellung der Hilfsklasse. Erstellen Sie eine neue Java-Klasse und benennen Sie sie FontManager::

Wenn Sie andere Schriftarten in Ihrem Projekt verwenden möchten, können Sie der Hilfsklasse problemlos weitere Schriftarten hinzufügen. Die Idee ist ähnlich:

Das ist alles was wir tun müssen, aber wir können es besser machen. Lassen Sie uns etwas weiter gehen. Mit der obigen Methode müssen wir für jede eine Variable erstellen TextView Wir möchten als Symbol verwenden. Es ist sehr gut. Aber als Programmierer sind wir faul. Recht?

Symbole sind oft in einem einzigen enthalten ViewGroup, sowie RelativeLayout oder eins LinearLayout. Wir können eine Methode schreiben, die steigen die Baumstruktur eines bestimmten übergeordneten XML-Elements und ersetzt rekursiv die Schriftart jedes einzelnen TextView er findet.

Angenommen, Ihre Layoutdatei sieht folgendermaßen aus:

Um die drei zu markieren TextView Instanzen in Form von Symbolen ersetzen wir die onCreate und fügen Sie das folgende Code-Snippet hinzu:

4. Verwenden Sie die gewünschten Symbole

Jetzt kommt der lustige Teil. Besuch Seite GitHub de FontAwesome und durchsuchen Sie die verfügbaren Symbole. Wählen Sie drei Symbole aus, die Ihnen gefallen. Ich werde drei Grafiken auswählen, die Flächendiagrammsymbol, das Kreisdiagramm-Symbol, und die Liniendiagrammsymbol.

Gehen Sie in Ihrem Projekt zu Werte Ordner und erstellen Sie eine neue Datei, icons.xml. Diese Datei dient als Wörterbuch, dh sie ordnet das einem bestimmten Symbol zugeordnete Unicode-Zeichen einem lesbaren Namen zu. Dies bedeutet, dass wir für jedes Symbol einen Eintrag erstellen müssen. So funktioniert es.

Den Code finden Sie in der FontAwesome Spickzettel oder auf der Detailseite Symbol, das Sie interessiert.

Der nächste Schritt besteht darin, auf die Zeichenfolgeneinträge in der zu verweisen TextView Instanzen Ihres Layouts. So sieht das Endergebnis aus:

Wenn Sie den Android Studio-Layouteditor öffnen, werden Sie feststellen, dass keine Symbole gerendert werden können. Es ist nicht normal. Erstellen und starten Sie Ihre Anwendung. Sie sollten nun die korrekt gerenderten Symbole sehen:

FontAwesome - Erstes Rendern

Sie sind klein, oder? Es ist sehr einfach, die Größe der Symbole zu ändern. Alles was Sie tun müssen, ist das zu ändern textSize Attribut. Das Ändern der Farbe des Symbols ist ebenso einfach. Bearbeiten textColor Attribut und du bist fertig.

FontAwesome - Farbe und Größe geändert

Wie Sie sehen können, sind die Symbole klar und deutlich. Dies liegt daran, dass die FontAwesome-Symbole zur Laufzeit gerendert werden. Sie sind Vektor Anstatt von Raster Dateien.

Fazit

In diesem kurzen Tipp habe ich Ihnen gezeigt, wie Sie das FontAwesome-Symbol in einem Android-Projekt verwenden. FontAwesome ist weithin bekannt, sehr reich und kostenlos. Das Ergebnis sind gestochen scharfe Symbole, selbst auf hochauflösenden Bildschirmen. Als Bonus ist das Ändern der Größe oder Farbe eines Symbols so einfach wie das Ändern eines XML-Attributs.

Moyens Staff
Moyens I/O-Personal. motivierte Sie und gab Ratschläge zu Technologie, persönlicher Entwicklung, Lebensstil und Strategien, die Ihnen helfen werden.
We would like to show you notifications for the latest news and updates.
Dismiss
Allow Notifications