web-dev-qa-db-fra.com

Modifier l'élément de la barre d'onglets de la couleur sélectionnée dans un storyboard

Je souhaite que les éléments de ma barre d'onglets soient en rose lorsqu'ils sont sélectionnés au lieu du bleu par défaut.

Comment puis-je accomplir cela en utilisant l'éditeur de storyboard dans Xcode 6?

Voici mes réglages actuels qui ne fonctionnent pas, le fond bleu fonctionne mais le rose ne fonctionne pas:

enter image description here

iosxcodexcode6uitabbaruitabbaritem
157
Deekor

Ajoutez un attribut de couleur d'exécution nommé "tintColor" dans StoryBoard. Cela fonctionne (pour Xcode 8 et supérieur).

si vous voulez une couleur non sélectionnée, vous pouvez aussi ajouter unselectedItemTintColor.

setting tintColor as Runtime Attribute

384
Mehul Thakkar

Cette solution élégante fonctionne très bien sur Swift 3.0 et Swift 4.0 :

Sur le storyboard:

  1. Sélectionnez votre barre d'onglets
  2. Définissez un Runtime Attibute appelé tintColor pour la couleur souhaitée du Icône sélectionnée dans la barre d’onglet
  3. Définissez un Runtime Attibute appelé unselectedItemTintColor pour la couleur souhaitée du Icône non sélectionnée dans la barre d'onglets

enter image description here

Edit: Testé avec Xcode 8, pour iOS 10 et supérieur.

153
Marcelo Gracietti

Dans Swift, en utilisant xcode 7 (et versions ultérieures), vous pouvez ajouter les éléments suivants à votre fichier AppDelegate.Swift:

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

Voici à quoi ressemble la méthode complète:

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
}

Dans l'exemple ci-dessus, mon article sera blanc. Le "/255.0" est nécessaire car il attend une valeur de 0 à 1. Pour le blanc, j'aurais pu en utiliser 1. Mais pour les autres couleurs, vous utiliserez probablement des valeurs RVB.

58
Jarrod

Sur Xcode8 j'ai changé la ImageTint du storyboard et cela fonctionne bien.

enter image description here

Le résultat:

enter image description here

44
Francisco Romero

Swift 3 | Xcode 10

Si vous voulez rendre tous les éléments de la barre d'onglets de la même couleur (sélectionnés et non sélectionnés) ...

Étape 1

Assurez-vous que vos ressources d’image sont configurées pour Render As = Image de modèle. Cela leur permet d'hériter de la couleur.

Xcode Assets

Étape 2

Utilisez l'éditeur de storyboard pour modifier les paramètres de la barre d'onglets comme suit:

  • Définissez Barre d'onglets: Teinte de l'image sur la couleur dont vous souhaitez l'héritage de l'icône sélectionnée.
  • Réglez Barre d'onglets: Barre de teinte sur la couleur que vous voulez que la barre d'onglets soit.
  • Définissez Vue: Teinter sur la couleur que vous souhaitez voir dans l'éditeur de storyboard, cela n'affectera pas la couleur de l'icône lors de l'exécution de votre application.

Xcode Storyboard Editor

Étape 3

Les étapes 1 et 2 changeront la couleur de l'icône sélectionnée. Si vous souhaitez toujours modifier la couleur des éléments non sélectionnés, vous devez le faire dans le code. Je n'ai pas trouvé le moyen de le faire via l'éditeur de storyboard.

Créez une classe de contrôleur de barre d'onglets personnalisée ...

//  TabBarController.Swift

class TabBarController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // make unselected icons white
        self.tabBar.unselectedItemTintColor = UIColor.white
    }
}

... et assignez la classe personnalisée à votre contrôleur de scène de la barre d'onglets.

Xcode Storyboard Editor

Si vous trouvez comment changer la couleur de l'icône non sélectionnée via l'éditeur de storyboard, veuillez me le faire savoir. Merci!

16
Derek Soike

placez ce code dans le viewDidLoad du contrôleur de vue dont vous voulez changer la couleur

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

XCode 8.2, iOS 10, Swift 3: il existe maintenant un attribut unselectedItemTintColor pour tabBar:

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

Vous pouvez également définir la couleur de teinte de la barre d’image sélectionnée par chemin de clé:

enter image description here

J'espère que cela vous aidera!! Merci

7
Arvind Kumar

Vous pouvez changer les couleurs UITabBarItem par storyboard, mais si vous voulez changer les couleurs par code, c'est très simple:

// Utiliser ceci pour changer la couleur de la barre sélectionnée

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

// Ceci pour changer la barre non sélectionnée (iOS 10)

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

// Et cette ligne pour changer la couleur de tous les onglets

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

Ajoutez ce code dans votre fonction délégué -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) )

mettre le RVB de la couleur requise

5
SHINTO JOSEPH

D'une manière ou d'une autre, nous ne sommes pas en mesure de modifier l'élément sélectionné de la barre d'onglets, Teinte, à l'aide du storyboard seul. C'est pourquoi j'ai ajouté le code ci-dessous dans ViewDidLoad. J'espère que cela vous aidera.

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

Voici la solution dans Swift 3 qui fonctionne dans iOS 10:

Tout d’abord, vous créez votre propre sous-classe de contrôleur de barre d’onglet et vous l’ajoutez à votre contrôleur d’onglet dans votre storyboard. Dans la méthode viewDidLoad(), vous pouvez ensuite personnaliser la barre d'onglets. Il convient de préciser ici que l'attribut tintColor de tabBar représente la couleur de l'élément sélectionné et non la couleur de l'élément non sélectionné! Afin de changer la couleur des éléments non sélectionnés, il est recommandé de parcourir chaque élément en boucle et d'utiliser les couleurs d'origine de vos images, afin qu'elles ne soient pas automatiquement rendues en gris.

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

Le seul inconvénient de cette approche est que les images de vos articles doivent déjà avoir la couleur souhaitée.

4
AndreasLukas

Ce meilleur moyen est de changer Image Tint dans le storyboard

3
Jadian

Vous pouvez sous-classer la UITabBarController et la remplacer par celle-ci dans le storyboard. Dans votre viewDidLoad implémentation de la sous-classe, appelez ceci:

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