【问题标题】:IOS 8 Tab Bar Item Background ColourIOS 8标签栏项目背景颜色
【发布时间】:2015-07-14 11:42:36
【问题描述】:

上周我一直在努力寻找解决方案,但在尝试了我能找到或想到的所有可能解决方案后,我没有运气。我找到并尝试过的每个解决方案要么无效,要么已经过时。

我在 UITabBar 中有 5 个 UITabBarItem 放在 UITabBarController 中。我想在选择时更改UITabBarItem的背景颜色,当然当所选项目更改时它会更改。

我在 Xcode 6.3.1 中使用 Swift 和 iOS SDK 8.3。如果您只能用 Objective-C 回答也可以,任何答案都会有所帮助!提前谢谢大家,真的很感激!

编辑:这是我想要它做的一个视觉示例。

Different Background Color

【问题讨论】:

    标签: ios swift ios8 uitabbar uitabbaritem


    【解决方案1】:

    您可以从每个控制器调用此函数,并传递self.tabBarController 和您想要的每种颜色。

    功能:

    static func customTabBar(controller: UIViewController?, backgroundColor: String, unselectedColor: String, selectedColor: String) {
            if let tabBarController = controller as? UITabBarController {
                tabBarController.tabBar.barTintColor = UIColor(hex: backgroundColor)
                tabBarController.tabBar.tintColor = UIColor(hex: selectedColor)
                tabBarController.tabBar.isTranslucent = false
                tabBarController.tabBar.selectedItem?.setTitleTextAttributes([NSAttributedString.Key.foregroundColor:UIColor(hex: selectedColor)], for: UIControl.State.selected)
                if #available(iOS 10.0, *) {
                    tabBarController.tabBar.unselectedItemTintColor = UIColor(hex: unselectedColor)
                } else {
                    // Fallback on earlier versions
                }
            }
        }
    

    【讨论】:

      【解决方案2】:

      受 Gwendle 启发,我是这样解决的:

      override func viewWillAppear(animated: Bool) {
          guard let tabBar = tabBarController?.tabBar else { return }
          tabBar.tintColor = UIColor.whiteColor()
          tabBar.selectionIndicatorImage = UIImage().makeImageWithColorAndSize(UIColor.redColor(), size: CGSizeMake(tabBar.frame.width/5, tabBar.frame.height))
          super.viewWillAppear(animated)
      }
      

      并且还使用了扩展名:

      extension UIImage {
          func makeImageWithColorAndSize(color: UIColor, size: CGSize) -> UIImage {
              UIGraphicsBeginImageContext(size)
              color.setFill()
              UIRectFill(CGRectMake(0, 0, size.width, size.height))
              let image = UIGraphicsGetImageFromCurrentImageContext()
              UIGraphicsEndImageContext()
              return image
      }
      

      请记住,在您设置 selectionIndicationImage 后,它仍会为您的所有其他选项卡设置。这是一个如何删除它的示例,方法是在其余选项卡中的每个其他视图控制器中将其设置为 nil:

      override func viewWillAppear(animated: Bool) {
          tabBarController?.tabBar.tintColor = UIColor.redColor()
          tabBarController?.tabBar.selectionIndicatorImage = nil
          super.viewWillAppear(animated)
      }
      

      使用 Swift 2 实现。

      【讨论】:

        【解决方案3】:

        在你的tabBarController中,你可以设置默认的UITabBar tintColor、barTintColor、selectionIndicatorImage(这里有点作弊)和图片的renderMode,见下面的cmets:

            class MyTabBarController: UITabBarController, UINavigationControllerDelegate {
              ...
              override func viewDidLoad() {
                ...
                // Sets the default color of the icon of the selected UITabBarItem and Title
                UITabBar.appearance().tintColor = UIColor.redColor()
        
                // Sets the default color of the background of the UITabBar
                UITabBar.appearance().barTintColor = UIColor.blackColor()
        
                // Sets the background color of the selected UITabBarItem (using and plain colored UIImage with the width = 1/5 of the tabBar (if you have 5 items) and the height of the tabBar)
                UITabBar.appearance().selectionIndicatorImage = UIImage().makeImageWithColorAndSize(UIColor.blueColor(), size: CGSizeMake(tabBar.frame.width/5, tabBar.frame.height))
        
                // Uses the original colors for your images, so they aren't not rendered as grey automatically.
                for item in self.tabBar.items as! [UITabBarItem] {
                  if let image = item.image {
                    item.image = image.imageWithRenderingMode(.AlwaysOriginal)
                  }
                }
              }
              ...
            }
        

        你会想要扩展 UIImage 类来制作你需要大小的纯色图像:

        extension UIImage {
          func makeImageWithColorAndSize(color: UIColor, size: CGSize) -> UIImage {
            UIGraphicsBeginImageContextWithOptions(size, false, 0)
            color.setFill()
            UIRectFill(CGRectMake(0, 0, size.width, size.height))
            var image = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
            return image
          }
        }
        

        【讨论】:

        • 非常好的答案,谢谢。有人应该将此标记为正确。在 UIImage 扩展中,您传递了一个大小,但您没有使用它。我认为你的意思是写 UIRectFill(CGRectMake(0, 0, size.width, size.height))。如果我替换此行,您的解决方案将完美运行。
        • 这是唯一对我有用的答案。谢谢。我唯一要改变的是 "UITabBar.appearance().selectionIndicatorImage = UIImage()..." 到 "UITabBar.appearance().selectionIndicatorImage = UIImage().makeImageWithColorAndSize(UIColor.blueColor(), size: CGSizeMake(tabBar .frame.width/CGFloat(tabBar.items!.count), tabBar.frame.height))" 只是为了让它更加即插即用。再次感谢!
        • 应选为答案
        • 当我使用 Iphone 6 模拟器时,我的图像没有拉伸。我放了扩展程序,但它仍然无法正常工作。
        • 您需要将宽度和高度除以屏幕比例因子,以获得不同设备的正确图像尺寸,例如CGSize(width: size.width / UIScreen.main.scale, height: size.height / UIScreen.main.scale)
        【解决方案4】:

        你可以试试这个。将此添加到AppDelegate.swift

        func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
                // Override point for customization after application launch.
        
                UITabBar.appearance().translucent = false
                UITabBar.appearance().barTintColor = UIColor(rgba: "#12296f")
                UITabBar.appearance().tintColor = UIColor.whiteColor()
        
                return true
            }
        

        不要忘记包含这个库。 https://github.com/yeahdongcn/UIColor-Hex-Swift

        【讨论】:

        • 但是您的图标会根据所选项目更改标签栏颜色。
        【解决方案5】:

        你试过了吗?

        在情节提要的视图控制器中选择标签栏图标图像。

        查看 xcode 右侧面板上的 Identity and Type(最左侧)选项卡(看起来像一张纸)。

        查找全局色调设置。

        【讨论】:

        • 是的,就是这样。您是想将全局色调更改为仅您的标签栏,还是整个程序?它不起作用,因为它可能在更高的导航级别被覆盖。
        • 还要确保没有代码行设置您的色调stackoverflow.com/questions/23818808/…
        • 故事板中有导航控制器吗?
        • 在情节提要中,单击标签栏视图控制器的顶部。然后打开属性检查器。然后使用模拟指标来获得您想要的结果。
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-08-20
        • 1970-01-01
        • 2015-07-13
        • 2018-06-13
        相关资源
        最近更新 更多