多色标签栏图标

Posted 2023-02-23

【中文标题】多色标签栏图标

【英文标题】：Multicolor tab bar icon

【发布时间】：2016-03-07 19:05:45

【问题描述】：

我正在为一家餐厅开发应用程序。

我有 3 个项目（家庭、食物、购物车）的标签栏。

当用户从购物车中添加或删除某些东西时，我需要更改购物车标签栏项目的图标（更改图标不是问题）。

我有带有购物车和红色圆圈的 PNG，上面有 1 到 9 的数字。这就是问题所在，图标有两种颜色（红色圆圈和灰色购物车）。

我尝试将色调颜色设置为清除，但没有成功。

【问题讨论】：

拥有不会让最终用户感到困惑 - 他们怎么知道他们选择了什么

我必须有两张图像，一张是深灰色的，一张是浅灰色的（每个数字）。一个是 self.tabBar.items![2].image 和第二个 self.tabBar.items![2].selectedImage。

【参考方案1】：

请您使用RDVTabBarController

这里是示例代码

UIViewController *firstViewController = [[RDVFirstViewController alloc] init];
UIViewController *firstNavigationController = [[UINavigationController alloc]
                                               initWithRootViewController:firstViewController];

UIViewController *secondViewController = [[RDVSecondViewController alloc] init];
UIViewController *secondNavigationController = [[UINavigationController alloc]
                                                initWithRootViewController:secondViewController];

UIViewController *thirdViewController = [[RDVThirdViewController alloc] init];
UIViewController *thirdNavigationController = [[UINavigationController alloc]
                                               initWithRootViewController:thirdViewController];

RDVTabBarController *tabBarController = [[RDVTabBarController alloc] init];
[tabBarController setViewControllers:@[firstNavigationController, secondNavigationController,
                                       thirdNavigationController]];
self.viewController = tabBarController;


UIImage *finishedImage = [UIImage imageNamed:@"tabbar_selected_background"];
UIImage *unfinishedImage = [UIImage imageNamed:@"tabbar_normal_background"];
NSArray *tabBarItemImages = @[@"first", @"second", @"third"];

RDVTabBar *tabBar = [tabBarController tabBar];

[tabBar setFrame:CGRectMake(CGRectGetMinX(tabBar.frame), CGRectGetMinY(tabBar.frame), CGRectGetWidth(tabBar.frame), 63)];

NSInteger index = 0;
for (RDVTabBarItem *item in [[tabBarController tabBar] items]) 
    [item setBackgroundSelectedImage:finishedImage withUnselectedImage:unfinishedImage];
    UIImage *selectedimage = [UIImage imageNamed:[NSString stringWithFormat:@"%@_selected",
                                                  [tabBarItemImages objectAtIndex:index]]];
    UIImage *unselectedimage = [UIImage imageNamed:[NSString stringWithFormat:@"%@_normal",
                                                    [tabBarItemImages objectAtIndex:index]]];
    [item setFinishedSelectedImage:selectedimage withFinishedUnselectedImage:unselectedimage];

    index++;

【参考方案2】：

目标 C：

把这个放在AppDelegate.m的application didFinishLaunchingWithOptions方法中

UIImage *selectedImage = [UIImage imageNamed:@"YOUR_IMAGE_NAME_FOR_SELECTED"];
[[UITabBar appearance] setSelectionIndicatorImage:selectedImage];

斯威夫特 2.1：

把这个放在AppDelegate.swift in application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) 方法中

let selectedImage : UIImage = UIImage(named: "YOUR_IMAGE_NAME_FOR_SELECTED")!
UITabBar.appearance().selectionIndicatorImage = selectedImage

图像名称 "YOUR_IMAGE_NAME_FOR_SELECTED" 大小为 98x98 像素

【参考方案3】：

使图像的渲染模式始终为原始？ vc.tabBarItem.image = UIImage(named:"icon")?.imageWithRenderingMode(.AlwaysOriginal)

【参考方案4】：

您可能想查看UITabBarItem 的badgeValue 属性，这是执行您想要实现的目标的推荐方法（大概是用户购物篮的计数）。

您可以在 App Store 中看到它的一个示例：它看起来像您可以安装的更新数量，标记在“更新”标签栏项目上。