Programación en Swift y SwiftUI para iOS Developers

Como cambiar la fuente y el color en una Navigation Bar en SwiftUI

Actualmente, SwiftUI no proporciona un modifier directo para configurar la fuente y el color de la barra de navegación. Sin embargo, podemos utilizar la API UINavigationBarAppearance proporcionada por UIKit para lograr esta personalización.

Para cambiar el color del título a rojo y la fuente a Arial Rounded MT Bold, podemos crear un objeto UINavigationBarAppearance en la función init() y configurar los atributos deseados. Inserta la siguiente función en ContentView:

init() {
        let navBarAppearance = UINavigationBarAppearance()
        navBarAppearance.largeTitleTextAttributes = [.foregroundColor: UIColor.red, .font: UIFont(name: "ArialRoundedMTBold", size: 35)!]
        navBarAppearance.titleTextAttributes = [.foregroundColor: UIColor.red, .font: UIFont(name: "ArialRoundedMTBold", size: 20)!]
        
        UINavigationBar.appearance().standardAppearance = navBarAppearance
        UINavigationBar.appearance().scrollEdgeAppearance = navBarAppearance
        UINavigationBar.appearance().compactAppearance = navBarAppearance
        
    }

El código en XCode quedaría así:

La propiedad largeTitleTextAttributes se utiliza para configurar los atributos de texto del título de tamaño grande, mientras que la propiedad titleTextAttributes se utiliza para configurar los atributos de texto del título de tamaño estándar. Una vez que hemos configurado navBarAppearance, lo asignamos a las tres propiedades de apariencia: standardAppearancescrollEdgeAppearance y compactAppearance.

Si lo deseas, puedes crear objetos de apariencia separados para scrollEdgeAppearance y compactAppearance y asignarlos individualmente.

Leave a Reply

Your email address will not be published. Required fields are marked *

Previous Article

Como usar NavigationStack en SwiftUI

Next Article

Como cambiar la imagen del botón Atrás y el color en SwiftUI

Related Posts