標題下方 NavigationBar 上的 UiSegmentedControl

Question

我是 iOS 開發的新手，在為我正在構建的應用程序工作期間，我出現了一些疑問。 我正在嘗試構建一個將由多個 ViewController 復合的屏幕，但是在 NavigationBar 上，我希望在標題上方有一個 UiSegmentedControl，類似於范圍欄來控制子 ViewController 之間的導航。 我想構建類似於我們在 HealthKit Dashboard 上的東西：

.

你建議用什么樣的方法來做到這一點？ 我知道關於它已經做了一些問題，但經過長時間的研究我還沒有得出結論。

在我的研究過程中，我注意到 NavigationBar 上的UISearchBar （用於構建 Scope Bar ）僅適用於UITableViewControllers ，我說得對嗎？ 所以我認為這不是一種方法。

我的下一個想法是使用手動放置在 NavigationBar 下方的UISegmentedControl ，然后使用 Containment Api 更改此屏幕的不同 ViewController。 這里的問題是我必須在所有子視圖UISegmentedControl上復制UISegmentedControl 。 有沒有辦法不必復制它？

我嘗試的另一種方法是使用 NavigationBar 和下面的UISegmentedControl為 NavigationBar 做我自己的 titleView。 我不喜歡這個想法，嘗試復制 NavigationBar 也不順利。

最后，我認為另一種方法是使用UIPageViewController 。 雖然這種方法對我來說聽起來不錯，但我認為我還必須復制UISegmentedControl 。

最后，我認為最好的解決方案是在 NavigationBar 上有一個UISegmentControl ，但我沒有看到如何實現這一點。

您認為實現我的想法的最佳方法是什么？ 我認為這很容易，因為這是我在許多應用程序中看到的模式。 有什么建議？

我在 XCode 6.1.1 上使用 Swift for iOS 8 執行此操作。

非常感謝你的幫助。

Answer 1

您可以通過將段添加為標題視圖並設置所需的提示來獲得此效果。 在界面生成器中，它看起來像這樣：

Answer 2

將UIToolbar添加到您的視圖中。 如果您通過代碼或界面構建器添加它並不重要。 然后將UISegmentedControl添加為UIBarButtonItem自定義視圖

let toolbar = UIToolbar()
toolbar.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(toolbar)
NSLayoutConstraint.activate([
    toolbar.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
    toolbar.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    toolbar.trailingAnchor.constraint(equalTo: view.trailingAnchor),
])

// Add SegmentedControl like this:
toolbar.setItems([UIBarButtonItem(customView: mySegmentedControl)], animated: false)
toolbar.delegate = self

然后實現這個委托方法（見UIBarPosition.topAttached 文檔）

extension MyViewController: UIToolbarDelegate {
    public func position(for bar: UIBarPositioning) -> UIBarPosition {
        .topAttached
    }
}

然后你就有了你需要的東西。 但是導航欄和工具欄之間仍然有一條分隔線。 要擺脫它，請使用此擴展方法並在viewWillAppear和viewWillDisappear調用它們：

extension UINavigationBar {
    func hideHairline() {
        // Hide border line of navigation bar since we're showing a toolbar
        if #available(iOS 13.0, *) {
            standardAppearance.shadowColor = nil
            standardAppearance.shadowImage = nil
        } else {
            shadowImage = UIImage()
            setBackgroundImage(UIImage(), for: .default)
        }
    }
    
    func restoreHairline() {
        // Hide border line of navigation bar since we're showing a toolbar
        if #available(iOS 13.0, *) {
            standardAppearance.shadowColor = .separator
        } else {
            shadowImage = nil
            setBackgroundImage(nil, for: .default)
        }
    }
}