Modification de la teinte / couleur d'arrière-plan de UITabBar

UINavigationBar et UISearchBar ont tous deux une propriété tintColor qui vous permet de changer la couleur de teinte (surprenante, je sais) de ces deux éléments. Je veux faire la même chose pour l'UITabBar dans mon application, mais j'ai trouvé maintenant un moyen de le changer de la couleur noire par défaut. Des idées?

J'ai pu le faire fonctionner en sous-classant un UITabBarController et en utilisant des classes privées:

@interface UITabBarController (private)
- (UITabBar *)tabBar;
@end

@implementation CustomUITabBarController


- (void)viewDidLoad {
    [super viewDidLoad];

    CGRect frame = CGRectMake(0.0, 0.0, self.view.bounds.size.width, 48);
    UIView *v = [[UIView alloc] initWithFrame:frame];
    [v setBackgroundColor:kMainColor];
    [v setAlpha:0.5];
    [[self tabBar] addSubview:v];
    [v release];

}
@end

iOS 5 a ajouté de nouvelles méthodes d'apparence pour personnaliser l'apparence de la plupart des éléments de l'interface utilisateur.

Vous pouvez cibler chaque instance d'un UITabBar dans votre application à l'aide du proxy d'apparence.

Pour iOS 5 + 6:

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

Pour iOS 7 et supérieur, veuillez utiliser les éléments suivants:

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

L'utilisation du proxy d'apparence modifiera toute instance de la barre d'onglets dans l'application. Pour une instance spécifique, utilisez l'une des nouvelles propriétés de cette classe:

UIColor *tintColor; // iOS 5+6
UIColor *barTintColor; // iOS 7+
UIColor *selectedImageTintColor;
UIImage *backgroundImage;
UIImage *selectionIndicatorImage;

J'ai un addendum à la réponse finale. Bien que le schéma essentiel soit correct, l'astuce consistant à utiliser une couleur partiellement transparente peut être améliorée. Je suppose que c'est uniquement pour laisser transparaître le dégradé par défaut. Oh, aussi, la hauteur de la TabBar est de 49 pixels au lieu de 48, du moins sous OS 3.

Donc, si vous avez une image 1 x 49 appropriée avec un dégradé, c'est la version de viewDidLoad que vous devez utiliser:

- (void)viewDidLoad {

    [super viewDidLoad]; 

    CGRect frame = CGRectMake(0, 0, 480, 49);
    UIView *v = [[UIView alloc] initWithFrame:frame];
    UIImage *i = [UIImage imageNamed:@"GO-21-TabBarColorx49.png"];
    UIColor *c = [[UIColor alloc] initWithPatternImage:i];
    v.backgroundColor = c;
    [c release];
    [[self tabBar] addSubview:v];
    [v release];

}

Lorsque vous utilisez simplement addSubview, vos boutons perdent leur cliquabilité, donc au lieu de

[[self tabBar] addSubview:v];

utilisation:

[[self tabBar] insertSubview:v atIndex:0];

Il n'y a pas de moyen simple de le faire, vous devez essentiellement sous-classer UITabBar et implémenter un dessin personnalisé pour faire ce que vous voulez. C'est un peu de travail pour l'effet, mais cela peut en valoir la peine. Je recommande de déposer un bogue auprès d'Apple pour l'ajouter à un futur SDK iPhone.

Voici la solution parfaite pour cela. Cela fonctionne bien avec moi pour iOS5 et iOS4.

//---- For providing background image to tabbar
UITabBar *tabBar = [tabBarController tabBar]; 

if ([tabBar respondsToSelector:@selector(setBackgroundImage:)]) {
    // ios 5 code here
    [tabBar setBackgroundImage:[UIImage imageNamed:@"image.png"]];
} 
else {
    // ios 4 code here
    CGRect frame = CGRectMake(0, 0, 480, 49);
    UIView *tabbg_view = [[UIView alloc] initWithFrame:frame];
    UIImage *tabbag_image = [UIImage imageNamed:@"image.png"];
    UIColor *tabbg_color = [[UIColor alloc] initWithPatternImage:tabbag_image];
    tabbg_view.backgroundColor = tabbg_color;
    [tabBar insertSubview:tabbg_view atIndex:0];
}

Sur iOS 7:

[[UITabBar appearance] setBarTintColor:[UIColor colorWithRed:(38.0/255.0) green:(38.0/255.0) blue:(38.0/255.0) alpha:1.0]];

Je recommande également de régler d'abord en fonction de vos envies visuelles:

[[UITabBar appearance] setBarStyle:UIBarStyleBlack];

Le style de barre place un séparateur subtil entre votre contenu d'affichage et votre barre d'onglets.

[[self tabBar] insertSubview:v atIndex:0]; fonctionne parfaitement pour moi.

pour moi, c'est très simple de changer la couleur de Tabbar comme: -

[self.TabBarController.tabBar setTintColor:[UIColor colorWithRed:0.1294 green:0.5686 blue:0.8353 alpha:1.0]];


[self.TabBarController.tabBar setTintColor:[UIColor "YOUR COLOR"];

Essaye ça!!!

 [[UITabBar appearance] setTintColor:[UIColor redColor]];
 [[UITabBar appearance] setBarTintColor:[UIColor yellowColor]];

pour juste la couleur de fond

Tabbarcontroller.tabBar.barTintColor=[UIColor redcolour];

ou ceci dans App Delegate

[[UITabBar appearance] setBackgroundColor:[UIColor blackColor]];

pour changer la couleur des icônes de désélection de la barre d'onglets

Pour iOS 10:

// this code need to be placed on home page of tabbar    
for(UITabBarItem *item in self.tabBarController.tabBar.items) {
    item.image = [item.image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
}

Au-dessus d'iOS 10:

// this need to be in appdelegate didFinishLaunchingWithOptions
[[UITabBar appearance] setUnselectedItemTintColor:[UIColor blackColor]];

Il y a quelques bonnes idées dans les réponses existantes, beaucoup fonctionnent légèrement différemment et ce que vous choisissez dépendra également des appareils que vous ciblez et du type de look que vous souhaitez obtenir. UITabBarest notoirement peu intuitif lorsqu'il s'agit de personnaliser son apparence, mais voici quelques astuces supplémentaires qui peuvent aider:

1). Si vous cherchez à vous débarrasser de la superposition brillante pour un look plus plat, faites:

tabBar.backgroundColor = [UIColor darkGrayColor]; // this will be your background
[tabBar.subviews[0] removeFromSuperview]; // this gets rid of gloss

2). Pour définir des images personnalisées sur les boutons tabBar, procédez comme suit:

for (UITabBarItem *item in tabBar.items){
    [item setFinishedSelectedImage:selected withFinishedUnselectedImage:unselected];
    [item setImageInsets:UIEdgeInsetsMake(6, 0, -6, 0)];
}

Où selectedet unselectedsont les UIImageobjets de votre choix. Si vous souhaitez qu'ils soient une couleur plate, la solution la plus simple que j'ai trouvée est de créer un UIViewavec le désiré backgroundColor, puis de le restituer en un UIImageà l'aide de QuartzCore. J'utilise la méthode suivante dans une catégorie UIViewpour obtenir un UIImageavec le contenu de la vue:

- (UIImage *)getImage {
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, NO, [[UIScreen mainScreen]scale]);
    [[self layer] renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return viewImage;
}

3) Enfin, vous souhaiterez peut-être personnaliser le style des titres des boutons. Faire:

for (UITabBarItem *item in tabBar.items){
    [item setTitleTextAttributes: [NSDictionary dictionaryWithObjectsAndKeys:
                [UIColor redColor], UITextAttributeTextColor,
                [UIColor whiteColor], UITextAttributeTextShadowColor,
                [NSValue valueWithUIOffset:UIOffsetMake(0, 1)], UITextAttributeTextShadowOffset,
                [UIFont boldSystemFontOfSize:18], UITextAttributeFont,
            nil] forState:UIControlStateNormal];
}

Cela vous permet de faire quelques ajustements, mais encore assez limités. En particulier, vous ne pouvez pas modifier librement l'emplacement du texte dans le bouton et ne pouvez pas avoir des couleurs différentes pour les boutons sélectionnés / non sélectionnés. Si vous voulez faire une mise en page de texte plus spécifique, définissez simplement UITextAttributeTextColorpour être clair et ajoutez votre texte dans les images selectedet unselectedde la partie (2).

[v setBackgroundColor ColorwithRed: Green: Blue: ];

Une autre solution (qui est un hack) est de définir l'alpha sur le tabBarController à 0,01 afin qu'il soit pratiquement invisible tout en restant cliquable. Ensuite, définissez un contrôle ImageView au bas de la pointe MainWindow avec votre image de barre d'onglets personnalisée sous le tabBarCOntroller alpha'ed. Ensuite, échangez les images, changez les couleurs ou la lumière lorsque le tabbarcontroller change de vue.

Cependant, vous perdez le «... plus» et personnalisez la fonctionnalité.

Salut J'utilise le SDK iOS 4 et j'ai pu résoudre ce problème avec seulement deux lignes de code et c'est comme ça

tBar.backgroundColor = [UIColor clearColor];
tBar.backgroundImage = [UIImage imageNamed:@"your-png-image.png"];

J'espère que cela t'aides!

if ([tabBar respondsToSelector:@selector(setBackgroundImage:)]) {
    // ios 5 code here
    [tabBar setBackgroundImage:[UIImage imageNamed:@"image.png"]];
} 
else {
    // ios 4 code here
    CGRect frame = CGRectMake(0, 0, 480, 49);
    UIView *tabbg_view = [[UIView alloc] initWithFrame:frame];
    UIImage *tabbag_image = [UIImage imageNamed:@"image.png"];
    UIColor *tabbg_color = [[UIColor alloc] initWithPatternImage:tabbag_image];
    tabbg_view.backgroundColor = tabbg_color;
    [tabBar insertSubview:tabbg_view atIndex:0];
}

Réponse Swift 3.0: (de Vaibhav Gaikwad)

Pour changer la couleur des icônes de désélection de la barre d'onglets:

if #available(iOS 10.0, *) {
        UITabBar.appearance().unselectedItemTintColor = UIColor.white
    } else {
        // Fallback on earlier versions
        for item in self.tabBar.items! {
            item.image = item.image?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
        }
}

Pour changer la couleur du texte uniquement:

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.white], for: .normal)

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.red, for: .selected)

Swift 3 en utilisant l'apparence de votre AppDelegatefaites ce qui suit:

UITabBar.appearance().barTintColor = your_color