Modifica del colore di tinta / sfondo di UITabBar

UINavigationBar e UISearchBar hanno entrambi una proprietà tintColor che ti consente di modificare il colore della tinta (sorprendente, lo so) di entrambi gli elementi. Voglio fare la stessa cosa con UITabBar nella mia applicazione, ma ora ho trovato il modo per cambiarlo dal colore nero predefinito. Qualche idea?

Sono stato in grado di farlo funzionare creando una sottoclasse di un UITabBarController e utilizzando classi private:

@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 ha aggiunto alcuni nuovi metodi di aspetto per personalizzare l'aspetto della maggior parte degli elementi dell'interfaccia utente.

Puoi scegliere come target ogni istanza di un UITabBar nella tua app utilizzando il proxy dell'aspetto.

Per iOS 5 + 6:

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

Per iOS 7 e versioni successive, utilizza quanto segue:

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

L'utilizzo del proxy dell'aspetto cambierà qualsiasi istanza della barra delle schede in tutta l'app. Per un'istanza specifica, utilizza una delle nuove proprietà su quella classe:

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

Ho un'addendum alla risposta finale. Sebbene lo schema essenziale sia corretto, il trucco di usare un colore parzialmente trasparente può essere migliorato. Presumo che sia solo per far trasparire il gradiente predefinito. Oh, inoltre, l'altezza della TabBar è di 49 pixel anziché 48, almeno in OS 3.

Quindi, se hai un'immagine 1 x 49 appropriata con un gradiente, questa è la versione di viewDidLoad che dovresti usare:

- (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];

}

Quando usi solo addSubview i tuoi pulsanti perderanno la cliccabilità, quindi invece di

[[self tabBar] addSubview:v];

uso:

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

Non esiste un modo semplice per farlo, in pratica è necessario creare una sottoclasse di UITabBar e implementare il disegno personalizzato per fare ciò che si desidera. È un bel po 'di lavoro per l'effetto, ma potrebbe valerne la pena. Consiglio di segnalare un bug ad Apple per aggiungerlo a un futuro SDK per iPhone.

Di seguito è la soluzione perfetta per questo. Funziona bene con me per iOS5 e 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];
}

Su iOS 7:

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

Consiglio anche di impostare prima in base ai tuoi desideri visivi:

[[UITabBar appearance] setBarStyle:UIBarStyleBlack];

Lo stile della barra mette un sottile separatore tra il contenuto della visualizzazione e la barra delle schede.

[[self tabBar] insertSubview:v atIndex:0]; funziona perfettamente per me.

per me è molto semplice cambiare il colore di Tabbar come: -

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


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

Prova questo!!!

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

solo per il colore di sfondo

Tabbarcontroller.tabBar.barTintColor=[UIColor redcolour];

o questo in App Delegate

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

per cambiare il colore delle icone deselezionate della barra delle schede

Per 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];
}

Sopra iOS 10:

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

Ci sono alcune buone idee nelle risposte esistenti, molte funzionano in modo leggermente diverso e ciò che scegli dipenderà anche dai dispositivi che scegli come target e dal tipo di aspetto che desideri ottenere. UITabBarè notoriamente poco intuitivo quando si tratta di personalizzarne l'aspetto, ma qui ci sono alcuni altri trucchi che possono aiutare:

1). Se stai cercando di sbarazzarti della sovrapposizione lucida per un aspetto più piatto, fai:

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

2). Per impostare immagini personalizzate sui pulsanti tabBar, fai qualcosa come:

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

Dove selectede unselectedsono UIImageoggetti di tua scelta. Se desideri che siano un colore piatto, la soluzione più semplice che ho trovato è creare un UIViewcon il desiderato backgroundColore poi renderlo in un UIImagecon l'aiuto di QuartzCore. Uso il seguente metodo in una categoria suUIView per ottenere un UIImagecon i contenuti della vista:

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

3) Infine, potresti voler personalizzare lo stile dei titoli dei pulsanti. Fare:

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];
}

Ciò ti consente di apportare alcune modifiche, ma ancora piuttosto limitate. In particolare, non è possibile modificare liberamente la posizione del testo all'interno del pulsante e non è possibile avere colori diversi per i pulsanti selezionati / non selezionati. Se vuoi fare un layout del testo più specifico, imposta semplicemente UITextAttributeTextColorche sia chiaro e aggiungi il tuo testo nelle immagini selectede unselecteddalla parte (2).

[v setBackgroundColor ColorwithRed: Green: Blue: ];

Un'altra soluzione (che è un trucco) è impostare l'alfa sul tabBarController a 0.01 in modo che sia praticamente invisibile ma ancora cliccabile. Quindi imposta un controllo ImageView nella parte inferiore del pennino MainWindow con l'immagine della barra delle schede personalizzata sotto il tabBarCOntroller con alfa. Quindi scambia le immagini, cambia i colori o evidenzia quando il tabbarcontroller cambia visualizzazione.

Tuttavia, si perde il "... altro" e si personalizza la funzionalità.

Ciao, sto usando iOS SDK 4 e sono stato in grado di risolvere questo problema con solo due righe di codice ed è così

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

Spero che sia di aiuto!

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];
}

Risposta rapida 3.0: (da Vaibhav Gaikwad)

Per cambiare il colore delle icone deselezionate della barra delle schede:

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

Solo per cambiare il colore del testo:

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

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

Swift 3 usando l'aspetto dal tuo AppDelegatefai quanto segue:

UITabBar.appearance().barTintColor = your_color