Swift - 使用Segmented Control进行多个视图View的切换

2016-02-26 发布：hangge 阅读：8132

本文介绍如何使用分段选择控件（UISegmentedControl）来切换同一个VC下多个页面视图。

1，实现原理

在页面同一位置叠加多个 UIContainerViewController，根据 Segmented Control 的选择改变各个 Container View 的 hidden 属性。

2，效果图

本样例演示两个视图的切换。

3，实现步骤

（1）在StoryBoard中，往页面里添加一个 Segmented Control，以及一个 Container View。

（可以看到，这个Container会自动 Embed 进来一个 View Controller。）

（2）继续添加一个 Container View，位置大小和前面添加的 Container View 相同，覆盖在上面。

（3）为便于效果演示，我们分别给两个Container对应的View Controller中添加不同的 Label 标签加以区别。（当然实际开发中，可以在其中添加更复杂的内容）

（4）将两个 Container View、Segmented Control 控件、以及 Value Changed 事件与代码相关联。完整代码如下：

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var segmentedControl: UISegmentedControl!
    @IBOutlet weak var firstView: UIView!
    @IBOutlet weak var secondView: UIView!
    
    @IBAction func indexChanged(sender: UISegmentedControl) {
        switch segmentedControl.selectedSegmentIndex
        {
        case 0:
            firstView.hidden = false
            secondView.hidden = true
        case 1:
            firstView.hidden = true
            secondView.hidden = false
        default:
            break;
        }
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        firstView.hidden = false
        secondView.hidden = true
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

源码下载：

hangge_1063.zip

4楼

2018-08-22 11:00

gu

代码过时了。
segmentedControl这个没有了

站长回复：
有的啊，怎么会没有，不信你试试。
3楼

2017-06-09 15:21

jimmy

您好，请教一下，segmented control对应两个container，当我在第二个container中修改某些数据时，点segmented control切换到第一个container，第一个container如何自动刷新？

站长回复：
直接在Segmented Control的Value Changed事件响应中判断是不是切换到第一个，是的话就刷新第一个。
2楼

2016-03-20 00:13

coco

您好，请问您是如何Embed多个View Controller的？
我Embed第二个View controller时，第一个Embed Segue就自动取消了..谢谢！

站长回复：
是添加了两个Container，每个Container分别Embed一个View controller
1楼

2016-02-29 13:42

ce

我在《侧滑菜单的实现（样例2：仿QQ，菜单带缩放效果）》基础上加了不能绑定@IBOutlet 求解

站长回复：
我这边不知道你是怎么加的，具体代码调试要靠你自己了。