在 Swift 中更改导航栏颜色
我正在使用 Picker View 来允许用户为整个应用程序选择颜色主题。
我计划更改导航栏、背景的颜色，可能还有标签栏（如果可能的话）。
我一直在研究如何做到这一点，但找不到任何 Swift 示例。谁能给我一个我需要用来更改导航栏颜色和导航栏文本颜色的代码示例？
选择器视图已设置，我只是在寻找更改 UI 颜色的代码。
导航栏：
navigationController?.navigationBar.barTintColor = UIColor.green
用您想要的任何 UIColor 替换 greenColor，如果您愿意，也可以使用 RGB。
导航栏文本：
navigationController?.navigationBar.titleTextAttributes = [.foregroundColor: UIColor.orange]
用你喜欢的任何颜色替换 orangeColor。
标签栏：
tabBarController?.tabBar.barTintColor = UIColor.brown
标签栏文本：
tabBarController?.tabBar.tintColor = UIColor.yellow
在最后两个上，将 brownColor 和 yellowColor 替换为您选择的颜色。
以下是一些非常基本的外观自定义，您可以在应用范围内应用它们：
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();
斯威夫特 5.4.2：
UINavigationBar.appearance().backgroundColor = .green // backgorund color with gradient
// or
UINavigationBar.appearance().barTintColor = .green // solid color
UIBarButtonItem.appearance().tintColor = .magenta
UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.blue]
UITabBar.appearance().barTintColor = .yellow
关于 Swift 中的 UIAppearance API 的更多信息，您可以阅读 here。
为 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
斯威夫特 4
UINavigationBar.appearance().barTintColor = .black
UINavigationBar.appearance().tintColor = .white
UINavigationBar.appearance().titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.white]
UINavigationBar.appearance().isTranslucent = false
斯威夫特 4.2、5+
UINavigationBar.appearance().barTintColor = .black
UINavigationBar.appearance().tintColor = .white
UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
UINavigationBar.appearance().isTranslucent = false
如果您想使用大标题，请添加以下行：
UINavigationBar.navigationBar.prefersLargeTitles = true
也可以在这里查看：https://github.com/hasnine/iOSUtilitiesSource
UINavigationBar.appearance().prefersLargeTitles = true上加上大标题后这不起作用，我可以知道如何解决它吗？
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()]
只需将此行粘贴到代码中的 didFinishLaunchingWithOptions 中即可。
在 AppDelegate 中，这已全局更改了 NavBar 的格式并删除了底线/边框（这是大多数人的问题区域），以提供我认为您和其他人正在寻找的内容：
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()] }
然后您可以设置一个 Constants.swift 文件，其中包含一个带有颜色和字体等的 Style 结构。然后您可以将 tableView/pickerView 添加到任何 ViewController 并使用“availableThemes”数组来允许用户更改主题颜色。
关于这一点的美妙之处在于，您可以在整个应用程序中为每种颜色使用一个引用，它会根据用户选择的“主题”进行更新，没有它默认为 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) } ...
在情节提要上执行此操作（Interface Builder Inspector）
在 IBDesignable 的帮助下，我们可以为 UINavigationController 添加更多选项到 Interface Builder Inspector 并在情节提要上调整它们。首先，将以下代码添加到您的项目中。
@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
}
}
}
然后只需在故事板上设置导航控制器的属性。
https://i.stack.imgur.com/8QSnA.gif
此方法还可用于管理故事板中导航栏文本的颜色：
@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
}
}
斯威夫特 4：
在应用程序级别更改导航栏外观的完美工作代码。
https://i.stack.imgur.com/rSnvn.png
// 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
快乐编码！
UINavigationBar.appearance().barTintColor
为我工作
SWIFT 4 - 平滑过渡（最佳解决方案）：
如果您要从导航控制器返回，并且您必须在要使用的导航控制器上设置不同的颜色
override func willMove(toParentViewController parent: UIViewController?) {
navigationController?.navigationBar.barTintColor = .white
navigationController?.navigationBar.tintColor = Constants.AppColor
}
而不是将其放在 viewWillAppear 中，因此过渡更清晰。
斯威夫特 4.2
override func willMove(toParent parent: UIViewController?) {
navigationController?.navigationBar.barTintColor = UIColor.black
navigationController?.navigationBar.tintColor = UIColor.black
}
以下代码适用于 iOS 15
if #available(iOS 15, *) {
// Navigation Bar background color
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = UIColor.yourColor
// setup title font color
let titleAttribute = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 25, weight: .bold), NSAttributedString.Key.foregroundColor: UIColor.yourColor]
appearance.titleTextAttributes = titleAttribute
navigationController?.navigationBar.standardAppearance = appearance
navigationController?.navigationBar.scrollEdgeAppearance = appearance
}
在斯威夫特 4
您可以更改导航栏的颜色。只需在 viewDidLoad() 中使用以下代码片段
导航栏颜色
self.navigationController?.navigationBar.barTintColor = UIColor.white
导航栏文字颜色
self.navigationController?.navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.purple]
对于 iOS 11 大标题导航栏，您需要使用 largeTitleTextAttributes 属性
self.navigationController?.navigationBar.largeTitleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.purple]
appearance() 函数并不总是对我有用。所以我更喜欢创建一个 NC 对象并更改其属性。
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()]
此外，如果您想添加图像而不仅仅是文本，那也可以
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
Swift 5，一种带有 UINavigationController 扩展的简单方法。此答案的底部是扩展和预览。
第一个视图控制器（主页）：
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setTintColor(.white)
navigationController?.backgroundColor(.orange)
}
第二个视图控制器（详细信息）：
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.transparentNavigationBar()
navigationController?.setTintColor(.black)
}
UINavigationController 的扩展：
extension UINavigationController {
func transparentNavigationBar() {
self.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.isTranslucent = true
}
func setTintColor(_ color: UIColor) {
self.navigationBar.titleTextAttributes = [NSAttributedString.Key.foregroundColor: color]
self.navigationBar.tintColor = color
}
func backgroundColor(_ color: UIColor) {
navigationBar.setBackgroundImage(nil, for: .default)
navigationBar.barTintColor = color
navigationBar.shadowImage = UIImage()
}
}
故事板视图：
https://i.stack.imgur.com/mSbq4.png
预览：
https://i.stack.imgur.com/K4q5m.gif
使用外观 API 和 barTintColor 颜色。
UINavigationBar.appearance().barTintColor = UIColor.greenColor()
斯威夫特 5 (iOS 14)
完整的导航栏自定义。
// -----------------------------------------------------------
// NAVIGATION BAR CUSTOMIZATION
// -----------------------------------------------------------
self.navigationController?.navigationBar.prefersLargeTitles = true
self.navigationController?.navigationBar.tintColor = UIColor.white
self.navigationController?.navigationBar.isTranslucent = false
if #available(iOS 13.0, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithDefaultBackground()
appearance.backgroundColor = UIColor.blue
appearance.largeTitleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
appearance.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
navigationController?.navigationBar.standardAppearance = appearance
navigationController?.navigationBar.scrollEdgeAppearance = appearance
navigationController?.navigationBar.compactAppearance = appearance
} else {
self.navigationController?.navigationBar.barTintColor = UIColor.blue
self.navigationController?.navigationBar.largeTitleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
self.navigationController?.navigationBar.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
}
// -----------------------------------------------------------
// NAVIGATION BAR SHADOW
// -----------------------------------------------------------
self.navigationController?.navigationBar.layer.masksToBounds = false
self.navigationController?.navigationBar.layer.shadowColor = UIColor.black.cgColor
self.navigationController?.navigationBar.layer.shadowOffset = CGSize(width: 0, height: 2)
self.navigationController?.navigationBar.layer.shadowRadius = 15
self.navigationController?.navigationBar.layer.shadowOpacity = 0.7
这个版本还去掉了导航栏下的 1px 阴影线：
Swift 5：把它放在你的 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()
iOS 8（迅捷）
let font: UIFont = UIFont(name: "fontName", size: 17)
let color = UIColor.backColor()
self.navigationController?.navigationBar.topItem?.backBarButtonItem?.setTitleTextAttributes([NSFontAttributeName: font,NSForegroundColorAttributeName: color], forState: .Normal)
如果您有自定义导航控制器，您可以使用上面的代码片段。所以就我而言，我使用了以下代码片段。
Swift 3.0、XCode 8.1 版本
navigationController.navigationBar.barTintColor = UIColor.green
导航栏文本：
navigationController.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.orange]
这是非常有帮助的谈话。
Swift 4、iOS 12 和 Xcode 10 更新
只需在 viewDidLoad() 中添加一行
navigationController?.navigationBar.barTintColor = UIColor.red
在 iOS 15 中，UIKit 将默认情况下会产生透明背景的 scrollEdgeAppearance 的使用扩展到所有导航栏。设置 scrollEdgeAppearance 如下代码。
if #available(iOS 15, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = < your tint color >
navigationController?.navigationBar.standardAppearance = appearance;
navigationController?.navigationBar.scrollEdgeAppearance = navigationController?.navigationBar.standardAppearance
}
在斯威夫特 2
要更改导航栏中的颜色，
navigationController?.navigationBar.barTintColor = UIColor.whiteColor()
要更改项目导航栏中的颜色，
navigationController?.navigationBar.tintColor = UIColor.blueColor()
或者
navigationController!.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.blueColor()]
斯威夫特 3
UINavigationBar.appearance().barTintColor = UIColor(colorLiteralRed: 51/255, green: 90/255, blue: 149/255, alpha: 1)
这会将您的导航栏颜色设置为 Facebook 栏颜色 :)
斯威夫特 3
您可以在 ViewDidLoad() 中使用的简单的一种衬里
//Change Color
self.navigationController?.navigationBar.barTintColor = UIColor.red
//Change Text Color
self.navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.white]
Swift 3 和 Swift 4 兼容 Xcode 9
一个更好的解决方案，为常见的导航栏创建一个类
我有 5 个控制器，每个控制器标题都更改为橙色。由于每个控制器都有 5 个导航控制器，所以我不得不从检查员或代码中更改每一种颜色。
所以我创建了一个类，而不是从代码中更改每个导航栏，我只是分配了这个类，它适用于所有 5 个控制器代码重用能力。您只需将此类分配给每个控制器即可。
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 斯威夫特 3.0
如果您不介意使用 swift 框架，那么我们 UINeraida 将导航背景更改为 UIColor 或 HexColor 或 UIImage 并以编程方式更改导航返回按钮文本，更改完整的前景文本颜色。
对于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)
我必须做
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UINavigationBar.appearance().barStyle = .Black
UINavigationBar.appearance().backgroundColor = UIColor.blueColor()
否则背景颜色不会改变
首先将 navigationBar 的 isTranslucent 属性设置为 false 以获得所需的颜色。然后像这样更改导航栏颜色：
@IBOutlet var NavigationBar: UINavigationBar!
NavigationBar.isTranslucent = false
NavigationBar.barTintColor = UIColor (red: 117/255, green: 23/255, blue: 49/255, alpha: 1.0)
确保为 .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
topItem 解决方案的几个小时。令人沮丧的是，Apple 继续对如何将样式应用于导航进行更改。
在 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]
// }
}
扩展
extension UIApplication {
var statusBarView: UIView? {
if responds(to: Selector(("statusBar"))) {
return value(forKey: "statusBar") as? UIView
}
return nil
}}
我正在为那些仍然对这里的解决方案有问题的人写这篇文章。
我正在使用 Xcode 版本 11.4 (11E146)。为我工作的是：
navigationController?.navigationBar.barTintColor = UIColor.white
navigationController?.navigationBar.tintColor = UIColor.black
但是！，如果您将情节提要中的 barTintColor 设置为“默认”以外的任何其他值，则这 2 行代码将无效。
因此，请小心并在 Storyboard 中设置回默认的 barTintColor。哦，苹果...
关注公众号
不定期副业成功案例分享
