Change colour of unselected Tab Bar Icon in swift [duplicate] - ios

Question

Environment:
- Xcode 6 beta 4
- Swift language
- iOS Tabbed Application (default xCode project)
How can I change the default grey color of the tabs to something else? (Preferably globally)
As far as my research goes I need to somehow change the image rendering mode for each tab to Original rendering mode however I don't know how

Answer 1

Each (default) tab bar item consists of text and icon. It is pretty easy to change the text colors globally by specifying the appearance:
// you can add this code to you AppDelegate application:didFinishLaunchingWithOptions:
// or add it to viewDidLoad method of your TabBarController class
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.magentaColor()], forState:.Normal)
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.redColor()], forState:.Selected)
With images situation is a little bit more complicated. You cannot define their appearance globally. You should redefine them in your TabBarController class. Add code bellow to viewDidLoad method of your TabBarController class:
for item in self.tabBar.items as [UITabBarItem] {
if let image = item.image {
item.image = image.imageWithColor(UIColor.yellowColor()).imageWithRenderingMode(.AlwaysOriginal)
}
}
As we know there is no imageWithColor(...) method in UIImage class. So here is the extension implementation:
// Add anywhere in your app
extension UIImage {
func imageWithColor(tintColor: UIColor) -> UIImage {
UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
let context = UIGraphicsGetCurrentContext() as CGContextRef
CGContextTranslateCTM(context, 0, self.size.height)
CGContextScaleCTM(context, 1.0, -1.0);
CGContextSetBlendMode(context, .Normal)
let rect = CGRectMake(0, 0, self.size.width, self.size.height) as CGRect
CGContextClipToMask(context, rect, self.CGImage)
tintColor.setFill()
CGContextFillRect(context, rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext() as UIImage
UIGraphicsEndImageContext()
return newImage
}
}
imageWithColor was borrowed from this answer: https://stackoverflow.com/a/24545102/3050466

Answer 2

I don't have enough reputation for commenting the comments, but many are interested how to change the color of selected image
just add another if let check after
if let image = item.image
just like this:
if let selectedImage = item.selectedImage {
item.selectedImage = selectedImage.imageWithColor(UIColor.yellowColor()).imageWithRenderingMode(.AlwaysOriginal)
}
this solved the problem perfectly.
And a little addition, since Swift 1.2 and Xcode 6.3.2 you need
for item in self.tabBar.items as! [UITabBarItem]
instead of
for item in self.tabBar.items as [UITabBarItem]
Hope that helps!

Answer 3

Swift 2.0
To change the default color for tab bar images, Add code bellow to viewDidLoad method of your TabBarController class:
for item in self.tabBar.items! as [UITabBarItem] {
if let image = item.image {
item.image = image.imageWithColor(UIColor.yellowColor()).imageWithRenderingMode(.AlwaysOriginal)
}
}
Update the imageWithColor extension. Used with the above method and should be placed outside of your TabBarController class:
extension UIImage {
func imageWithColor(tintColor: UIColor) -> UIImage {
UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
let context = UIGraphicsGetCurrentContext()! as CGContextRef
CGContextTranslateCTM(context, 0, self.size.height)
CGContextScaleCTM(context, 1.0, -1.0);
CGContextSetBlendMode(context, CGBlendMode.Normal)
let rect = CGRectMake(0, 0, self.size.width, self.size.height) as CGRect
CGContextClipToMask(context, rect, self.CGImage)
tintColor.setFill()
CGContextFillRect(context, rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext() as UIImage
UIGraphicsEndImageContext()
return newImage
}
}
No changes to the way text gets coloured but just for reference. Also should be added the code bellow to viewDidLoad:
// you can add this code to you AppDelegate application:didFinishLaunchingWithOptions:
// or add it to viewDidLoad method of your TabBarController class
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.magentaColor()], forState:.Normal)
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.redColor()], forState:.Selected)

Answer 4

Swift 3.0
To change the default color for tab bar images, Add code bellow to viewDidLoad method of your TabBarController class:
for item in self.tabBar.items! as [UITabBarItem] {
if let image = item.image {
item.image = image.imageWithColor(tintColor: UIColor.yellow).withRenderingMode(.alwaysOriginal)
}
}
Update the imageWithColor extension. Used with the above method and should be placed outside of your TabBarController class:
extension UIImage {
func imageWithColor(tintColor: UIColor) -> UIImage {
UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
let context = UIGraphicsGetCurrentContext()! as CGContext
context.translateBy(x: 0, y: self.size.height)
context.scaleBy(x: 1.0, y: -1.0);
context.setBlendMode(CGBlendMode.normal)
let rect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
context.clip(to: rect, mask: self.cgImage!)
tintColor.setFill()
context.fill(rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext()! as UIImage
UIGraphicsEndImageContext()
return newImage
}
}