iOS 中使用UITabBarController创建底部导航栏

485 阅读2分钟

1.什么是UITabBarController?

UITabBarController是iOS开发中用于实现底部导航栏的一种容器视图控制器。它将多个视图控制器组合在一起,每个视图控制器代表应用的一个功能模块,用户可以通过点击底部的选项卡(Tab)来切换不同的视图。

.2创建UITabBarController

在Xcode中,我们可以通过Storyboard或者纯代码的方式来创建UITabBarController

使用Storyboard

  1. 打开Xcode,创建一个新的Single View App项目。
  2. 打开Main.storyboard,拖拽一个Tab Bar Controller到Storyboard中。
  3. 会看到已经有两个默认的视图控制器(View Controller),可以继续添加更多视图控制器作为选项卡的内容,新建一个ViewController,然后点击Tab Bar Controller拖拽到新的ViewController,选择Relationship Seque中的view controllers进行关联。 iShot_2023-08-21_10.55.47.png

iShot_2023-08-21_11.27.52.png

iShot_2023-08-21_11.28.04.png

iShot_2023-08-21_11.28.44.png 4. 右键点击Tab Bar Controller,可以在Attributes Inspector中设置选项卡的标题、图标等。 5. 每个子视图控制器中都有 Tab Bar Item,用于表示底部导航栏中每个选项卡(Tab)的一个实例,包含了选项卡的标题、图标以及其他属性。

iShot_2023-08-21_14.05.45.png

使用纯代码

import UIKit

class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        
        let viewController1 = UIViewController()
        viewController1.tabBarItem = UITabBarItem(tabBarSystemItem: .favorites, tag: 0)
        
        let viewController2 = UIViewController()
        viewController2.tabBarItem = UITabBarItem(tabBarSystemItem: .bookmarks, tag: 1)
        
        let tabBarController = UITabBarController()
        tabBarController.viewControllers = [viewController1, viewController2]
        
        window = UIWindow(frame: UIScreen.main.bounds)
        window?.rootViewController = tabBarController
        window?.makeKeyAndVisible()
        
        return true
    }
}

自定义选项卡样式

您可以通过以下方式自定义选项卡的样式、图标和标题:

viewController1.tabBarItem = UITabBarItem(title: "Favorites", image: UIImage(named: "favorites_icon"), selectedImage: nil)
viewController2.tabBarItem = UITabBarItem(title: "Bookmarks", image: UIImage(named: "bookmarks_icon"), selectedImage: nil)

UITabBar.appearance().tintColor = UIColor.blue // 设置选中的选项卡颜色

动态修改选项卡

您可以在运行时动态地修改UITabBarItem的属性,以响应用户的操作或数据变化:

// 在某些条件下显示选项卡上的标签
viewController1.tabBarItem.badgeValue = condition ? "New" : nil

// 根据用户登录状态切换选项卡图标
let iconName = isLoggedIn ? "user_icon" : "guest_icon"
viewController2.tabBarItem.image = UIImage(named: iconName)

生命周期和UITabBarControllerDelegate

UITabBarController也有自己的生命周期,可以通过方法覆写进行自定义操作。此外,您还可以使用UITabBarControllerDelegate来响应选项卡切换事件,以及进行一些额外的处理。

class MyTabBarController: UITabBarController, UITabBarControllerDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()
        self.delegate = self
    }

    func tabBarController(_ tabBarController: UITabBarController, didSelect viewController: UIViewController) {
        // 处理选项卡切换事件
    }
}

文章完结