前言
NS_CLASS_AVAILABLE_IOS(3_2) @interface UISplitViewController : UIViewController
@available(iOS 3.2, *) public class UISplitViewController : UIViewController
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 的创建
// 初始化分割视图控制器
UISplitViewController *splitViewController = [[UISplitViewController alloc] init];
// 设置分割面板的 2 个视图控制器
splitViewController.viewControllers = @[navigationController, detailViewController];
// 添加到窗口
[self addChildViewController:splitViewController];
[self.view addSubview:splitViewController.view];
// 做为 window 的根视图控制器
self.window.rootViewController = splitViewController;
// 初始化分割视图控制器
UISplitViewController *splitViewController = [[UISplitViewController alloc] init];
// 设置分割面板的 2 个视图控制器
splitViewController.viewControllers = @[navigationController, detailViewController];
// 添加到窗口
[self addChildViewController:splitViewController];
[self.view addSubview:splitViewController.view];
// 做为 window 的根视图控制器
self.window.rootViewController = splitViewController;
// 初始化分割视图控制器
let splitViewController = UISplitViewController()
// 设置分割面板的 2 个视图控制器
splitViewController.viewControllers = [navigationController, detailViewController]
// 添加到窗口
self.addChildViewController(splitViewController)
self.view.addSubview(splitViewController.view)
// 做为 window 的根视图控制器
self.window.rootViewController = splitViewController
// 初始化分割视图控制器
let splitViewController = UISplitViewController()
// 设置分割面板的 2 个视图控制器
splitViewController.viewControllers = [navigationController, detailViewController]
// 添加到窗口
self.addChildViewController(splitViewController)
self.view.addSubview(splitViewController.view)
// 做为 window 的根视图控制器
self.window.rootViewController = splitViewController
2、判断设备类型
// 初始化列表和详情面板
// 初始化列表面板,可以为表格视图控制器
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];
}
}
// 初始化列表和详情面板
// 初始化列表面板,可以为表格视图控制器
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];
}
}
// 初始化列表和详情面板
// 初始化列表面板,可以为表格视图控制器
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)
}
}
// 初始化列表和详情面板
// 初始化列表面板,可以为表格视图控制器
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 场景绑定的 Controller 中设置
// 获取 Master 页
self.splitViewController.viewControllers[0]
// 获取 Detail 页
self.splitViewController.viewControllers[1]
// 获取 Master 页
self.splitViewController.viewControllers[0]
// 获取 Detail 页
self.splitViewController.viewControllers[1]