自定义UITabBar图标iOS

Question

我正在开发一个标签式应用程序，我想集成自定义UITabbar背景和图标。我已经插入了自定义背景，但我的图标有问题。

这就是图标的外观：

但在为故事板中的每个视图添加图标后，我会得到如下灰色图标：

有没有人知道为什么图标以这种方式显示？

非常感谢！

Answer 1

使用Xcode 6，为了能够直接从Storyboard更改图像，您可以这样做：

@IBDesignable class CustomizedTabBarItem: UITabBarItem {
    @IBInspectable var finalImage:UIImage = UIImage() {
        didSet {
            self.image = finalImage.imageWithRenderingMode(.AlwaysOriginal)
        }
    }
    @IBInspectable var finalSelectedImage:UIImage = UIImage() {
        didSet {
            self.selectedImage = finalSelectedImage.imageWithRenderingMode(.AlwaysOriginal)
        }
    }
}

之后，您只需在故事板中设置图像

Answer 2

我还没评论，所以我会加上答案。

由于不推荐使用iOS 7 setFinishedSelectedImage:withFinishedUnselectedImage:。

要解决此问题，您可以这样做：

UIImage *selectedImage = [UIImage imageNamed:@"tabbar-highlight"];
selectedImage = [selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *unselectedImage = [UIImage imageNamed:@"tabbar"];
unselectedImage = [unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
tabBarItem = [[UITabBarItem alloc] initWithTitle:@"TabBarItem1" image:unselectedImage selectedImage:selectedImage];
//
//OR
//
UIImage *selectedImage = [UIImage imageNamed:@"tabbar-highlight"];
selectedImage = [selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *unselectedImage = [UIImage imageNamed:@"tabbar"];
unselectedImage = [unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[yourTabBarItem setImage:unselectedImage];
[yourTabBarItem setSelectedImage:selectedImage];

希望这有助于澄清iOS7 +。

Answer 3

这是我在其中一个应用中执行此操作的方法。在AppDelegate didFinishLaunchingWithOptions:方法中，添加此内容并填写图片名称：

    UITabBarController *tabController = (UITabBarController *)self.window.rootViewController;

    //tab1
    UIImage *selectedImage = [UIImage imageNamed:@"home-tab-selected"];
    UIImage *unselectedImage = [UIImage imageNamed:@"home2-tab"];
    MyTabBar *tabBar = (MyTabBar *)tabController.tabBar;
    UITabBarItem *item1 = [tabBar.items objectAtIndex:0];
    [item1 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];

    //tab2
    selectedImage = [UIImage imageNamed:@"customers-tab-selected"];
    unselectedImage = [UIImage imageNamed:@"customers-tab"];
    UITabBarItem *item2 = [tabBar.items objectAtIndex:1];
    [item2 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];

    //tab3
    selectedImage = [UIImage imageNamed:@"maps-tab-selected"];
    unselectedImage = [UIImage imageNamed:@"maps-tab"];
    UITabBarItem *item3 = [tabBar.items objectAtIndex:2];
    [item3 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];

    //tab4
    selectedImage = [UIImage imageNamed:@"reports-tab-selected"];
    unselectedImage = [UIImage imageNamed:@"reports-tab"];
    UITabBarItem *item4 = [tabBar.items objectAtIndex:3];
    [item4 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];

    //tab5
    selectedImage = [UIImage imageNamed:@"orders-tab-selected"];
    unselectedImage = [UIImage imageNamed:@"orders-tab"];
    UITabBarItem *item5 = [tabBar.items objectAtIndex:4];
    [item5 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];


    if ([tabBar respondsToSelector:@selector(setBackgroundImage:)])
    {
        // ios 5 code here
        [tabBar setBackgroundImage:[UIImage imageNamed:@"tab-bg"]];

    }   

适合我的作品。

Answer 4

Julien关于IBInspectable的答案的更新版本在

之下

import UIKit

@IBDesignable
class CustomTabBarItem: UITabBarItem {
    @IBInspectable var finalImage: UIImage = UIImage() {
        didSet {
            self.image = finalImage.withRenderingMode(.alwaysOriginal)
            }
        }
    @IBInspectable var finalSelectedImage: UIImage = UIImage() {
       didSet {
            self.selectedImage = finalSelectedImage.withRenderingMode(.alwaysOriginal)
            }
        }
}

Answer 5

您可以在setFinishedSelectedImage:withFinishedUnselectedImage:

上使用UITabBarItem设置标签栏图标的完成图像

检查文档here（在外观下查看）

UITabBarItem的默认行为是根据您的图标创建一个遮罩，然后在您看到时应用特殊的蓝色处理。

Answer 6

你也可以保持简单;）

    [tabBarItemName setSelectedImage:[UIImage imageNamed:@"image name"]];

您必须在ViewController.h中声明tabBarItemName