Zmiana koloru paska nawigacji w Swift

Korzystam z widoku próbnika, aby umożliwić użytkownikowi wybór motywu kolorów dla całej aplikacji.

Planuję zmienić kolor paska nawigacji, tła i ewentualnie paska kart (jeśli to możliwe).

Badam, jak to zrobić, ale nie mogę znaleźć żadnych szybkich przykładów. Czy ktoś mógłby podać przykład kodu, którego musiałbym użyć, aby zmienić kolor paska nawigacji i kolor tekstu paska nawigacji?

Widok selektora jest skonfigurowany, szukam tylko kodu do zmiany kolorów interfejsu użytkownika.

Pasek nawigacyjny:

navigationController?.navigationBar.barTintColor = UIColor.green

Zamień greenColor na dowolny UIColor, którego chcesz, możesz także użyć RGB, jeśli wolisz.

Tekst paska nawigacji:

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

Zamień orangeColor na dowolny kolor.

Pasek kart:

tabBarController?.tabBar.barTintColor = UIColor.brown

Tekst paska kart:

tabBarController?.tabBar.tintColor = UIColor.yellow

W dwóch ostatnich zamień brownColor i yellowColor na wybrany przez siebie kolor.

Oto kilka bardzo podstawowych dostosowań wyglądu, które można zastosować w całej aplikacji:

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();

Więcej informacji o UIAppearanceAPI w Swift można przeczytać tutaj: https://developer.apple.com/documentation/uikit/uiappearance

Zaktualizowano dla 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

Szybki 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

Można również sprawdzić tutaj: 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()]

Po prostu wklej ten wiersz didFinishLaunchingWithOptionsdo swojego kodu.

W ramach AppDelegate globalnie zmienił format paska nawigacyjnego i usuwa dolną linię / granicę (która jest problemem dla większości osób), aby dać ci to, czego myślę, że ty i inni szukasz:

 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()] }

Następnie możesz ustawić plik Constants.swift , a zawarta jest struktura Style z kolorami i czcionkami itp. Następnie możesz dodać tableView / pickerView do dowolnego ViewController i użyć tablicy „availableThemes”, aby umożliwić użytkownikowi zmianę themeColor.

Piękną rzeczą jest to, że możesz użyć jednego odwołania w całej aplikacji dla każdego koloru i zaktualizuje się ono na podstawie wybranego przez użytkownika „Motywu”, a bez niego domyślnie będzie to 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) } ...

Aby to zrobić w scenorysie (Inspektor konstruktora interfejsów)

Za pomocą IBDesignablemożemy dodać więcej opcji do Inspektora konstruktora interfejsów UINavigationControlleri dostosować je w serii ujęć. Najpierw dodaj następujący kod do swojego projektu.

@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
        }
    }
}

Następnie po prostu ustaw atrybuty kontrolera nawigacji w serii ujęć.

To podejście można również zastosować do zarządzania kolorem tekstu paska nawigacyjnego z serii ujęć:

@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:

Doskonale działający kod do zmiany wyglądu paska nawigacji na poziomie aplikacji.

// 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

Happy Coding!

UINavigationBar.appearance().barTintColor

pracował dla mnie

SWIFT 4 - Płynne przejście (najlepsze rozwiązanie):

Jeśli cofasz się z kontrolera nawigacyjnego i musisz ustawić inny kolor na kontrolerze nawigacyjnym, z którego chcesz wypchnąć

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

zamiast umieszczać go w widoku WillAppear, aby przejście było czystsze.

SWIFT 4.2

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

W Swift 4

Możesz zmienić kolor paska nawigacji. Po prostu użyj tego fragmentu kodu wviewDidLoad()

Kolor paska nawigacji

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

Kolor tekstu paska nawigacji

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

W przypadku paska nawigacji dużego tytułu w systemie iOS 11 należy użyć largeTitleTextAttributeswłaściwości

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

Ta appearance()funkcja nie zawsze działa dla mnie. Wolę więc utworzyć obiekt NC i zmienić jego atrybuty.

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()]

Działa to również, jeśli chcesz dodać obraz zamiast samego tekstu

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

Użyj interfejsu API wyglądu i koloru barTintColor.

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

iOS 8 (szybki)

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

Jeśli masz spersonalizowany kontroler nawigacji, możesz użyć powyższego fragmentu kodu. Więc w moim przypadku użyłem następujących elementów kodu.

Swift 3.0, wersja XCode 8.1

navigationController.navigationBar.barTintColor = UIColor.green

Tekst paska nawigacji:

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

To bardzo pomocne rozmowy.

Aktualizacja Swift 4, iOS 12 i Xcode 10

Wystarczy umieścić jedną linię w środku viewDidLoad()

navigationController?.navigationBar.barTintColor = UIColor.red

W Swift 2

Aby zmienić kolor na pasku nawigacyjnym,

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

Aby zmienić kolor na pasku nawigacji elementów,

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

lub

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

Szybki 3

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

Spowoduje to ustawienie koloru paska nawigacji jak kolor paska Facebooka :)

Xcode 9 kompatybilny z Swift 3 i Swift 4

Lepsze rozwiązanie, aby stworzyć klasę dla popularnych pasków nawigacyjnych

Mam 5 kontrolerów, a każdy tytuł kontrolera zmienia się na pomarańczowy. Ponieważ każdy kontroler ma 5 kontrolerów nawigacyjnych, musiałem zmienić każdy kolor z poziomu inspektora lub kodu.

Stworzyłem więc klasę zamiast zmieniać każdy pasek nawigacji z kodu, po prostu przypisałem tę klasę i działała na wszystkich 5 kontrolerach Możliwość ponownego użycia kodu. Musisz tylko przypisać tę klasę do każdego kontrolera i tyle.

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

Jeśli nie masz nic przeciwko używaniu szybkich ram, to my, UINeraida, zmieniamy tło nawigacji jako UIColorlub HexColorlub UIImagei programowo zmieniamy tekst przycisku nawigacyjnego wstecz, zmieniamy kompletny kolor tekstu forground.

Dla 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)

Szybki 3

Prosta jedna wkładka, w której możesz użyć ViewDidLoad()

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

Ta wersja usuwa również linię cienia 1px pod paskiem nawigacji:

Swift 5: Umieść to w swojej aplikacjiDelegate 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()

musiałem zrobić

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

w przeciwnym razie kolor tła nie zmieni się

Najpierw ustaw właściwość isTranslucent parametru navigationBar na false, aby uzyskać żądany kolor. Następnie zmień kolor paska nawigacji w następujący sposób:

@IBOutlet var NavigationBar: UINavigationBar!

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

Upewnij się, że ustawiłeś stan przycisku na .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

wystarczy wywołać to rozszerzenie i przekazać kolor, który automatycznie zmieni kolor paska nawigacyjnego

extension UINavigationController {

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

w widoku nie załadowano lub w widoku pojawi się połączenie

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

Wypróbuj w 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]
    //        }
}

Rozszerzenia

extension UIApplication {

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

Piszę to dla tych, którzy nadal mają problemy z rozwiązaniami tutaj.

Używam Xcode w wersji 11.4 (11E146). Dla mnie działa:

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

ALE !, jeśli ustawisz barTintColor w serii ujęć na wartość inną niż „domyślna”, te 2 wiersze kodu nie przyniosą efektu.

Bądź więc ostrożny i przywróć domyślny barTintColor w Storyboard. Oh Apple ...

Dodaj te wiersze do AppDelegate wewnątrz funkcji didFinishLaunchingWithOptions:

ta linia służy do tła paska nawigacji.

UINavigationBar.appearance().barTintColor = .orange

ta linia jest, jeśli nie jest przezroczysty na false, pokaże biały kolor podczas nawigacji.

UINavigationBar.appearance().tintColor = .white

ten wiersz dotyczy tekstów i ikon na pasku nawigacyjnym

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

linia ta pozwala nam sprowadzić wszystko do paska nawigacji.

UINavigationBar.appearance().isTranslucent = false