Agregar fuentes en Flutter

Author
By Darío Rivera
Posted on 2021-05-02 in Flutter

Agregar una fuente en flutter es una tarea rutinaria que surge al crear casi cualquier aplicación. El día de hoy veremos lo fácil que es agregar nuestras fuentes personalizadas en nuestro desarrollo con Flutter.

Descargar la fuente

Lo primero que debes hacer es descargar la fuente que deseas agregar a tu aplicación. Esto lo puedes hacer en Google Fonts o cualquier otro proveedor de fuentes de tu elección. El archivo que necesitas importar en tu proyecto tendrá la extensión ttf.

Importar la fuente

Lo siguiente que debes hacer es importar la fuente en tu proyecto. Una buena práctica es crear una carpeta llamada fonts en la raíz de tu prouecto y colocar allí todas tus fuentes. Una vez hecho esto deberás modifcar el archivo pubspec.yml e indicar el path de tu fuente así:

flutter:
  ...
  fonts:
    - family: Righteous
      fonts:
        - asset: fonts/Righteous-Regular.ttf

Como has agregado un nuevo recurso a tu proyecto debes correr el siguiente comando:

flutter pub get

Utiliza tu fuente

Una vez hecho lo anterior podrás utilizar la fuente con el nombre que colocaste en la key family.

Text(
  "Hola mundo",
  style: TextStyle(
  fontSize: 16,
  fontFamily: 'Righteous'
),

Acerca de Darío Rivera

Author

Ingeniero de desarrollo en PlacetoPay , Medellín. Darío ha trabajado por más de 6 años en lenguajes de programación web especialmente en PHP. Creador del microframework DronePHP basado en Zend y Laravel.

Sólo aquellos que han alcanzado el éxito saben que siempre estuvo a un paso del momento en que pensaron renunciar.