ios xcode xcode6 uitabbar uitabbaritem

ios - Cambiar el color seleccionado del elemento de la barra de pestañas en un guión gráfico



xcode xcode6 (14)

Quiero cambiar mis elementos de la barra de pestañas para que sean rosas cuando se seleccionen en lugar del azul predeterminado.

¿Cómo puedo lograr esto usando el editor de guiones gráficos en Xcode 6?

Aquí está mi configuración actual que no funciona, el fondo azul funciona pero el rosa no funciona:


Agregue el atributo Color de tiempo de ejecución denominado "tintColor" de StoryBoard. Esto está funcionando ( para Xcode 8 y superior ).

si desea un color no seleccionado ... también puede agregar unselectedItemTintColor .


Agregue este código en la función delegado de su aplicación -did_finish_launching_with_options

UITabBar.appearance().tintColor = UIColor( red: CGFloat(255/255.0), green: CGFloat(99/255.0), blue: CGFloat(95/255.0), alpha: CGFloat(1.0) )

pon el RGB del color requerido


De alguna manera, no podemos cambiar el color de tinte del elemento seleccionado de la barra de pestañas usando el guión gráfico solo, por lo tanto, agregué el siguiente código en mi ViewDidLoad, espero que esto ayude.

[[UITabBar appearance] setTintColor:[UIColor whiteColor]];


En Xcode8 , he cambiado el ImageTint del guión gráfico y funciona bien.

El resultado:


En Swift, usando xcode 7 (y posterior), puede agregar lo siguiente a su archivo AppDelegate.swift:

UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

Así es como se ve el método completo:

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool { // I added this line UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0) return true }

En el ejemplo anterior, mi artículo será blanco. El "/255.0" es necesario porque espera un valor de 0 a 1. Para el blanco, podría haber usado 1. Pero para otro color probablemente usará valores RGB.


Esta elegante solución funciona muy bien en SWIFT 3.0 , SWIFT 4.2 y SWIFT 5.1 :

En el guión gráfico:

  1. Seleccione su barra de pestañas
  2. Establezca un atributo de tiempo de ejecución llamado tintColor para el color deseado del icono seleccionado en la barra de pestañas
  3. Establezca un atributo de tiempo de ejecución llamado unselectedItemTintColor para el color deseado del icono no seleccionado en la barra de pestañas

Editar: Trabajar con Xcode 8, para iOS 10 y superior .


Esta es la solución en Swift 3 que funciona en iOS 10:

En primer lugar, crea su propia subclase de controlador de barra de pestañas y la agrega a su controlador de pestañas en su guión gráfico. En el método viewDidLoad() , puede personalizar la barra de pestañas. ¡Debe indicarse aquí que el atributo tintColor de tabBar representa el color del elemento seleccionado, no el color de los elementos no seleccionados! Para cambiar el color de los elementos no seleccionados, recomiendo recorrer cada elemento y usar los colores originales de sus imágenes, para que no se muestren en gris automáticamente.

class CustomTabBarVC: UITabBarController { override func viewDidLoad() { super.viewDidLoad() self.tabBar.tintColor = AppColor.normalRed self.tabBar.barTintColor = .white self.tabBar.isTranslucent = true if let items = self.tabBar.items { for item in items { if let image = item.image { item.image = image.withRenderingMode( .alwaysOriginal ) } } } } }

El único inconveniente de este enfoque es que las imágenes de sus elementos ya deben tener el color deseado al que apunta.


Esta mejor manera es cambiar el Image Tint en el guión gráfico


Puede cambiar los colores UITabBarItem por storyboard, pero si desea cambiar los colores por código, es muy fácil:

// Use esto para cambiar el color de la barra seleccionada

[[UITabBar appearance] setTintColor:[UIColor blueColor]];

// Esto para cambiar la barra no seleccionada (iOS 10)

[[UITabBar appearance] setUnselectedItemTintColor:[UIColor yellowColor]];

// Y esta línea para cambiar el color de todas las pestañas

[[UITabBar appearance] setBarTintColor:[UIColor whiteColor]];


Puede subclasificar el UITabBarController y reemplazar el que está en el guión gráfico. En su implementación viewDidLoad de la subclase, llame a esto:

[self.tabBar setTintColor:[UIColor greenColor]];


También puede establecer el color de tinte de la barra de imagen seleccionado por la ruta de la tecla:

¡¡Espero que esto te ayudará!! Gracias


XCode 8.2, iOS 10, Swift 3: ahora hay un atributo unselectedItemTintColor para tabBar :

self.tabBar.unselectedItemTintColor = UIColor(red: 0/255.0, green: 200/255.0, blue: 0/255.0, alpha: 1.0)


ponga este código en viewDidLoad del controlador de vista del que desea cambiar el color

[[UITabBar appearance] setSelectedImageTintColor:[UIColor whiteColor]];


Swift 3 | Xcode 10

Si desea que todos los elementos de la barra de pestañas sean del mismo color (seleccionados y no seleccionados) ...

Paso 1

Asegúrese de que los recursos de su imagen estén configurados para Renderizar como = Imagen de plantilla . Esto les permite heredar el color.

Paso 2

Use el editor de guiones gráficos para cambiar la configuración de la barra de pestañas de la siguiente manera:

  • Establezca la barra de pestañas: Tinte de imagen en el color que desea que herede el icono seleccionado.
  • Establezca la barra de pestañas: Tinte de barra en el color que desea que tenga la barra de pestañas.
  • Establezca Ver: tinte al color que desea ver en el editor del guión gráfico, esto no afecta el color del icono cuando se ejecuta su aplicación.

Paso 3

Los pasos 1 y 2 cambiarán el color del icono seleccionado. Si aún desea cambiar el color de los elementos no seleccionados, debe hacerlo en código. No he encontrado una manera de hacerlo a través del editor del guión gráfico.

Crear una clase de controlador de barra de pestañas personalizada ...

// TabBarController.swift class TabBarController: UITabBarController { override func viewDidLoad() { super.viewDidLoad() // make unselected icons white self.tabBar.unselectedItemTintColor = UIColor.white } }

... y asigne la clase personalizada al controlador de escena de la barra de pestañas.

Si descubre cómo cambiar el color del icono no seleccionado a través del editor del guión gráfico, avíseme. ¡Gracias!