使用分段控制更改视图

时间:2018-02-01 11:47:51

标签: ios swift ios11 swift4 xcode9

我需要使用分段控件来更改视图。在以下示例中,我将两个视图容器放在同一位置:

enter image description here

隐藏第二个容器,每次使用分段控件时我都会通过代码显示它。 (虽然它也没有表现出来。)

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var container1: UIView!
    @IBOutlet weak var container2: UIView!

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

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

    @IBAction func showComponent(_ sender: Any) {
        if (sender as AnyObject).selectedSegmentIndex == 0 {
            UIView.animate(withDuration: 0.5, animations: {
                self.container1.alpha = 1
                self.container2.alpha = 0
            })
        } else {
            UIView.animate(withDuration: 0.5, animations: {
                self.container1.alpha = 0
                self.container2.alpha = 1
            })
        }
    }

}

你知道其他任何方法吗?

有没有办法自定义SegmentedControl,就好像它是TAB一样?

2 个答案:

答案 0 :(得分:8)

在这里,我根据您的要求创建了一个完整的解决方案。

Swift 4

//
//  SegementedVC.swift
//
//  Created by Test User on 01/02/18.
//  Copyright © 2018 Test User. All rights reserved.
//

import UIKit

class SegementedVC: UIViewController {

    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Outlets
    //----------------------------------------------------------------

    @IBOutlet weak var segmentControl   : UISegmentedControl!
    @IBOutlet weak var containerView    : UIView!


    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Variables
    //----------------------------------------------------------------

    private lazy var firstViewController: FirstViewController = {
        // Load Storyboard
        let storyboard = UIStoryboard(name: "Main", bundle: Bundle.main)

        // Instantiate View Controller
        var viewController = storyboard.instantiateViewController(withIdentifier: "FirstViewController") as! FirstViewController

        // Add View Controller as Child View Controller
        self.add(asChildViewController: viewController)

        return viewController
    }()

    private lazy var secondViewController: SecondViewController = {
        // Load Storyboard
        let storyboard = UIStoryboard(name: "Main", bundle: Bundle.main)

        // Instantiate View Controller
        var viewController = storyboard.instantiateViewController(withIdentifier: "SecondViewController") as! SecondViewController

        // Add View Controller as Child View Controller
        self.add(asChildViewController: viewController)

        return viewController
    }()


    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Abstract Method
    //----------------------------------------------------------------

    static func viewController() -> SegementedVC {
        return UIStoryboard.init(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "SegementedView") as! SegementedVC
    }

    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Memory Management Methods
    //----------------------------------------------------------------

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


    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Action Methods
    //----------------------------------------------------------------

    @IBAction func segmentValueChanged(_ sender: UISegmentedControl) {
        updateView()
    }


    //----------------------------------------------------------------
    // MARK:-
    // MARK:- Custom Methods
    //----------------------------------------------------------------

    private func add(asChildViewController viewController: UIViewController) {

        // Add Child View Controller
        addChildViewController(viewController)

        // Add Child View as Subview
        containerView.addSubview(viewController.view)

        // Configure Child View
        viewController.view.frame = containerView.bounds
        viewController.view.autoresizingMask = [.flexibleWidth, .flexibleHeight]

        // Notify Child View Controller
        viewController.didMove(toParentViewController: self)
    }

    //----------------------------------------------------------------

    private func remove(asChildViewController viewController: UIViewController) {
        // Notify Child View Controller
        viewController.willMove(toParentViewController: nil)

        // Remove Child View From Superview
        viewController.view.removeFromSuperview()

        // Notify Child View Controller
        viewController.removeFromParentViewController()
    }

    //----------------------------------------------------------------

    private func updateView() {
        if segmentControl.selectedSegmentIndex == 0 {
            remove(asChildViewController: secondViewController)
            add(asChildViewController: firstViewController)
        } else {
            remove(asChildViewController: firstViewController)
            add(asChildViewController: secondViewController)
        }
    }

    //----------------------------------------------------------------

    func setupView() {
        updateView()
    }



    //----------------------------------------------------------------
    // MARK:-
    // MARK:- View Life Cycle Methods
    //----------------------------------------------------------------

    override func viewDidLoad() {
        super.viewDidLoad()
        self.setupView()
    }

    //----------------------------------------------------------------

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

    //----------------------------------------------------------------

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

故事板截图

enter image description here

enter image description here

enter image description here

答案 1 :(得分:0)

  1. 如果你能给我一个项目,那会很棒。但如果您可以尝试按照下一步操作,也许不需要它。

  2. 我会以不同的方式做到这一点。在你的VC中添加UIView。称之为容器视图。然后在xib(笔尖)中创建2个单独的视图herehere。然后将这2个视图添加到容器视图中: view.addSubsire(view1)view.addSubsire(view2)

  3. 然后,您只需检查分段控件并显示所需的视图。

  4. 不要忘记UI调试。使用这个惊人的功能:link

  5. 实施可能需要一些时间,但这些是您在任何情况下都需要了解的基础知识,因此它肯定会有用。

    希望它有所帮助!祝你好运!

    PS。上面的答案 - 不确定它是否有帮助,因为你需要标签是半页?