Cómo utilizar los iconos de Font Awesome en Android

Font Awesome es un conjunto de herramientas de iconos muy popular que se utiliza en muchos sitios web. Tiene ambos libre y profesional Colección de iconos, pero puede encontrar la mayoría de los iconos en la colección gratuita usted mismo. Cada símbolo está representado por Unicode (& # xf17b;). Usamos este Unicode para mostrar el símbolo en TextView. Dado que se trata de una vista de texto normal, se pueden aplicar todos los atributos de estilo de texto (color, tamaño, relleno, etc.).

Por ejemplo, si desea anunciar Robot de Android Puedes usar logo & # xf17b; Unicode como valor TextView.

1. Biblioteca de Android Font Awesome

Para utilizar la biblioteca de símbolos Fantastic Fantastic, debe agregar los archivos font-font-font a los suyos activos financieros directamente y aplicar el apropiado fuente sobre Resumen de texto Es una tarea más sencilla. Sin embargo, nos gustaría que los íconos aparecieran también en otros widgets, como en Llaves, Menús, Navegación inferior y Cajón de navegación etc. Mostrar iconos en vistas no textuales requiere cierto esfuerzo. Así que escribí una biblioteca incorporando todos los métodos necesarios para renderizar los íconos en varios widgets.

Primero, agregue el fontawesome en tus build.gradle y sincroniza tu proyecto.

dependencies 
    // font awesome
    implementation 'info.androidhive:fontawesome:0.0.5'

2. ¿Cómo lo usas?

2.1 Mostrar símbolo en TextView

La forma más fácil de ver el símbolo de fuente es usar FontTextView Texto estableciendo el nombre del símbolo apropiado como valor de texto. Este widget se extiende desde AppCompatTextViewPor lo tanto, todos los atributos de la vista de texto se aplican a este widget.

<info.androidhive.fontawesome.FontTextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/fa_calendar_check_solid"
            android:textColor="@color/icon_color"
            android:textSize="@dimen/icon_size"
            app:solid_icon="true" />

• solid_icon: Para mostrar un icono sólido, establezca este valor en cierto.
• brand_icon: Para mostrar el icono de marca registrada, establezca este valor en cierto.

2.2 Usando FontDrawable

Usar el símbolo en el diseño XML es fácil. Sin embargo, si desea utilizar el icono para otros widgets, como botones o menús, puede utilizar ese FontDrawable Elemento para aplicar el símbolo.

Por ejemplo, si desea usar el ícono de fuentes increíbles para el botón de acción flotante, puede usar FontDrawable como se muestra a continuación.

FloatingActionButton fab = findViewById(R.id.fab);

// using paper plane icon for FAB
FontDrawable drawable = new FontDrawable(this, R.string.fa_paper_plane_solid, true, false);

// white color to icon
drawable.setTextColor(ContextCompat.getColor(this, android.R.color.white));
fab.setImageDrawable(drawable);

2.3 Uso en menús (navegación inferior, cajón de navegación, etc.)

También puede utilizar los símbolos de fuente en los widgets utilizados Menú Archivo para renderizar los elementos como Iconos de la barra de herramientas, Navegación inferior, Cajón de navegación etc. Para representar el ícono en los menús, puede configurar los íconos usando FontDrawable, pero no requiere mucho pirateo del código Java.

El siguiente ejemplo muestra la representación de los increíbles iconos de fuentes en el menú de la barra de navegación. Puede encontrar un ejemplo completo aquí.

public class MainActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener 
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        intDrawerLayout();
    

    /**
     * Changing navigation drawer icons
     * This involves looping through menu items and applying icons
     */
    private void intDrawerLayout() 
        NavigationView navigationView = findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);

        ImageView iconHeader = navigationView.getHeaderView(0).findViewById(R.id.nav_header_icon);
        FontDrawable drawable = new FontDrawable(this, R.string.fa_font_awesome, false, true);
        drawable.setTextColor(ContextCompat.getColor(this, android.R.color.white));
        drawable.setTextSize(50);
        iconHeader.setImageDrawable(drawable);

        int[] icons = 
                R.string.fa_home_solid, R.string.fa_calendar_alt_solid, R.string.fa_user_solid,
                R.string.fa_heart_solid, R.string.fa_comment_solid, R.string.fa_dollar_sign_solid, R.string.fa_gift_solid
        ;
        renderMenuIcons(navigationView.getMenu(), icons, true, false);

        int[] iconsSubmenu = R.string.fa_cog_solid, R.string.fa_sign_out_alt_solid;

        renderMenuIcons(navigationView.getMenu().getItem(7).getSubMenu(), iconsSubmenu, true, false);
    

    /**
     * Looping through menu icons are applying font drawable
     */
    private void renderMenuIcons(Menu menu, int[] icons, boolean isSolid, boolean isBrand) 
        for (int i = 0; i < menu.size(); i++) 
            MenuItem menuItem = menu.getItem(i);
            if (!menuItem.hasSubMenu()) 
                FontDrawable drawable = new FontDrawable(this, icons[i], isSolid, isBrand);
                drawable.setTextColor(ContextCompat.getColor(this, R.color.icon_nav_drawer));
                drawable.setTextSize(22);
                menu.getItem(i).setIcon(drawable);
            
        
    

Espero que disfrutes de esta biblioteca. Si tiene alguna sugerencia, hágamelo saber en la sección de comentarios a continuación.

Diviértete codificando 🙂