【问题标题】:How to make UINavigationBar background transparent?如何使 UINavigationBar 背景透明?
【发布时间】:2016-01-10 15:30:02
【问题描述】:

首先, 我已经在How to make UINavigationBar Transparent in IOS 8?Transparent UINavigationBarMake UINavigationBar transparent 看到了所有答案。

它们似乎不适合我。

我的常规视图控制器(在尝试使导航栏透明之前)没有任何问题:

我正在使用(在viewDidLoadviewWillAppear: 都试过):

[self.navigationController.navigationBar setBackgroundImage:[UIImage new]
                                              forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
self.navigationController.view.backgroundColor = [UIColor clearColor];

我明白了:

灰色状态栏背景,完全白色的导航栏与状态栏不融合,然后视图开始。其他问题“答案”中的所有“解决方案”对我来说都产生了相同的结果。

我也尝试过设置self.edgesForExtendedLayout = UIRectEdgeNone;self.edgesForExtendedLayout = UIRectEdgeAll;,但这也没有任何影响。

如何让我的导航栏透明而不弄乱一切?

更新: 按照 Warif Akhand Rishi 的回答,我已将 self.navigationController.view.backgroundColor = [UIColor clearColor]; 更改为 self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];,现在我得到了一个灰色的统一状态/导航栏,但仍然不透明:

更新 2:我已经连接了视图调试器,灰色背景似乎来自视图层次结构的根深蒂固,我的视图内容没有向上延伸。我用最新的代码再次尝试了self.edgesForExtendedLayout = UIRectEdgeAll;,但仍然无济于事:

【问题讨论】:

  • 隐藏状态栏怎么样?
  • 在您的视图控制器中,您是否在顶栏下方延伸边缘?
  • @SamB 我不想隐藏状态栏。
  • @beyowulf 尝试开启和关闭。都一样

标签: ios uinavigationcontroller uinavigationbar


【解决方案1】:

swift 4 透明导航栏: (确保视图延伸到导航栏后面以显示,否则将只是黑色)

navigationController?.navigationBar.isTranslucent = true
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationController?.navigationBar.shadowImage = UIImage() //remove pesky 1 pixel line

或者只是将导航栏颜色与当前 vc 的颜色匹配,但保持不透明。将 translucent 设置为 false 子视图将与导航栏对齐,而不是在其下方。

navigationController?.navigationBar.isTranslucent = false
navigationController?.navigationBar.barTintColor = UIColor.yourColor
navigationController?.navigationBar.shadowImage = UIImage() //remove pesky 1 pixel line

【讨论】:

    【解决方案2】:

    改变你的

    self.navigationController.view.backgroundColor = [UIColor clearColor];
    

    到这里

    self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
    

    【讨论】:

    • 现在看起来更好(灰色,与状态栏统一,但仍然不透明)
    • 测试self.view.backgroundColor = [UIColor redColor]; 如果您在视图顶部看到红色。这意味着您的顶部有间隙。向上移动您的视图。 (原点.y)
    【解决方案3】:

    好的,经过努力,我自己解决了这个问题。问题不止一个。这不是关于延伸的边缘,而是关于线self.navigationController.view.backgroundColor = [UIColor clearColor];(必须是self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];,正如Warif Akhand Rishi 建议的那样)以及我的表格视图的剪辑子视图属性。我已经更改了该行并关闭了我的表格视图的剪辑,现在它可以按预期工作。

    【讨论】:

      【解决方案4】:

      对于 iOS 13 和 UINavigationBarAppearance API:

      let navAppearance = UINavigationBarAppearance()
      navAppearance.configureWithTransparentBackground()
      self.navigationItem.standardAppearance = navAppearance
      

      消除超过 5 行阴影/背景/颜色代码!

      【讨论】:

        【解决方案5】:

        我参加聚会有点晚了,但我最近需要做同样的事情,我发现以下实际上效果最好(因为它可以消除堆栈中较低位置的所有阴影和渗透) :

        guard let navBar = navigationController?.navigationBar else { return }
        navBar.barStyle = .black
        navBar.setBackgroundImage(UIImage(), for: .default)
        navBar.shadowImage = UIImage()
        navBar.isTranslucent = true
        navBar.isHidden = false
        

        【讨论】:

        • 最佳答案。完美运行。
        【解决方案6】:

        1.您的 NavigationBar 是白色的,而不是黑色的。所以您必须在 NavigationBar 下有一个视图(白色视图),这是您的 grayView 的父视图。透明设置有效,但您看不到它,因为字体颜色也是白色的。
        2.所以你必须更新你的greyView的约束,所以它可以在导航栏下扩展。然后你可以看到你的白色标题。
        3.也许你得把你的statusBar的UIStatusBarStyle改成default或者lightcontent,我注意到statusBar的字体颜色也是白色的。

        【讨论】:

          【解决方案7】:

          下面的代码对我有用

          self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
          self.navigationController?.navigationBar.shadowImage = UIImage()
          self.navigationController?.navigationBar.isTranslucent = true
          self.navigationController?.view.backgroundColor = .clear
          self.navigationController?.navigationBar.backgroundColor = .clear
          

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 2015-08-06
            • 2011-09-17
            • 2011-02-18
            • 2016-10-24
            • 2016-07-19
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多