Swift - 标签条（UITabBar）标签页控制器（UITabBarController）用法

App底部的tab标签页可以方便的把功能模块划分清楚，只需点击相应的标签页就可以展示完全独立的视图页面，同时各标签页间的视图也可以进行数据交换。

TabBarItem系统自带图标样式（System）介绍：

Custom：自定义方式，配合Selected Image来自定义图标
More：三个点的图标，表示更多意思
Favorites：星形图标
Featured：星形图标
Top Tated：星形图标
Recents：时钟图标
Contacts：一个圆形一个人头像的图标，代表联系方式
History：时钟图标
Bookmarks：书本图标
Search：放大镜图标，代表搜索的意思
Downloads：正方形，加一个向下的箭头，代表下载的意思
Most Recent：时钟图标
Most Viewed：三条杠的笔记本纸片图标
效果：

Simulator Screen Shot - iPhone SE (2nd generation) - 2020-06-28 at 17.30.02.png

1、使用storyboard设计标签页

image.png

2、使用代码实现标签条（TabBar）

import UIKit
 
class ViewController: UIViewController,UITabBarDelegate {
     
    //添加Tab Bar控件
    var tabBar:UITabBar!
    //Tab Bar Item的名称数组
    var tabs = ["首页","学习中心","我的"]
    //Tab Bar上方的容器
    var contentView:UIView!
     
    override func viewDidLoad() {
        super.viewDidLoad()
         
        //在底部创建Tab Bar
        tabBar = UITabBar(frame:CGRect(x:0, y:self.view.bounds.height - 50,
                   width:self.view.bounds.width, height:50))
        var items:[UITabBarItem] = []
        for tab in self.tabs {
            let tabItem = UITabBarItem()
            tabItem.title = tab
            items.append(tabItem)
        }
        //设置Tab Bar的标签页
        tabBar.setItems(items, animated: true)
        //本类实现UITabBarDelegate代理，切换标签页时能响应事件
        tabBar.delegate = self
        //代码添加到界面上来
        self.view.addSubview(tabBar);
         
        //上方的容器
        contentView = UIView(frame: CGRect(x:0, y:0, width:self.view.bounds.width,
                                           height:self.view.bounds.height-50))
        self.view.addSubview(contentView)
        let lbl = UILabel(frame:CGRect(x:100, y:200, width:100, height:20))
        //定义tag，在用户切换tab时能查询到label控件
        lbl.tag = 1
        contentView.addSubview(lbl)
    }
     
    // UITabBarDelegate协议的方法，在用户选择不同的标签页时调用
    func tabBar(_ tabBar: UITabBar, didSelect item: UITabBarItem) {
        //通过tag查询到上方容器的label，并设置为当前选择的标签页的名称
        (contentView.viewWithTag(1) as! UILabel).text = item.title
    }
     
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

3、使用代码实现标签页控制器（TabBarController）

ViewController.swift

import UIKit
 
class ViewController: UIViewController,UITabBarDelegate {
    
     override func viewDidLoad() {
         super.viewDidLoad()
          
         let button = UIButton(type: .system)
         button.frame = CGRect(x:100, y:150, width:100, height:30)
         button.setTitle("开始游戏", for:.normal)
         button.addTarget(self, action:#selector(ViewController.tapped),
                          for:.touchUpInside)
         self.view.addSubview(button);
     }
      
    @objc func tapped(){
         self.present(MainTabViewController(), animated:true, completion:nil)
     }
      
     override func didReceiveMemoryWarning() {
         super.didReceiveMemoryWarning()
     }
 
}

MainTabViewController

import UIKit

class MainTabViewController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()

        //一共包含了两个视图
        let viewMain = PlayerViewController()
        viewMain.title = "游戏"
        let viewSetting = SettingViewController()
        viewSetting.title = "设置"
         
        //分别声明两个视图控制器
        let main = UINavigationController(rootViewController:viewMain)
        main.tabBarItem.image = UIImage(named:"first")
        //定义tab按钮添加个badge小红点值
        main.tabBarItem.badgeValue = "!"
         
        let setting = UINavigationController(rootViewController:viewSetting)
        setting.tabBarItem.image = UIImage(named:"second")
        self.viewControllers = [main,setting]
         
        //默认选中的是游戏主界面视图
        self.selectedIndex = 0
    }

}

PlayerViewController

import UIKit

class PlayerViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .blue
    }

}

SettingViewController

import UIKit

class SettingViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .red
    }
}

原文出自：www.hangge.com 转载请保留原文链接：https://www.hangge.com/blog/cache/detail_592.html