使用大型导航标题时,如何使视图居中?

问题描述

我有一个搜索视图控制器,我想在屏幕中央显示一个加载指示器,但是当我使用大型标题导航时,它似乎偏移了,但是大型导航仪的高度呢?

enter image description here

如何补偿它,使其位于屏幕的真正中心?

我当前正在使用它设置

{(context=[])=> (
        <div>
            {context.openNotes.map((noteList,ind) => (
              <ColumnDroppable
                   key={ind}
                   index={ind}
                   noteList={noteList}
                   location={location}
                 />
               )}

我的视图控制器在下面

      tableView.addSubview(searchingView)
      searchingView.translatesAutoresizingMaskIntoConstraints = false
      NSLayoutConstraint.activate([
        searchingView.centerXAnchor.constraint(equalTo: tableView.centerXAnchor),searchingView.centerYAnchor.constraint(equalTo: tableView.centerYAnchor)
      ])

解决方法

如果您真的希望活动指示器位于屏幕中央,则需要进行一些计算:

func addActivityIndicatorToCenterOfScreen() {
    let screenHeight = UIScreen.main.bounds.size.height
    let activityIndicatorHeight = searchingView.bounds.size.height
    let safeAreaBottomInset = tableView.safeAreaInsets.bottom
    let yOffset = (screenHeight - activityIndicatorHeight) / 2 - safeAreaBottomInset

    tableView.addSubview(searchingView)
    searchingView.translatesAutoresizingMaskIntoConstraints = false

    NSLayoutConstraint.activate([
        searchingView.centerXAnchor.constraint(equalTo: tableView.centerXAnchor),searchingView.bottomAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.bottomAnchor,constant: -yOffset),])
}

还要确保在布局视图后配置约束。 viewDidAppear是一个不错的地方。这是必需的,因为我们需要知道tableView的大小和安全区域。

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    addActivityIndicatorToCenterOfScreen()
}

现在进行一些解释。 tableView.safeAreaLayoutGuide包括tableView的部分,位于导航栏和屏幕底部的槽口之间。 tableView.safeAreaInsets.bottom为我们提供了屏幕底部凹口的高度。 yOffset是屏幕的中心减去活动指示器高度的一半减去屏幕底部凹口的高度。我们将从安全区域的底部偏移活动指示器的底部。这样会将活动指示器的中心置于屏幕中心。

如果我是您,我会将活动指示器居中在导航栏和缺口顶部之间。这样更清洁,您可以在viewDidLoad中完成此操作:

func addActivityIndicatorCenteredBetweenNavBarAndSafeAreaBottom() {
    tableView.addSubview(searchingView)
    searchingView.translatesAutoresizingMaskIntoConstraints = false

    NSLayoutConstraint.activate([
        searchingView.centerXAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.centerXAnchor),searchingView.centerYAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.centerYAnchor),])
}