如何在Navigation Controller中使用Segmented Control实现三页面切换

看起来你踩了两个常见的坑：直接建多个Segue导致导航栏丢失（大概率是用了modal跳转，或者push后栈结构混乱），串联跳转又导致每个页面都带返回按钮。其实核心问题是没理清导航栈的逻辑，或者没选对页面切换的模式。下面给你两种贴合需求的方案，按需选择：

方案一：基于导航栈的跳转（适合需要保留返回逻辑的场景） #

如果你的三个页面需要独立的导航栈（比如从切换后的页面能返回带Segmented Control的主页面），可以这么做：

1. 设置导航栈根控制器：把带Segmented Control的页面（比如叫MainVC）设为UINavigationController的根控制器，这样它的导航栏不会有返回按钮，符合主页面的定位。

2. 处理Segmented Control的切换事件：在MainVC中，给Segmented Control绑定valueChanged事件，点击时先清理导航栈回到根页面，再push目标页面。这样既避免栈越堆越深，又能保证目标页面的导航栏有正确的返回按钮。

代码示例（Swift）：

// 假设你的Segmented Control有三个选项：0=主页面，1=页面A，2=页面B
@IBAction func onSegmentedControlChanged(_ sender: UISegmentedControl) {
    // 先回到根页面，避免栈里残留其他页面
    navigationController?.popToRootViewController(animated: false)
    
    switch sender.selectedSegmentIndex {
    case 0:
        // 选中主页面，无需跳转
        break
    case 1:
        // 跳转到页面A
        let pageA = storyboard?.instantiateViewController(withIdentifier: "PageA") as! PageAViewController
        navigationController?.pushViewController(pageA, animated: true)
    case 2:
        // 跳转到页面B
        let pageB = storyboard?.instantiateViewController(withIdentifier: "PageB") as! PageBViewController
        navigationController?.pushViewController(pageB, animated: true)
    default:
        break
    }
}

这样操作后，从页面A/B点击返回按钮会回到MainVC，而MainVC的Segmented Control可以随时切换到任意页面，导航栏始终正常显示。

方案二：容器视图控制器（适合无返回需求的内容切换） #

如果你的三个页面只是内容切换，不需要独立的导航栈（比如类似TabBar的切换逻辑，但用Segmented Control触发），推荐用容器视图的方式，这样所有页面共享同一个导航栏，不会出现返回按钮混乱的问题：

1. 创建容器控制器：新建一个ContainerVC作为UINavigationController的根控制器，在它的视图里添加Segmented Control（可以放在导航栏的titleView里，更贴合iOS风格），再添加一个占满剩余空间的UIView作为容器视图。

2. 预加载子控制器：在ContainerVC的viewDidLoad中，提前加载三个内容页面的控制器，并存为属性：

// 容器视图的IBOutlet
@IBOutlet weak var containerView: UIView!

// 三个内容页面的控制器
var mainVC: MainViewController!
var pageA: PageAViewController!
var pageB: PageBViewController!
// 当前显示的子控制器
var currentChildVC: UIViewController?

override func viewDidLoad() {
    super.viewDidLoad()
    
    // 从Storyboard加载控制器（记得给每个VC设置Storyboard ID）
    mainVC = storyboard?.instantiateViewController(withIdentifier: "MainVC") as! MainViewController
    pageA = storyboard?.instantiateViewController(withIdentifier: "PageA") as! PageAViewController
    pageB = storyboard?.instantiateViewController(withIdentifier: "PageB") as! PageBViewController
    
    // 默认显示主页面
    switchToChildVC(mainVC)
}

3. 实现切换逻辑：写一个通用方法来切换子控制器，再绑定到Segmented Control的事件：

// 切换子控制器的通用方法
private func switchToChildVC(_ targetVC: UIViewController) {
    // 移除当前子控制器
    currentChildVC?.willMove(toParent: nil)
    currentChildVC?.view.removeFromSuperview()
    currentChildVC?.removeFromParent()
    
    // 添加目标子控制器
    addChild(targetVC)
    targetVC.view.frame = containerView.bounds
    containerView.addSubview(targetVC.view)
    targetVC.didMove(toParent: self)
    
    currentChildVC = targetVC
}

// Segmented Control的事件处理
@IBAction func onSegmentedControlChanged(_ sender: UISegmentedControl) {
    switch sender.selectedSegmentIndex {
    case 0:
        switchToChildVC(mainVC)
    case 1:
        switchToChildVC(pageA)
    case 2:
        switchToChildVC(pageB)
    default:
        switchToChildVC(mainVC)
    }
}

这种方式下，所有内容切换都在ContainerVC内部完成，导航栏始终属于ContainerVC，既不会丢失，也不会出现多余的返回按钮，完全符合你的需求。

内容的提问来源于stack exchange，提问作者D-A UK