使用 Objective-C iOS 制作选项卡切换布局

Posted 2023-03-12

【中文标题】使用 Objective-C iOS 制作选项卡切换布局

【英文标题】：Make a tab switched layout with Objective-C iOS

【发布时间】：2017-08-26 08:05:04

【问题描述】：

这是大多数移动应用程序使用的常见设计模式

+-------------------------+
|         title           |
+-------------------------+
|                         |
|                         |
|                         |
|                         |
|                         |
|                         |
|        content          |
|                         |
|                         |
|                         |
|                         |
|                         |
+-------------------------+
| |tab1|   |tab2|  |tab3| |
+-------------------------+

主要思想是当用户按下tab1或tab2或tab3时，内容会相应改变。

我现在正在做的事情（代码不是故事板）是制作一个ViewController 来显示内容和底部面板，并制作一个UINavigationController 来显示标题

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];        
    ViewController *viewController = [[ViewController alloc] init];   
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:viewController];
    self.window.rootViewController = nav;
    [self.window makeKeyAndVisible];

当用户按下底部选项卡时，更改内容视图，同时使用subviews 更改内容，但我发现更改内容时发现：

视图无法以标题的高度正确地开始。 此外，我应该在同一个视图控制器中编写所有逻辑，这会导致代码混乱。

如何实现这样的布局？

【问题讨论】：

我们经常使用一个UITabbarController作为rootWindow，里面包含了几个导航。

你创建新项目时有一个预设的 TabBar 应用程序。只需选择它。另外，请学习故事板，它会让您的生活更轻松。

【参考方案1】：

看看UITabBarController，这是一个默认组件，负责在屏幕底部显示选项卡图标并自动管理选项卡之间的转换。每个选项卡也是一个独立的视图控制器，因此您的代码更有条理。对于标题，您可以使用 UINavigationController 作为您希望拥有标题栏的每个选项卡的根控制器

查看this answer 以获取分步指南。

【参考方案2】：

我们经常使用UITabbarController作为Window的rootVC。​​

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

    ViewController1 *vc1 = [ViewController1 new];
    vc1.tabBarItem.title = @"VC1";
    vc1.tabBarItem.image = [UIImage imageNamed:@"1.png"];

    ViewController2 *vc2 = [ViewController2 new];
    vc2.tabBarItem.title = @"VC2";
    vc2.tabBarItem.image = [UIImage imageNamed:@"2.png"];

    ViewController3 *vc3 = [ViewController3 new];
    vc3.tabBarItem.title = @"VC3";
    vc3.tabBarItem.image = [UIImage imageNamed:@"3.png"];

    UINavigationController *nav1 = [[UINavigationController alloc]initWithRootViewController:vc1];
    UINavigationController *nav2 = [[UINavigationController alloc]initWithRootViewController:vc2];
    UINavigationController *nav3 = [[UINavigationController alloc]initWithRootViewController:vc3];

    UITabBarController *tab = [UITabBarController new];
    tab.viewControllers = @[nav1,nav2,nav3];

    self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
    self.window.rootViewController = tab;
    [self.window makeKeyAndVisible];

    return YES;

他们之间的关系：

当您单击 tabbarItem 时，windows 上的视图会在导航中的 viewController.View 之间发生变化。它们不会相互影响。

【参考方案3】：

您可以使用容器视图来更改按钮上的视图 Press without Tab bar controller ，请参见下面的 url

How to use a 'Container View' in ios?