Go y Golang

Agregar texto a imagen con Golang

En este tutorial de trabajo con imágenes en Golang vamos a ver cómo escribir texto sobre una imagen, cambiado la alineación, tamaño, espaciado de línea e incluso cargando una fuente TTF.

Veamos entonces cómo dibujar texto sobre una imagen con Golang. El ejemplo que te mostraré crea una imagen en blanco y dibuja el texto en la misma, ajustando el texto como sea necesario.

Instalando Go Graphics

Si bien deben existir varias maneras de agregar texto a una imagen con Go, yo recomiendo usar la librería Go graphics cuyo repositorio está en: https://github.com/fogleman/gg

Puedes instalarlo así: go get -u github.com/fogleman/gg

Y después importarlo así:

import "github.com/fogleman/gg"

Escribir texto usando tipografía TTF

Escribir en imagen con Golang – Dibujar texto con TTF

Veamos un primer ejemplo donde a partir de una tipografía (font face) escribimos el texto sobre una imagen. El ejemplo queda así, lo he encerrado en una función para que sea reutilizable:

func dibujarConFuenteDeUsuario(ancho, alto, tamañoFuente float64, espaciadoDeLineas float64, texto string, alineacion int, ubicacionFuente string) error {
 dc := gg.NewContext(int(ancho), int(alto))
 dc.SetRGB(1, 1, 1) // Fondo
 dc.Clear()
 dc.SetRGB(0, 0, 0) // Color del texto
 if err := dc.LoadFontFace(ubicacionFuente, tamañoFuente); err != nil {
  return err
 }
 dc.DrawStringWrapped(
  texto,
  0, 0,
  0, 0,
  ancho, espaciadoDeLineas,
  gg.Align(alineacion))
 return dc.SavePNG(fmt.Sprintf("Fuente personalizada.%vx%v, tamaño %v, espacio %v.png", ancho, alto, tamañoFuente, espaciadoDeLineas))
}

Comenzamos creando el “lienzo” con NewContext indicando el ancho y el alto, después configuramos el fondo y el color del texto. A continuación cargamos la tipografía con LoadFontFace e indicamos el tamaño de dicha fuente.

Al invocar a DrawStringWrapped se va a escribir el texto indicado en la imagen usando Golang, ajustando el texto a una nueva línea como sea necesario.

La invocación para generar la imagen anterior queda así:

func main() {
 texto := "Agregando texto a imagen usando Golang desde el blog de Parzibyte (parzibyte.me/blog)"
 ancho := 386.00
 alto := 200.00
 tamañoFuente := 30.00
 alineacion := 0 //0 izquierda, 1 centro, 2 derecha
 dibujarConFuenteDeUsuario(ancho, alto, tamañoFuente, 1.5, texto, alineacion, "neon.ttf")
}

Toma en cuenta que en este caso “neon.ttf” es una tipografía descargada de internet, concretamente del repositorio de Monaspace, unas tipografías recientemente publicadas por GitHub.

A partir de aquí puedes usar cualquier tipografía, siempre y cuando la misma tenga formato TTF y puedas indicarla como ubicación al invocar a la función.

Fuente truetype gomonobold

Usar tipografía Go mono bold para escribir texto sobre imagen usando Golang

Además de escribir texto usando una tipografía TTF descargada de internet, podemos usar algunas fuentes que Go proporciona. En ese caso necesitas instalar:

go get golang.org/x/image

Y después importar con:

import "github.com/golang/freetype/truetype"
import "golang.org/x/image/font/gofont/gomonobold"

Ahora veamos el ejemplo para usar esta tipografía y escribir texto sobre una imagen. Es casi lo mismo que mostramos arriba, pero con la diferencia de la tipografía.

func dibujarConFuenteDeGolang(ancho, alto, tamañoFuente float64, espaciadoDeLineas float64, texto string, alineacion int) error {
 dc := gg.NewContext(int(ancho), int(alto))
 font, err := truetype.Parse(gomonobold.TTF)
 if err != nil {
  return err
 }
 face := truetype.NewFace(font, &truetype.Options{
  Size: tamañoFuente,
 })
 dc.SetFontFace(face)
 dc.SetRGB(1, 1, 1) // Fondo
 dc.Clear()
 dc.SetRGB(0, 0, 0) // Color del texto
 dc.DrawStringWrapped(
  texto,
  0, 0,
  0, 0,
  ancho, espaciadoDeLineas,
  gg.Align(alineacion))
 return dc.SavePNG(fmt.Sprintf("Go.%vx%v, tamaño %v, espacio %v.png", ancho, alto, tamañoFuente, espaciadoDeLineas))
}

Ahora hemos agregado texto a una imagen usando Golang y también una tipografía de Go (Go mono bold). En este caso no es necesario que el usuario cargue la tipografía o que la tenga en el mismo lugar en el que se ejecuta el programa, digamos que la fuente va embebida.

Conclusión

Así de simple podemos escribir texto sobre una imagen usando Go. La imagen resultante será escrita en el mismo lugar donde el programa se ejecuta, en este caso el nombre de la misma depende del tamaño, espacio, etcétera (lo hice con fines de depuración).

La librería Go graphics ofrece muchas más cosas y formas de exportar la imagen resultante; puedes revisar todos los detalles en el repositorio oficial.

Yo estaba revisando esta librería para crear una imagen como texto y después imprimir dicha imagen en una impresora térmica, evitando problemas de acentos.

Estoy aquí para ayudarte 🤝💻


Estoy aquí para ayudarte en todo lo que necesites. Si requieres alguna modificación en lo presentado en este post, deseas asistencia con tu tarea, proyecto o precisas desarrollar un software a medida, no dudes en contactarme. Estoy comprometido a brindarte el apoyo necesario para que logres tus objetivos. Mi correo es parzibyte(arroba)gmail.com, estoy como@parzibyte en Telegram o en mi página de contacto

No te pierdas ninguno de mis posts 🚀🔔

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Entradas recientes

Creador de credenciales web – Aplicación gratuita

Hoy te voy a presentar un creador de credenciales que acabo de programar y que…

1 semana hace

Desplegar PWA creada con Vue 3, Vite y SQLite3 en Apache

Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…

2 semanas hace

Arquitectura para wasm con Go, Vue 3, Pinia y Vite

En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…

2 semanas hace

Vue 3 y Vite: crear PWA (Progressive Web App)

En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…

2 semanas hace

Errores de Comlink y algunas soluciones

Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…

2 semanas hace

Esperar promesa para inicializar Store de Pinia con Vue 3

En este artículo te voy a enseñar cómo usar un "top level await" esperando a…

2 semanas hace

Esta web usa cookies.