iOS - UISplitViewController

前言

    NS_CLASS_AVAILABLE_IOS(3_2) @interface UISplitViewController : UIViewController
    @available(iOS 3.2, *)       public class UISplitViewController : UIViewController
  • 大多数时候,iPhone、iPod 应用与 iPad 应用开发没有太大的区别,但是 iPad 的屏幕比 iPhone 大,设计程序时可以充分利用 iPad 的大屏幕特点,例如 TabBar 和 Navigation 的使用会减少,相应的会采用新的一种 ViewController 来代替,那就是 UISplitViewController,这个控件是 iPad 专用的视图控制器。使用 SplitViewController 导航时,横屏情况下,左边显示一个导航表,点击导航项时右边显示对应的详情。横屏情况下显示方式会有所不同,默认只显示详情面板,原来左侧的导航列表会通过浮动窗口隐藏,需要从边缘向内侧拖动来显示。

  • 在 iPhone 应用中,使用导航控制器由上一层界面进入下一层界面,在下一层界面处理完成后,用户可以非常方便的返回上一层界面。这种方式在 iPhone 应用里非常方便,因为小屏幕通常只能显示一个界面,但对于 iPad 来说,那么大的屏幕只显示一个列表会显得不太好看,同时用户操作也不方便,所以在 iPad 中,通常使用 SplitViewController 来实现导航。iPhone 和 iPad 的系统设置就是典型的按设备区别界面的应用。

    • self.splitViewController.viewControllers[0] // 表示 Master 页
    • self.splitViewController.viewControllers[1] // 表示 Detail 页

1、splitViewController 的创建

  • Objective-C

        // 初始化分割视图控制器
        UISplitViewController *splitViewController = [[UISplitViewController alloc] init];
    
        // 设置分割面板的 2 个视图控制器            
        splitViewController.viewControllers = @[navigationController, detailViewController];
    
        // 添加到窗口  
        [self addChildViewController:splitViewController];
        [self.view addSubview:splitViewController.view];
    
        // 做为 window 的根视图控制器
        self.window.rootViewController = splitViewController;
  • Swift

        // 初始化分割视图控制器
        let splitViewController = UISplitViewController()
    
        // 设置分割面板的 2 个视图控制器
        splitViewController.viewControllers = [navigationController, detailViewController]
    
        // 添加到窗口
        self.addChildViewController(splitViewController)
        self.view.addSubview(splitViewController.view)
    
        // 做为 window 的根视图控制器
        self.window.rootViewController = splitViewController

2、判断设备类型

  • Objective-C

        // 初始化列表和详情面板
    
            // 初始化列表面板,可以为表格视图控制器
            MasterViewController *masterViewController = [[MasterViewController alloc] init];
    
            // 初始化详情面板
            DetailViewController *detailViewController = [[DetailViewController alloc] init];
    
            // 用导航包装列表面板,显示导航条,如果是分割面板也不影响功能
            UINavigationController *navigationController = [[UINavigationController alloc] 
                                                          initWithRootViewController:masterViewController];
    
        // 根据设备类型创建分割视图控制器
        /*
            UIUserInterfaceIdiomUnspecified = -1,
            UIUserInterfaceIdiomPhone     NS_ENUM_AVAILABLE_IOS(3_2),   // iPhone and iPod touch style UI
            UIUserInterfaceIdiomPad       NS_ENUM_AVAILABLE_IOS(3_2),   // iPad style UI
            UIUserInterfaceIdiomTV        NS_ENUM_AVAILABLE_IOS(9_0),   // Apple TV style UI
            UIUserInterfaceIdiomCarPlay   NS_ENUM_AVAILABLE_IOS(9_0),   // CarPlay style UI
        */
    
            // 如果是 iPhone 或 iPod 则只显示列表页,如果是 iPad 则显示分割面板
            if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPhone) {
    
                // 添加到窗口
                [self addChildViewController:navigationController];
                [self.view addSubview:navigationController.view];
            }
            else {
    
                // 初始化分割视图控制器
                UISplitViewController *splitViewController = [[UISplitViewController alloc] init];
    
                // 设置分割面板的 2 个视图控制器
                splitViewController.viewControllers = @[navigationController, detailViewController];
    
                // 添加到窗口
                [self addChildViewController:splitViewController];
                [self.view addSubview:splitViewController.view];
    
                // 做为 window 的根视图控制器
                self.window.rootViewController = splitViewController;
            }
    
        // 表格点击
    
            - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    
                // 调用 DetailViewController 的方法更新详细页
                [self.splitViewController.viewControllers[1] loadDetailViewController:[dataArray 
                                                                            objectAtIndex:indexPath.row]];
    
                // 如果是 iPhone、iPod 则导航到详情,跳转到 detailViewController,取消选中状态
                if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPhone) {
    
                    [tableView deselectRowAtIndexPath:indexPath animated:YES];
    
                    [self.navigationController pushViewController:self.splitViewController.viewControllers[1] 
                                                         animated:YES];
                }
            }
  • Swift

        // 初始化列表和详情面板
    
            // 初始化列表面板,可以为表格视图控制器
            let masterViewController = MasterViewController()
    
            // 初始化详情面板
            let detailViewController = DetailViewController()
    
            // 用导航包装列表面板,显示导航条,如果是分割面板也不影响功能
            let navigationController = UINavigationController(rootViewController: masterViewController)
    
        // 根据设备类型创建分割视图控制器
        /*
            case Unspecified
            case Phone    @available(iOS 3.2, *)  // iPhone and iPod touch style UI
            case Pad      @available(iOS 3.2, *)  // iPad style UI
            case TV       @available(iOS 9.0, *)  // Apple TV style UI
            case CarPlay  @available(iOS 9.0, *)  // CarPlay style UI
        */
    
            // 如果是 iPhone 或 iPod 则只显示列表页,如果是 iPad 则显示分割面板
            if UIDevice.currentDevice().userInterfaceIdiom == .Phone {
    
                // 添加到窗口
                self.addChildViewController(navigationController)
                self.view.addSubview(navigationController.view)
            }
            else {
    
                // 初始化分割视图控制器
                let splitViewController = UISplitViewController()
    
                // 设置分割面板的 2 个视图控制器
                splitViewController.viewControllers = [navigationController, detailViewController]
    
                // 添加到窗口
                self.addChildViewController(splitViewController)
                self.view.addSubview(splitViewController.view)
    
                // 做为 window 的根视图控制器
                self.window.rootViewController = splitViewController
            }
    
        // 表格点击
    
            func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
    
                // 调用 DetailViewController 的方法更新详细页
                (self.splitViewController?.viewControllers[1] as! DetailViewController)
                                          .loadDetailViewController(dataArray[indexPath.row])
    
                // 如果是 iPhone、iPod 则导航到详情页,跳转到 detailViewController,取消选中状态
                if UIDevice.currentDevice().userInterfaceIdiom == UIUserInterfaceIdiom.Phone {
    
                    tableView.deselectRowAtIndexPath(indexPath, animated: true)
    
                    self.navigationController?
                        .pushViewController((self.splitViewController?
                                                    .viewControllers[1] as! DetailViewController), 
                                      animated: true)
                }
            }

3、Storyboard 中设置

  • 在 Storyboard 场景中设置

    • 在 Storyboard 场景绑定的 Controller 中设置

          // 获取 Master 页
          self.splitViewController.viewControllers[0]
      
          // 获取 Detail 页
          self.splitViewController.viewControllers[1]
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值