选择项目时如何更改 UITabItem 的背景颜色

Posted 2023-02-23

【中文标题】选择项目时如何更改 UITabItem 的背景颜色

【英文标题】：How do I change background color of UITabItem when item is selected

【发布时间】：2013-07-26 10:31:02

【问题描述】：

当用户选择一个标签栏项目时，我想要与未选择时不同的背景颜色。

【参考方案1】：

把这个放在Appdelegate.mapplication didFinishLaunchingWithOptions中

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

【参考方案2】：

如果您使用情节提要或 xib，请单击“标签栏”并将“selectedImageTintColor”路径添加到 Key Path Attributes 标记中。像这样：

【讨论】：

不是 OP 询问改变背景颜色吗？

是的，这只会改变所选标签的文本颜色。

【参考方案3】：

更新：从 iOS 7.1 开始，此技术不再有效（如果用户连续两次点击同一选项卡，背景颜色将被清除）。

---

UITabBarItem是UIBarItem的子类，因为UIBarItem没有子类UIView，所以一切都更痛苦；但是，UITabBarItem 包含一个。以下内容会操纵该视图，因此如果提交到 AppStore 可能会被拒绝。

1) 子类 UITabBarItem

创建一个 UITabBarItem 的子类并将一个新的selected 属性添加到它的标题中，如下所示：

@interface ALDTabBarItem : UITabBarItem
@property (nonatomic, assign, getter = isSelected) BOOL selected;
@end

UITabBarItems 有一个视图属性，但它没有公开。我们可以扩展类来访问它，然后在 selected 属性上创建一个自定义设置器来更改背景颜色，如下所示：

#import "ALDTabBarItem.h"

@interface ALDTabBarItem (ALD)
@property (nonatomic, strong) UIView *view;
@end

@implementation ALDTabBarItem

- (void)setSelected:(BOOL)selected

    if(selected)
        self.view.backgroundColor = [UIColor redColor];
    else
        self.view.backgroundColor = [UIColor clearColor];
 

@end

2) 更新您的 UITabBarController 委托

将以下代码添加到您的 UITabBarController 的委托中，该委托设置 UITabBar 的选定状态：

- (void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item

    for(ALDTabBarItem *myItem in tabBar.items)
        myItem.selected = (myItem == item);

【讨论】：

请在您的代码myItem.selected = (myitem == item); => myItem.selected = (myItem == item); (myItem) 的最后编辑变量名称。感谢您的回答！

【参考方案4】：

在斯威夫特中

UITabBar.appearance().selectionIndicatorImage = UIImage(named: "tabSelected")

带有大小为 98x98 像素的图像 [e-mail]

【讨论】：

现在这是改变你的 tabbarItem 被选中时背景颜色的最简单的方法。请不要顽固的家伙。 :D 子类化 TabbarItem 不再有效。

【参考方案5】：

按照以下步骤操作：

创建UITabBarController的子类

转到UITabBarController 子类的viewDidAppear

现在找到 TabBarItem 的大小，

UITabBar *tabBar = self.tabBar;
CGSize imgSize = CGSizeMake(tabBar.frame.size.width/tabBar.items.count,tabBar.frame.size.height);

现在创建具有该尺寸的图像，

//Create Image
UIGraphicsBeginImageContextWithOptions(imgSize, NO, 0);
UIBezierPath* p =
[UIBezierPath bezierPathWithRect:CGRectMake(0,0,imgSize.width,imgSize.height)];
[[UIColor blueColor] setFill];
[p fill];
UIImage* finalImg = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

现在，将此图像分配给 TabBar 的 SelectionIndicatorImage

[tabBar setSelectionIndicatorImage:finalImg];

Swift 4 版本：

let imgSize = CGSize(width: tabBar.frame.size.width / CGFloat(tabBar.items!.count),
                     height: tabBar.frame.size.height)
UIGraphicsBeginImageContextWithOptions(imgSize, false, 0)
let p = UIBezierPath(rect: CGRect(x: 0, y: 0, width: imgSize.width,
                                  height: imgSize.height))
UIColor.blue.setFill()
p.fill()
let finalImg = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
UITabBar.appearance().selectionIndicatorImage = finalImg

【参考方案6】：

我的回答与 @Mehul Thakkar 类似，但它在 Swift 4 中，为了改进他的回答，我想说，如果您将代码放在 viewDidAppear正如他所建议的那样，用户会看到正在发生的变化，这不是良好的用户体验。

因此，为您的标签栏控制器和viewDidLoad 创建自定义类 放置以下代码：

let singleTabWidth: CGFloat = self.tabBar.frame.size.width / CGFloat((self.tabBar.items?.count)!)
let singleTabSize = CGSize(width:singleTabWidth , height: self.tabBar.frame.size.height)

let selectedTabBackgroundImage: UIImage = self.imageWithColor(color: .white, size: singleTabSize)
self.tabBar.selectionIndicatorImage = selectedTabBackgroundImage

imageWithColor 功能如下：

//image with color and size
    func imageWithColor(color: UIColor, size: CGSize) -> UIImage 
        let rect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()

        context!.setFillColor(color.cgColor)
        context!.fill(rect)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image!
    

希望这对某人有所帮助。

【讨论】：

您的答案是 100% 正确的，但是将代码放入 viewDidAppear 的原因是我们得到了屏幕的最终实际宽度。如果您的代码在 viewDidLoad 中，那么您将看到不同尺寸屏幕的问题。（仅适用于特定屏幕尺寸）

【参考方案7】：

请参考以下网址。

Changing Tint / Background color of UITabBar

How To Change Tab bar color in Xcode

希望这会对你有所帮助..

尝试这个来改变标签栏项目的颜色，但它只适用于 ios5。

if ([UITabBar instancesRespondToSelector:@selector(setSelectedImageTintColor:)])

    [tabBarController.tabBar setSelectedImageTintColor:[UIColor redColor]];

【讨论】：

我编辑了我的 Q. 请 chk。或者你可以关注这个“***.com/questions/5799572/…”..

【参考方案8】：

您可以使用 tintcolor。

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

在 AppDelegate.m 中，将以下代码放在 // 应用程序启动后自定义覆盖点之后。

【讨论】：

这只会改变标题的颜色。如果我们想改变整个框的颜色。即标签栏项目。

这在 iOS 8 中已被弃用。

【参考方案9】：

把它放在你的 AppDelegate.m 文件中：

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
            // Override point for customization after application launch.

            [UITabBar appearance].selectionIndicatorImage = [UIImage imageNamed:@"activeTabBackgroundImage"];


            return YES;
        

【参考方案10】：

目前在 Xcode 8.3.2 中，您可以在情节提要中使用代表实际背景的图像来执行此操作。

选择标签栏控制器内的标签栏：

在 Utilities 中选择 Attributes Inspector 并更改选择背景图像：

【参考方案11】：

在 Swift 4 中回答：

setSelectedImageTintColor 在 iOS 8 上已弃用。

改用这个：

self.tabBar.tintColor = UIColor.white