Cómo cambiar el Estilo de los Textos con SwiftUI
Ya hemos visto lo fácil que es crear un Texto con SwiftUI, ahora veamos como cambiar su apariencia.
Tomemos como punto de partida el Código Fuente que se genera automáticamente cuando creamos un Proyecto SwiftUI.
Hacemos clic sobre el botón Resume para que se muestre la Vista Previa
Ya tenemos nuestra situación de partida
Cómo cambiar el Estilo de los Textos en Modo Gráfico
Xcode ha demostrado ser un moderno y potente IDE, y eso se refleja a la hora de poder editar aspectos de nuestra App en módo gráfico, sin tener que trabajar con el Código Fuente.
En el caso que nos ocupa, nos fijaremos en el Texto que se muestra en la Preview. Mantendremos pulsada la tecla Cmd y haremos clic sobre el texto, apareciéndonos el siguiente menú
Elegimos la opción Show SwiftUI Inspector...
En la sección Modificadores podremos cambiar algunos de los aspectos básicos que definen el Estilo de nuestro Texto, como Font, Weight, Color,
Obteniendo como resultado:
Otra forma de hacerlo es seleccionando (haciendo un clic) el elemento de texto (en el Editor de Código o en la Preview) y abriendo el Attributes Inspector en el panel de la Derecha.
Xcode se encarga de escribir el Código Fuente correspondiente a los Estilos aplicados al texto.
Comprobamos que la Sintaxis del Código SwiftUI es la propia de un Lenguaje de Programación Declarativo.
Cómo cambiar el Estilo de los Textos desde el Código Fuente
Mediante los Modificadores de un elemento podremos cambiar las propiedades del mismo. Gracias a que Xcode tiene la capacidad de Autocompletado de Código, esta tarea será muy sencilla de llevar a cabo.
Bastará con escribir . a continuación de nuestro Text y se desplegará el listado de Modificadores disponibles.
Cómo cambiar el Grosor del Texto
Para cambiar el grosor del texto tenemos que emplear el método fontWeight.
Conforme empezamos a escribir, Xcode nos autocompleta ofreciéndonos distintas opciones. En este caso la que nos interesa es
.fontWeight(_ weight: Font.Weight?) -> TextDonde weight: Font.Weight? es un Enumerado, por lo que hacemos clic sobre ese Código y escribiremos . y Xcode volverá a desplegarnos un menú con los distintos valores disponibles
Text("Hello World!").fontWeight(.bold)Para que el código sea más legible, colocaremos los Modificadores en distintas líneas
Text("Hello World!")
.fontWeight(.bold)
Cómo cambiar el Color del Texto
Para cambiar el color del texto tenemos que emplear el método foregroundColor.
Como vemos, podemos encadenar tantos Modificadores como deseemos para obtener el Estilo del Texto que estamos buscando.
-
El Modificador padding en SwiftUI
Nos permite agregar un margen entre el Texto y la caja que lo contiene, de forma que no quede pegado a los bordesCreado: 24/03/2021 -
Espaciado de Líneas de Texto en SwiftUI
El Modificador lineSpacing nos permite definir la separación entre líneas de textoCreado: 24/03/2021 -
Modo de Truncamiento en SwiftUI
Cuando tenemos limitado el número de líneas a mostrar, utilizaremos el Modificador truncationMode para establecer como se truncará el textoCreado: 17/03/2021 -
Limitar el Número de Líneas en SwiftUI
Con el Modificador lineLimit de SwiftUI establecemos el número de líneas de texto a mostrar en caso de tener un texto que ocupa varias líneasCreado: 14/03/2021 | Modificado: 24/03/2021 -
Alineación de Textos Multi-línea en SwiftUI
SwiftUI pone a nuestra disposición el Modificador multilineTextAlignment para alinear los Textos cuando tenemos varias líneasCreado: 14/03/2021 -
Cómo cambiar la Fuente de los textos en SwiftUI
SwiftUI permite cambiar de manera sencilla la Fuente usada en los Textos que mostramos en nuestras AppsCreado: 12/03/2021 -
Cómo cambiar el color de los textos en SwiftUI con el Modificador foregroundColor
El Modificador foregroundColor nos permite cambiar el color de los Textos generados con SwiftUICreado: 12/03/2021 -
Cómo cambiar la apariencia de los textos en SwiftUI con el Modificador font
El Modificador font nos permite cambiar distintas propiedades que afectan a la apariencia de los Textos en SwiftUICreado: 11/03/2021 -
Cómo cambiar el Grosor de los Textos con SwiftUI (fontWeight)
Veamos el Modificador que nos permite cambiar el Grosor de los TextosCreado: 21/06/2020 | Modificado: 10/03/2021 -
Nuestro primer Texto con SwiftUI (Text)
Vamos a comprobar como SwiftUI hace que sea muy sencillo trabajar con los Textos de la Interfaz Gráfica de nuestra AppCreado: 20/06/2020 | Modificado: 10/03/2021 -
Introducción al trabajo con Textos con SwiftUI
Veamos una primera aproximación conceptual a los Textos cuando utilizamos SwiftUI para generar las Interfaces Gráficas de nuestras AppsCreado: 17/06/2020 | Modificado: 08/03/2021