【问题标题】:SwiftUI white space under the NavigationBarNavigationBar下的SwiftUI空白
【发布时间】:2020-05-30 14:54:49
【问题描述】:

我有一个带有大标题和内容的 NavigationBar 视图。我更改了内容背景颜色和 NavigationBar 背景颜色。

 var body: some View {
       NavigationView {
            VStack {
               //content
            }.background(Color.green)
             .edgesIgnoringSafeArea(.bottom) //to fill the white space at the bottom
             .navigationBarTitle("Wallets")
       }
}
extension UINavigationController {
    override open func viewDidLoad() {
        super.viewDidLoad()

        let standartAppearance = UINavigationBarAppearance()       
        standartAppearance.backgroundColor = UIColor.green
        navigationBar.standardAppearance = standartAppearance
        navigationBar.scrollEdgeAppearance = standartAppearance
        navigationBar.compactAppearance = standartAppearance
    }
}

现在,如果我使用 NavigationLink 移动到下一个视图,并且该视图的标题为 .inline 显示模式(不同的 NavigationBar 大小),则在转换时我会看到第一个导航栏下方的空白。如果我为我的 VStack 制作 .edgesIgnoringSafeArea(.all),我可以填充它,但在这种情况下,我的所有内容都会跳到 NavigationBar 下。如何将 NavigationBar 下的空间着色为自定义颜色?

【问题讨论】:

  • 你修复成功了吗?
  • 我没有找到正常的解决方案,请参阅下面的解决方法。
  • 是的,太好了。我正在用偏移量修复它!

标签: swift swiftui background-color navigationbar


【解决方案1】:

看起来这是一个错误。我没有找到正常的解决方案。这是一个解决方法:

我们应该计算 NavigationBar 的高度并填充它后面的空间。

var deviceHeight: CGFloat {
    UIScreen.main.bounds.height
}

  func calcPadding() -> CGFloat {
        var padding: CGFloat = 0.0
        switch self.deviceHeight {
        case 568.0: padding = 94.0 + 6.0
        case 667.0: padding = 96.0 + 10.0
        case 736.0: padding = 96.0 + 10.0
        case 812.0: padding = 106.0 + 10.0
        case 896.0: padding = 106.0 + 10.0
        default:
            padding = 106.0
        }

    return padding
}


var body: some View {
    NavigationView {
        VStack {
            VStack {
                 //content
            }
            .padding(.top, calcPadding())
            .background(Color.myBackground)
        }
        .background(Color.myBackground)
        .edgesIgnoringSafeArea(.all)
    }
}

【讨论】:

  • 当您将手机旋转到横向时会怎样?那时高度不再适用,不是吗?这个问题没有更好的解决方案吗?
猜你喜欢
  • 1970-01-01
  • 2021-10-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多