Cómo usar íconos y símbolos desde “Font Awesome” en la aplicación nativa de Android

Intento utilizar Font Awesome en mi aplicación, pude integrar la fuente usando Typeface.createFromAsset() , pero también quiero usar los icons proporcionados por esta fuente, pero hasta ahora no he podido hacer ese.

Esta fuente en particular contiene íconos dentro del área de uso privado (PUA) de Unicode, para cosas como controles del reproductor multimedia, acceso al sistema de archivos, flechas, etc.

¿Alguien ha usado fonts que contengan íconos y símbolos en Android, esto es posible?

Font Awesome parece estar funcionando bien para mí en mi aplicación de Android. Hice lo siguiente:

  1. fontawesome-webfont.ttf en mi carpeta assests
  2. Encontré las entidades de caracteres para los icons que quería, usando esta página: http://fortawesome.github.io/Font-Awesome/cheatsheet/
  3. Creado una entrada en strings.xml para cada icono. Por ejemplo, para un corazón:

      
  4. Hace referencia a dicha entrada en la vista de mi diseño xml:

       
  5. Cargué la fuente en mi método onCreate y lo configuré para las Vistas apropiadas:

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

Pruebe IcoMoon: http://icomoon.io

  • Elige los icons que quieras
  • Asignar personajes a cada icono
  • Descargar la fuente

Digamos que eligió el ícono de juego, le asignó la letra “P” y descargó el archivo icomoon.ttf a su carpeta de activos. Así es como se muestra el ícono:

xml:

  

Java:

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

He dado una charla sobre cómo hacer hermosas aplicaciones de Android, que incluye una explicación sobre el uso de fonts de icons, además de agregar degradados para que los icons sean aún más bonitos: http://www.sqisland.com/talks/beautiful-android

La explicación de la fuente del icono comienza en la diapositiva 34: http://www.sqisland.com/talks/beautiful-android/#34

Tal vez es demasiado tarde, pero tenía la misma necesidad, así que publiqué esta https://github.com/liltof/font-awsome-for-android Es una versión de xml de la fuente de Android increíble, utilizable al igual que Keith Corwin dijo

Espero que ayude a otros.

Como arriba es un gran ejemplo y funciona genial:

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

¡PERO! > esto funcionará si la cadena dentro del botón establece desde xml:

  button.setText(getString(R.string.icon_heart)); 

Si necesita agregarlo dinámicamente puede usar esto:

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

Hay una biblioteca pequeña y útil diseñada para este propósito :

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

Obtenga una demostración en Google Play .

enter image description here

Puede agregar fácilmente un ícono basado en fonts en su diseño:

  

Puede inflar font-icon como Drawable desde xml:

   

Código Java:

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

Campo de golf:

  • Página del proyecto
  • Repo de Github

Si quieres setText programático sin agregar cadena a string.xml

ver su código hexadecimal aquí:

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

reemplazar & # xf066; a 0xf066

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

Hice esta clase de ayuda en C # (Xamarin) para establecer programáticamente la propiedad del texto. Es lo que funciona bastante bien para mí:

 internal static class FontAwesomeManager { private static readonly Typeface AwesomeFont = Typeface.CreateFromAsset(App.Application.Context.Assets, "FontAwesome.ttf"); private static readonly Dictionary IconMap = new Dictionary { {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 } 

Debería ser lo suficientemente fácil de convertir a Java, creo. Espero que ayude a alguien!

Una de las bibliotecas que utilizo para Font Awesome es esta:

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

Específicamente,

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

La documentación es fácil de entender.

Primero, agregue las dependencias necesarias en build.gradle:

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

En segundo lugar, puede agregar esto en su XML:

  

pero asegúrese de agregar esto en su diseño de raíz si desea usar el ejemplo de código anterior:

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

La biblioteca FontView le permite usar caracteres de fuente normal / unicode como icons / gráficos en su aplicación. Puede cargar la fuente a través de activos o una ubicación de red.

El beneficio de esta biblioteca es que:

 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

Ejemplo:

Layout:

  

Java:

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

Hay otra buena solución que puede usar directamente en sus archivos xml de diseño y no requiere el uso de setTypeface .

Es Iconify de Joan Zapata. Puedes leer aquí las novedades de Iconify v2 . Incluye 9 bibliotecas de fonts diferentes que puede usar simplemente agregando dependencias a su archivo build.gradle .

En los archivos xml de diseño, es posible elegir entre estos widgets:

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

Llego un poco tarde a la fiesta pero escribí una vista personalizada que permite hacer esto, de manera predeterminada está configurada para entypo, pero puedes modificarla para usar cualquier fuente de icons: mira aquí: github.com/MarsVard/IconView

// editar la biblioteca es vieja y ya no es compatible … nueva aquí https://github.com/MarsVard/IonIconView

En caso de que solo necesite algunos íconos impresionantes de fonts, también puede usar http://fa2png.io para generar imágenes de píxeles normales. Pero si agrega nuevos icons / botones regularmente, recomendaría la versión .ttf porque es más flexible.

Si alguien se pregunta cómo agregarlo programmáticamente, debes hacerlo de esta manera.

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

Como todas las respuestas son geniales, pero no quería usar una biblioteca y cada solución con solo una línea de código Java, mis Activities y Fragments eran muy complicados. Así que escribí la clase TextView la siguiente manera:

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

lo que debe hacer es copiar el archivo ttf la fuente en la carpeta de assets . Y use esta hoja de trucos para encontrar cada cadena de icons.

espero que esto ayude.