ios - UITabBarの色合い/背景色の変更

Question

UINavigationBarとUISearchBarの両方にtintColorプロパティがあり、これらのアイテムの両方の色合いの色を変更できます（驚くべきことに、私は知っています）。アプリケーションのUITabBarにも同じことをしたいのですが、デフォルトの黒色から変更する方法を見つけました。何か案は？

Answer 1

iOS 5 では、ほとんどの UI 要素の外観をカスタマイズするための新しい外観メソッドがいくつか追加されました。

外観プロキシを使用して、アプリ内の UITabBar のすべてのインスタンスを対象にすることができます。

iOS 5 + 6 の場合:

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

iOS 7 以降の場合は、次を使用してください。

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

外観プロキシを使用すると、アプリ全体のタブ バー インスタンスが変更されます。特定のインスタンスに対して、そのクラスの新しいプロパティの 1 つを使用します。

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

Answer 2

UITabBarControllerをサブクラス化し、プライベートクラスを使用することで、これを機能させることができました。

@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

Answer 3

最終回答に補足があります。基本的なスキームは正しいですが、部分的に透明な色を使用するというトリックは改善することができます。デフォルトのグラデーションが透けて見えるようにするためだけだと思います。また、少なくとも OS 3 では、TabBar の高さは 48 ではなく 49 ピクセルです。

したがって、グラデーションのある適切な 1 x 49 画像がある場合は、これが使用する必要がある viewDidLoad のバージョンです。

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

}

Answer 4

addSubview を使用するだけでは、ボタンをクリックできなくなるため、代わりに

[[self tabBar] addSubview:v];

使用する：

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

Answer 5

以下は、これに対する完璧なソリューションです。これは、iOS5 と 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];
}

Answer 6

これを行う簡単な方法はありません。基本的には、UITabBar をサブクラス化し、カスタム描画を実装して、必要なことを行う必要があります。効果を得るにはかなりの作業ですが、それだけの価値があるかもしれません。Apple にバグを報告して、将来の iPhone SDK に追加してもらうことをお勧めします。

Answer 7

私にとっては、タブバーの色を次のように変更するのは非常に簡単です：-

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


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

これを試して！！！

Answer 8

[[self tabBar] insertSubview:v atIndex:0]; 私にとって完璧に機能します。

Answer 9

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

Answer 10

背景色のみ

Tabbarcontroller.tabBar.barTintColor=[UIColor redcolour];

またはこれをApp Delegateで

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

タブバーの非選択アイコンの色を変更する

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

iOS 10 以上:

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

Answer 11

[v setBackgroundColor ColorwithRed: Green: Blue: ];

Answer 12

既存の回答にはいくつかの良いアイデアがあり、多くはわずかに異なる動作をします。選択するものは、ターゲットとするデバイスと達成しようとしている外観の種類によっても異なります. UITabBar外観のカスタマイズに関しては直感的でないことで有名ですが、役立つかもしれないいくつかのトリックを次に示します。

1)。よりフラットな外観にするために光沢のあるオーバーレイを取り除きたい場合は、次のようにします。

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

2)。カスタム イメージを tabBar ボタンに設定するには、次のようにします。

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

selectedとunselectedは選択しUIImageたオブジェクトです。それらを単色にしたい場合、私が見つけた最も簡単な解決策は、目的の を作成しUIView、QuartzCore をbackgroundColor使用してそれを にレンダリングすることです。ビューのコンテンツを取得するためUIImageに、カテゴリで次のメソッドを使用します。UIViewUIImage

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

3) 最後に、ボタンのタイトルのスタイルをカスタマイズできます。行う：

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

これにより、いくつかの調整を行うことができますが、それでもかなり制限されています。特に、ボタン内でテキストを配置する場所を自由に変更することはできません。また、選択されているボタンと選択されていないボタンの色を変えることはできません。より具体的なテキスト レイアウトを行いたい場合は、クリアに設定して、パート (2)のと画像UITextAttributeTextColorにテキストを追加します。selectedunselected

Answer 13

もう 1 つの解決策 (ハック) は、tabBarController のアルファを 0.01 に設定して、実質的に見えなくてもクリックできるようにすることです。次に、アルファ化された tabBarCONtroller の下にあるカスタム タブバー イメージを使用して、MainWindow nib の下部に ImageView コントロールを設定します。次に、タブバーコントローラーがビューを切り替えるときに、画像を交換したり、色を変更したり、ハイライトしたりします。

ただし、「...詳細」およびカスタマイズ機能は失われます。

Answer 14

こんにちは、iOS SDK 4 を使用しています。2 行のコードでこの問題を解決できました。次のようになります。

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

お役に立てれば！