Estilos explícitos e implícitos en .NET MAUI

Crear estilos en .NET MAUI te permite ahorrar tiempo de codificación y mantener consistencia visual en tu aplicación. Aquí practicarás cómo definir estilos explícitos, moverlos a un archivo global y aprovechar los implícitos que ya vienen predefinidos en el framework, partiendo de un UI con grid que ya construiste.

Dónde encuentras los estilos predefinidos en .NET MAUI

Antes de escribir un estilo propio, conviene saber qué te ofrece el framework por defecto. .NET MAUI organiza estos recursos en archivos centralizados que puedes editar y reutilizar.

En la carpeta Resources encuentras la subcarpeta Styles con dos archivos clave:

• styles.xaml: contiene una variedad de estilos predefinidos por .NET MAUI listos para que los modifiques [01:05].
• colors.xaml: agrupa colores globales que defines una sola vez y reutilizas en toda la aplicación [01:25].

Esta estructura tiene una ventaja directa: si necesitas cambiar un color o una fuente, lo haces en un único lugar y se actualiza en cada pantalla que lo use.

Cómo creo un estilo explícito en XAML

Un estilo explícito es aquel al que le asignas un nombre con x:Key y lo aplicas manualmente a los controles que tú decidas. Es útil cuando quieres aplicar el mismo formato solo a ciertos elementos.

En el ejemplo del frame Articles, Followers and Rating, cada Label repetía propiedades como FontSize, TextColor y la alineación. Para evitar esa repetición, defines un ResourceDictionary dentro de la página:

¿Qué es un estilo explícito en .NET MAUI? Es un bloque de propiedades agrupadas bajo un nombre (x:Key) y un TargetType, que aplicas manualmente al control que lo necesite usando StaticResource.

Los pasos concretos son:

1. Abrir las etiquetas ContentPage.Resources y dentro un ResourceDictionary.
2. Declarar Style x:Key="titlesStyle" TargetType="Label".
3. Agregar cada propiedad con un Setter indicando Property y Value, por ejemplo FontSize con valor 11 [03:20].
4. En el Label, asignar Style="{StaticResource titlesStyle}".

El TargetType indica el control al que aplica el estilo, en este caso Label. Una vez asignado, los tres títulos (artículos, seguidores y rating) comparten el mismo formato. Si después agregas una propiedad como BackgroundColor en rojo dentro del estilo, los tres títulos cambian al mismo tiempo con una sola modificación.

Cómo convierto un estilo en global y reutilizable

El estilo explícito que vive en una página solo sirve en esa página. Si quieres usarlo en cualquier XAML del proyecto, necesitas moverlo a un archivo centralizado.

Cómo muevo el estilo al archivo styles.xaml

El proceso es directo: copias el bloque del estilo desde la página y lo pegas dentro del archivo styles.xaml ubicado en Resources/Styles. Puedes pegarlo donde prefieras, pero por orden conviene hacerlo al final del archivo [05:50].

En la página dejas únicamente la asignación Style="{StaticResource titlesStyle}" en cada Label. Al recargar, el estilo sigue funcionando y, si cambias el BackgroundColor a amarillo en el archivo central, todas las páginas que usen ese estilo reflejan el cambio.

¿Cuál es la diferencia entre un estilo local y uno global? El estilo local vive dentro de un ContentPage y solo aplica ahí. El global vive en un archivo como styles.xaml y puedes invocarlo desde cualquier XAML del proyecto.

Por qué centralizar estilos ahorra tiempo

Cuando un estilo está en un archivo único, cualquier ajuste de marca, color corporativo o tipografía se hace en un solo lugar. Esto reduce errores, evita inconsistencias entre pantallas y acelera el mantenimiento del proyecto a largo plazo.

Qué es un estilo implícito y cuándo conviene usarlo

El estilo implícito se aplica automáticamente a todos los controles del TargetType indicado, sin necesidad de asignarlo con StaticResource. La diferencia clave con el explícito es que no lleva nombre (x:Key), solo un TargetType.

Dentro de styles.xaml ya vienen estilos implícitos predefinidos. Por ejemplo, el estilo para TabbedPage trae propiedades como BackgroundColor y BarTextColor listas para modificarse [07:35]. Cada control de .NET MAUI tiene su versión predefinida en este archivo.

¿Cuándo uso un estilo implícito en lugar de uno explícito? Cuando quieres que todos los controles de un mismo tipo (todos los Button, todos los Label) compartan el mismo formato sin tener que asignarlo uno por uno.

La recomendación práctica es revisar primero el archivo styles.xaml antes de crear un estilo nuevo. Si el control que quieres modificar ya tiene su bloque definido, basta con ajustar las propiedades que necesites. Esta es una de las novedades de .NET MAUI que más tiempo te ahorra al codificar interfaces.

Anímate a explorar todos los estilos predefinidos del archivo y comenta qué propiedades cambiaste primero al adaptar el tema a tu propio proyecto.