Changer la couleur de la barre de navigation dans Swift

J'utilise une vue Sélecteur pour permettre à l'utilisateur de choisir le thème de couleur pour l'application entière.

Je prévois de changer la couleur de la barre de navigation, de l'arrière-plan et éventuellement de la barre d'onglets (si cela est possible).

J'ai cherché comment faire mais je ne trouve aucun exemple Swift. Quelqu'un pourrait-il me donner un exemple du code que je devrais utiliser pour changer la couleur de la barre de navigation et la couleur du texte de la barre de navigation?

La vue Picker est configurée, je cherche juste le code pour changer les couleurs de l'interface utilisateur.

Barre de navigation:

navigationController?.navigationBar.barTintColor = UIColor.green

Remplacez greenColor par l'UIColor que vous voulez, vous pouvez également utiliser un RVB si vous préférez.

Texte de la barre de navigation:

navigationController?.navigationBar.titleTextAttributes = [.foregroundColor: UIColor.orange]

Remplacez orangeColor par la couleur de votre choix.

Barre d'onglets:

tabBarController?.tabBar.barTintColor = UIColor.brown

Texte de la barre d'onglets:

tabBarController?.tabBar.tintColor = UIColor.yellow

Sur les deux derniers, remplacez brownColor et yellowColor par la couleur de votre choix.

Voici une personnalisation d'apparence très basique que vous pouvez appliquer à l'échelle de l'application:

UINavigationBar.appearance().backgroundColor = UIColor.greenColor()
UIBarButtonItem.appearance().tintColor = UIColor.magentaColor()
//Since iOS 7.0 UITextAttributeTextColor was replaced by NSForegroundColorAttributeName
UINavigationBar.appearance().titleTextAttributes = [UITextAttributeTextColor: UIColor.blueColor()]
UITabBar.appearance().backgroundColor = UIColor.yellowColor();

Plus d'informations sur l' UIAppearanceAPI dans Swift, vous pouvez lire ici: https://developer.apple.com/documentation/uikit/uiappearance

Mis à jour pour Swift 3, 4, 4.2, 5+

// setup navBar.....
UINavigationBar.appearance().barTintColor = .black
UINavigationBar.appearance().tintColor = .white
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.white]
UINavigationBar.appearance().isTranslucent = false

Swift 4

UINavigationBar.appearance().barTintColor = .black
UINavigationBar.appearance().tintColor = .white
UINavigationBar.appearance().titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.white]
UINavigationBar.appearance().isTranslucent = false

Swift 4.2, 5+

UINavigationBar.appearance().barTintColor = .black
UINavigationBar.appearance().tintColor = .white
UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
UINavigationBar.appearance().isTranslucent = false

Vous pouvez également vérifier ici: https://github.com/hasnine/iOSUtilitiesSource

UINavigationBar.appearance().barTintColor = UIColor(red: 46.0/255.0, green: 14.0/255.0, blue: 74.0/255.0, alpha: 1.0)
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName : UIColor.whiteColor()]

Collez simplement cette ligne didFinishLaunchingWithOptionsdans votre code.

Dans AppDelegate , cela a globalement changé le format de la NavBar et supprime la ligne de fond / la bordure (qui est un problème pour la plupart des gens) pour vous donner ce que je pense que vous et les autres recherchez:

 func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

    UINavigationBar.appearance().setBackgroundImage(UIImage(), forBarPosition: UIBarPosition.Any, barMetrics: UIBarMetrics.Default)
    UINavigationBar.appearance().shadowImage = UIImage()
    UINavigationBar.appearance().tintColor = UIColor.whiteColor()
    UINavigationBar.appearance().barTintColor = Style.SELECTED_COLOR
    UINavigationBar.appearance().translucent = false
    UINavigationBar.appearance().clipsToBounds = false
    UINavigationBar.appearance().backgroundColor = Style.SELECTED_COLOR
    UINavigationBar.appearance().titleTextAttributes = [NSFontAttributeName : (UIFont(name: "FONT NAME", size: 18))!, NSForegroundColorAttributeName: UIColor.whiteColor()] }

Ensuite, vous pouvez configurer un fichier Constants.swift , et contient une structure de style avec des couleurs et des polices, etc. Vous pouvez ensuite ajouter une tableView / pickerView à n'importe quel ViewController et utiliser le tableau "availableThemes" pour permettre à l'utilisateur de changer themeColor.

La belle chose à ce sujet est que vous pouvez utiliser une référence dans toute votre application pour chaque couleur et elle se mettra à jour en fonction du "Thème" sélectionné par l'utilisateur et sans celle-ci, elle sera par défaut theme1 ():

import Foundation
import UIKit

struct Style {


static let availableThemes = ["Theme 1","Theme 2","Theme 3"]

static func loadTheme(){
    let defaults = NSUserDefaults.standardUserDefaults()
    if let name = defaults.stringForKey("Theme"){
        // Select the Theme
        if name == availableThemes[0]   { theme1()  }
        if name == availableThemes[1]   { theme2()  }
        if name == availableThemes[2]   { theme3()  }
    }else{
        defaults.setObject(availableThemes[0], forKey: "Theme")
        theme1()
    }
}

 // Colors specific to theme - can include multiple colours here for each one
static func theme1(){
   static var SELECTED_COLOR = UIColor(red:70/255, green: 38/255, blue: 92/255, alpha: 1) }

static func theme2(){
    static var SELECTED_COLOR = UIColor(red:255/255, green: 255/255, blue: 255/255, alpha: 1) }

static func theme3(){
    static var SELECTED_COLOR = UIColor(red:90/255, green: 50/255, blue: 120/255, alpha: 1) } ...

Pour ce faire sur le storyboard (Interface Builder Inspector)

Avec l'aide de IBDesignable, nous pouvons ajouter plus d'options à Interface Builder Inspector UINavigationControlleret les modifier sur le storyboard. Tout d'abord, ajoutez le code suivant à votre projet.

@IBDesignable extension UINavigationController {
    @IBInspectable var barTintColor: UIColor? {
        set {
            guard let uiColor = newValue else { return }
            navigationBar.barTintColor = uiColor
        }
        get {
            guard let color = navigationBar.barTintColor else { return nil }
            return color
        }
    }
}

Ensuite, définissez simplement les attributs du contrôleur de navigation sur le storyboard.

Cette approche peut également être utilisée pour gérer la couleur du texte de la barre de navigation à partir du storyboard:

@IBInspectable var barTextColor: UIColor? {
  set {
    guard let uiColor = newValue else {return}
    navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: uiColor]
  }
  get {
    guard let textAttributes = navigationBar.titleTextAttributes else { return nil }
    return textAttributes[NSAttributedStringKey.foregroundColor] as? UIColor
  }
}

Swift 4:

Code fonctionnant parfaitement pour changer l'apparence de la barre de navigation au niveau de l'application.

// MARK: Navigation Bar Customisation

// To change background colour.
UINavigationBar.appearance().barTintColor = .init(red: 23.0/255, green: 197.0/255, blue: 157.0/255, alpha: 1.0)

// To change colour of tappable items.
UINavigationBar.appearance().tintColor = .white

// To apply textAttributes to title i.e. colour, font etc.
UINavigationBar.appearance().titleTextAttributes = [.foregroundColor : UIColor.white,
                                                    .font : UIFont.init(name: "AvenirNext-DemiBold", size: 22.0)!]
// To control navigation bar's translucency.
UINavigationBar.appearance().isTranslucent = false

Codage heureux!

UINavigationBar.appearance().barTintColor

travaillé pour moi

SWIFT 4 - Transition en douceur (meilleure solution):

Si vous revenez d'un contrôleur de navigation et que vous devez définir une couleur différente sur le contrôleur de navigation que vous avez poussé, vous souhaitez utiliser

override func willMove(toParentViewController parent: UIViewController?) {
    navigationController?.navigationBar.barTintColor = .white
    navigationController?.navigationBar.tintColor = Constants.AppColor
}

au lieu de le placer dans la vueWillAppear pour que la transition soit plus nette.

SWIFT 4.2

override func willMove(toParent parent: UIViewController?) {
    navigationController?.navigationBar.barTintColor = UIColor.black
    navigationController?.navigationBar.tintColor = UIColor.black
}

Dans Swift 4

Vous pouvez changer la couleur de la barre de navigation. Utilisez simplement cet extrait de code ci-dessous dansviewDidLoad()

Couleur de la barre de navigation

self.navigationController?.navigationBar.barTintColor = UIColor.white

Couleur du texte de la barre de navigation

self.navigationController?.navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.purple]

Pour la barre de navigation des grands titres iOS 11 , vous devez utiliser la largeTitleTextAttributespropriété

self.navigationController?.navigationBar.largeTitleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.purple]

La appearance()fonction ne fonctionne pas toujours pour moi. Je préfère donc créer un objet CN et changer ses attributs.

var navBarColor = navigationController!.navigationBar
navBarColor.barTintColor =
    UIColor(red:  255/255.0, green: 0/255.0, blue: 0/255.0, alpha: 100.0/100.0)
navBarColor.titleTextAttributes =
    [NSForegroundColorAttributeName: UIColor.whiteColor()]

De plus, si vous souhaitez ajouter une image au lieu de simplement du texte, cela fonctionne aussi

var imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 70, height: 70))
imageView.contentMode = .ScaleAspectFit

var image = UIImage(named: "logo")
imageView.image = image
navigationItem.titleView = imageView

Utilisez l'API d'apparence et la couleur barTintColor.

UINavigationBar.appearance().barTintColor = UIColor.greenColor()

iOS 8 (rapide)

let font: UIFont = UIFont(name: "fontName", size: 17)   
let color = UIColor.backColor()
self.navigationController?.navigationBar.topItem?.backBarButtonItem?.setTitleTextAttributes([NSFontAttributeName: font,NSForegroundColorAttributeName: color], forState: .Normal)

Si vous avez un contrôleur de navigation personnalisé, vous pouvez utiliser l'extrait de code ci-dessus. Donc, dans mon cas, j'ai utilisé comme morceaux de code suivants.

Swift 3.0, version XCode 8.1

navigationController.navigationBar.barTintColor = UIColor.green

Texte de la barre de navigation:

navigationController.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.orange]

Ce sont des discussions très utiles.

Mise à jour Swift 4, iOS 12 et Xcode 10

Il suffit de mettre une ligne à l'intérieur viewDidLoad()

navigationController?.navigationBar.barTintColor = UIColor.red

Dans Swift 2

Pour changer la couleur dans la barre de navigation,

navigationController?.navigationBar.barTintColor = UIColor.whiteColor()

Pour changer la couleur dans la barre de navigation des éléments,

navigationController?.navigationBar.tintColor = UIColor.blueColor()

ou

navigationController!.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.blueColor()]

Swift 3

UINavigationBar.appearance().barTintColor = UIColor(colorLiteralRed: 51/255, green: 90/255, blue: 149/255, alpha: 1)

Cela définira la couleur de votre barre de navigation comme la couleur de la barre Facebook :)

Xcode 9 compatible avec Swift 3 et Swift 4

Une meilleure solution pour créer une classe pour les barres de navigation courantes

J'ai 5 contrôleurs et chaque titre de contrôleur est changé en couleur orange. Comme chaque contrôleur dispose de 5 contrôleurs de navigation, j'ai donc dû changer chaque couleur soit de l'inspecteur, soit du code.

J'ai donc créé une classe au lieu de changer chaque barre de navigation à partir du code, j'assigne simplement cette classe et cela a fonctionné sur les 5 capacités de réutilisation du code du contrôleur. Vous n'avez qu'à assigner cette classe à chaque contrôleur et c'est tout.

import UIKit

   class NabigationBar: UINavigationBar {
      required init?(coder aDecoder: NSCoder) {
       super.init(coder: aDecoder)
    commonFeatures()
 }

   func commonFeatures() {

    self.backgroundColor = UIColor.white;
      UINavigationBar.appearance().titleTextAttributes =     [NSAttributedStringKey.foregroundColor:ColorConstants.orangeTextColor]

 }


  }

iOS 10 Swift 3.0

Si cela ne vous dérange pas d'utiliser des cadres rapides, utilisez-nous UINeraida pour changer l'arrière-plan de navigation en UIColorou HexColorou UIImageet changer le texte du bouton de navigation par programme, changez la couleur du texte de fond .

Pour UINavigationBar

    neraida.navigation.background.color.hexColor("54ad00", isTranslucent: false, viewController: self)
    
    //Change navigation title, backbutton colour
    
    neraida.navigation.foreground.color.uiColor(UIColor.white, viewController: self)
    
    //Change navigation back button title programmatically
    
    neraida.navigation.foreground.backButtonTitle("Custom Title", ViewController: self)
    
    //Apply Background Image to the UINavigationBar
    
    neraida.navigation.background.image("background", edge: (0,0,0,0), barMetrics: .default, isTranslucent: false, viewController: self)

Swift 3

Une doublure simple que vous pouvez utiliser ViewDidLoad()

//Change Color
    self.navigationController?.navigationBar.barTintColor = UIColor.red
//Change Text Color
    self.navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.white]

Cette version supprime également la ligne d'ombre 1px sous la barre de navigation:

Swift 5: Mettez cela dans votre AppDelegate didFinishLaunchingWithOptions

UINavigationBar.appearance().barTintColor = UIColor.black
UINavigationBar.appearance().tintColor = UIColor.white
UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
UINavigationBar.appearance().isTranslucent = false
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .any, barMetrics: .default)
UINavigationBar.appearance().shadowImage = UIImage()

je devais faire

UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UINavigationBar.appearance().barStyle = .Black
UINavigationBar.appearance().backgroundColor = UIColor.blueColor()

sinon la couleur d'arrière-plan ne changerait pas

Définissez d'abord la propriété isTranslucent de navigationBar sur false pour obtenir la couleur souhaitée. Modifiez ensuite la couleur de la barre de navigation comme ceci:

@IBOutlet var NavigationBar: UINavigationBar!

NavigationBar.isTranslucent = false
NavigationBar.barTintColor = UIColor (red: 117/255, green: 23/255, blue: 49/255, alpha: 1.0)

Assurez-vous de définir l' état du bouton pour .normal

extension UINavigationBar {

    func makeContent(color: UIColor) {
        let attributes: [NSAttributedString.Key: Any]? = [.foregroundColor: color]

        self.titleTextAttributes = attributes
        self.topItem?.leftBarButtonItem?.setTitleTextAttributes(attributes, for: .normal)
        self.topItem?.rightBarButtonItem?.setTitleTextAttributes(attributes, for: .normal)
    }
}

PS iOS 12, Xcode 10.1

appelez simplement cette extension et passez la couleur, cela changera automatiquement la couleur de la barre de navigation

extension UINavigationController {

     func setNavigationBarColor(color : UIColor){
            self.navigationBar.barTintColor = color
        }
    }

dans la vue didload ou dans la vue apparaîtra l'appel

self.navigationController? .setNavigationBarColor (couleur: <# T ## UIColor #>)

Essayez ceci dans AppDelegate:

//MARK:- ~~~~~~~~~~setupApplicationUIAppearance Method
func setupApplicationUIAppearance() {

    UIApplication.shared.statusBarView?.backgroundColor = UIColor.clear

    var preferredStatusBarStyle: UIStatusBarStyle {
        return .lightContent
    }

    UINavigationBar.appearance().tintColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
    UINavigationBar.appearance().barTintColor =  UIColor.white
    UINavigationBar.appearance().isTranslucent = false

    let attributes: [NSAttributedString.Key: AnyObject]

    if DeviceType.IS_IPAD{
        attributes = [
            NSAttributedString.Key.foregroundColor: UIColor.white,
            NSAttributedString.Key.font: UIFont(name: "HelveticaNeue", size: 30)
            ] as [NSAttributedString.Key : AnyObject]
    }else{
        attributes = [
            NSAttributedString.Key.foregroundColor: UIColor.white
        ]
    }
    UINavigationBar.appearance().titleTextAttributes = attributes
}

iOS 13

func setupNavigationBar() {
    //        if #available(iOS 13, *) {
    //            let window = UIApplication.shared.windows.filter {$0.isKeyWindow}.first
    //            let statusBar = UIView(frame: window?.windowScene?.statusBarManager?.statusBarFrame ?? CGRect.zero)
    //            statusBar.backgroundColor = #colorLiteral(red: 0.2784313725, green: 0.4549019608, blue: 0.5921568627, alpha: 1) //UIColor.init(hexString: "#002856")
    //            //statusBar.tintColor = UIColor.init(hexString: "#002856")
    //            window?.addSubview(statusBar)
    //            UINavigationBar.appearance().tintColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
    //            UINavigationBar.appearance().barTintColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
    //            UINavigationBar.appearance().isTranslucent = false
    //            UINavigationBar.appearance().backgroundColor = #colorLiteral(red: 0.2784313725, green: 0.4549019608, blue: 0.5921568627, alpha: 1)
    //            UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.white]
    //        }
    //        else
    //        {
    UIApplication.shared.statusBarView?.backgroundColor = #colorLiteral(red: 0.2784313725, green: 0.4549019608, blue: 0.5921568627, alpha: 1)
    UINavigationBar.appearance().tintColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
    UINavigationBar.appearance().barTintColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
    UINavigationBar.appearance().isTranslucent = false
    UINavigationBar.appearance().backgroundColor = #colorLiteral(red: 0.2784313725, green: 0.4549019608, blue: 0.5921568627, alpha: 1)
    UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.white]
    //        }
}

Extensions

extension UIApplication {

var statusBarView: UIView? {
    if responds(to: Selector(("statusBar"))) {
        return value(forKey: "statusBar") as? UIView
    }
    return nil
}}

J'écris ceci pour ceux qui ont encore des problèmes avec les solutions ici.

J'utilise Xcode version 11.4 (11E146). Celui qui travaille pour moi est:

navigationController?.navigationBar.barTintColor = UIColor.white
navigationController?.navigationBar.tintColor = UIColor.black

MAIS !, si vous définissez le barTintColor dans le storyboard sur une autre valeur que "par défaut", ces 2 lignes de code n'auront aucun effet.

Donc, soyez prudent et revenez à barTintColor par défaut dans Storyboard. Oh Apple ...

Ajoutez ces lignes à votre AppDelegate dans la fonction didFinishLaunchingWithOptions:

cette ligne est pour l'arrière-plan de votre barre de navigation.

UINavigationBar.appearance().barTintColor = .orange

cette ligne est si votre pas est translucide à faux, il affichera une couleur blanche lors de la navigation.

UINavigationBar.appearance().tintColor = .white

cette ligne est pour vos textes et icônes sur la barre de navigation

UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor: Styles.textFirstColor]

cette ligne nous pour tout descendre dans votre barre de navigation.

UINavigationBar.appearance().isTranslucent = false