iOS:分割控制器UISplitViewcontroller
2015-10-21 15:20
507 查看
分割控制器UISplitViewController
<1>功能:它也是ipad的一个新特性,在屏幕上可以同时显示两个控制器,左边一个,右边一个;左边的为主控制器,右边的为详细控制器,主控制器可以根据需要显示或隐藏。它对于iPhone虽然可以使用,但是不具备同时显示的特点,在iPhone的样式,就是导航控制器切换的模式。
<2>介绍
Split View通常只是一个基本元素,它填满整个屏幕,不可能把Split View放到其他什么的内部,一般情况下是提供给整个app的。
Split View有两个ViewControllers,一个左侧一个右侧,左侧叫Master,右侧叫Detail。
SplitViewController有 一个property叫做ViewControllers,它是一个数组,这个数组有两个元素,左侧和右侧,左侧是元素0,右侧是元素1
@property (nonatomic, copy) NSArray *viewControllers;
<3>代理方法:Split View不能没有delegate,如果没有设置delegate,那么当Split View进入Portrait模式的时候左侧就会消失,你应该在角落里放一个小按钮,使用户可以点击它来让左侧出现
- (BOOL)splitViewController:(UISplitViewController *)sender
shouldHideViewController:(UIViewController *)master inOrientation:(UIInterfaceOrientation)orientation
{
return YES; // always hide it
}
- (BOOL)splitViewController:(UISplitViewController *)sender shouldHideViewController:(UIViewController *)master inOrientation:(UIInterfaceOrientation)orientation
{
return UIInterfaceOrientationIsPortrait(orientation); //竖屏时隐藏master
}
-(void)splitViewController:(UISplitViewController *)sender willHideViewController:(UIViewController *)master withBarButtonItem:(UIBarButtonItem *)barButtonItem forPopoverController:(UIPopoverController *)popover
{
//将要隐藏master时,在detail控制器的toolbar上设置并显示一个按钮
barButtonItem.title = @“Master”;
[detailViewController setSplitViewBarButtonItem:barButtonItem];
}
-(void)splitViewController:(UISplitViewController *)sender willShowViewController:(UIViewController *)master invalidatingBarButtonItem:(UIBarButtonItem *)barButtonItem
{
// removeSplitViewBarButtonItem: must remove the bar button from its toolbar
[detailViewController removeSplitViewBarButtonItem:nil];
}
<4>在iPad上的基本样式截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021142058786-1840419249.png)
<5>在故事板布局的样式截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021142219020-508125554.png)
下面我们就通过纯代码的方式创建如下:
1、创建两个控制器类,一个为主控制器类MasterViewController,一个为详细控制器类DetailViewController
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150136333-1191887571.png)
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150040927-408406076.png)
2、导入几张素材图片,用来在详细控制器中显示。所有的文件截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150105130-1475884381.png)
3、下面就是具体的代码创建了:
//在AppDelegate.m文件中:
导入头文件并声明必要的属性,同时实现分割控制器的协议
创建分割控制器、主控制器、详细控制器,并设置它们之间的关系,以及设置分割控制器的代理
实现分割控制器协议的方法
//在MasterViewcontroller.m文件中:
导入头文件并声明必要的属性,同时实现分割控制器的协议
创建主控制器Master的导航栏和按钮,并设置表格视图的数据源和代理
实现表格视图的数据源协议方法
实现表格视图的代理协议方法
//在DEtailViewController.m文件中
设置视图背景颜色
演示结果如下:
开始时:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151917395-2126379090.png)
点击Master,显示Master主控制器:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151930755-1593558769.png)
点击单元格时,Detail详细控制器显示的内容:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151941208-15873822.png)
点击屏幕,关闭Master主控制器:
<1>功能:它也是ipad的一个新特性,在屏幕上可以同时显示两个控制器,左边一个,右边一个;左边的为主控制器,右边的为详细控制器,主控制器可以根据需要显示或隐藏。它对于iPhone虽然可以使用,但是不具备同时显示的特点,在iPhone的样式,就是导航控制器切换的模式。
<2>介绍
Split View通常只是一个基本元素,它填满整个屏幕,不可能把Split View放到其他什么的内部,一般情况下是提供给整个app的。
Split View有两个ViewControllers,一个左侧一个右侧,左侧叫Master,右侧叫Detail。
SplitViewController有 一个property叫做ViewControllers,它是一个数组,这个数组有两个元素,左侧和右侧,左侧是元素0,右侧是元素1
@property (nonatomic, copy) NSArray *viewControllers;
<3>代理方法:Split View不能没有delegate,如果没有设置delegate,那么当Split View进入Portrait模式的时候左侧就会消失,你应该在角落里放一个小按钮,使用户可以点击它来让左侧出现
- (BOOL)splitViewController:(UISplitViewController *)sender
shouldHideViewController:(UIViewController *)master inOrientation:(UIInterfaceOrientation)orientation
{
return YES; // always hide it
}
- (BOOL)splitViewController:(UISplitViewController *)sender shouldHideViewController:(UIViewController *)master inOrientation:(UIInterfaceOrientation)orientation
{
return UIInterfaceOrientationIsPortrait(orientation); //竖屏时隐藏master
}
-(void)splitViewController:(UISplitViewController *)sender willHideViewController:(UIViewController *)master withBarButtonItem:(UIBarButtonItem *)barButtonItem forPopoverController:(UIPopoverController *)popover
{
//将要隐藏master时,在detail控制器的toolbar上设置并显示一个按钮
barButtonItem.title = @“Master”;
[detailViewController setSplitViewBarButtonItem:barButtonItem];
}
-(void)splitViewController:(UISplitViewController *)sender willShowViewController:(UIViewController *)master invalidatingBarButtonItem:(UIBarButtonItem *)barButtonItem
{
// removeSplitViewBarButtonItem: must remove the bar button from its toolbar
[detailViewController removeSplitViewBarButtonItem:nil];
}
<4>在iPad上的基本样式截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021142058786-1840419249.png)
<5>在故事板布局的样式截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021142219020-508125554.png)
下面我们就通过纯代码的方式创建如下:
1、创建两个控制器类,一个为主控制器类MasterViewController,一个为详细控制器类DetailViewController
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150136333-1191887571.png)
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150040927-408406076.png)
2、导入几张素材图片,用来在详细控制器中显示。所有的文件截图为:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021150105130-1475884381.png)
3、下面就是具体的代码创建了:
//在AppDelegate.m文件中:
导入头文件并声明必要的属性,同时实现分割控制器的协议
#import "AppDelegate.h" #import "MasterViewController.h" #import "DetailViewController.h" @interface AppDelegate ()<UISplitViewControllerDelegate> @property (strong,nonatomic)UISplitViewController *splitViewController; //声明分割控制器 @end
创建分割控制器、主控制器、详细控制器,并设置它们之间的关系,以及设置分割控制器的代理
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { //创建分割控制器 self.splitViewController = [[UISplitViewController alloc]init]; //创建MasterVC MasterViewController *MasterVC = [[MasterViewController alloc]init]; //创建DetailVC DetailViewController *DetailVC = [[DetailViewController alloc]init]; //创建左侧导航控制器 UINavigationController *MasterNavigationController = [[UINavigationController alloc]initWithRootViewController:MasterVC]; //创建右侧导航栏控制器 UINavigationController *DetailNavigationController = [[UINavigationController alloc]initWithRootViewController:DetailVC]; // 设置 UISplitViewController 所管理的左、右两个 UIViewController self.splitViewController.viewControllers = @[MasterNavigationController,DetailNavigationController]; //设置分割控制器分割模式 self.splitViewController.preferredDisplayMode = UISplitViewControllerDisplayModePrimaryHidden; //设置代理 self.splitViewController.delegate = self; //设置window的根控制器 self.window.rootViewController = self.splitViewController; return YES; }
实现分割控制器协议的方法
#pragma mark -<UISplitViewController> //主控制器将要隐藏时触发的方法 -(void)splitViewController:(UISplitViewController *)svc willHideViewController:(UIViewController *)aViewController withBarButtonItem:(UIBarButtonItem *)barButtonItem forPopoverController:(UIPopoverController *)pc { barButtonItem.title = @"Master"; //master将要隐藏时,给detail设置一个返回按钮 UINavigationController *Nav = [self.splitViewController.viewControllers lastObject]; DetailViewController *Detail = (DetailViewController *)[Nav topViewController]; Detail.navigationItem.leftBarButtonItem = barButtonItem; } //开始时取消二级控制器,只显示详细控制器 - (BOOL)splitViewController:(UISplitViewController *)splitViewController collapseSecondaryViewController:(UIViewController *)secondaryViewController ontoPrimaryViewController:(UIViewController *)primaryViewController { return YES; } //主控制器将要显示时触发的方法 -(void)splitViewController:(UISplitViewController *)sender willShowViewController:(UIViewController *)master invalidatingBarButtonItem:(UIBarButtonItem *)barButtonItem { //master将要显示时,取消detail的返回按钮 UINavigationController *Nav = [self.splitViewController.viewControllers lastObject]; DetailViewController *Detail = (DetailViewController *)[Nav topViewController]; Detail.navigationItem.leftBarButtonItem = nil; }
//在MasterViewcontroller.m文件中:
导入头文件并声明必要的属性,同时实现分割控制器的协议
#import "MasterViewController.h" #import "DetailViewController.h" @interface MasterViewController ()<UITableViewDataSource,UITableViewDelegate> @property(strong,nonatomic)UITableView *tableView; //表格视图 @property (strong,nonatomic)NSMutableArray *dataObjects; //文字数据 @property (strong,nonatomic)NSMutableArray *imageArrayM; //图像数据 @end
创建主控制器Master的导航栏和按钮,并设置表格视图的数据源和代理
- (void)viewDidLoad { [super viewDidLoad]; //创建UITableView self.tableView = [[UITableView alloc]initWithFrame:self.view.frame style:UITableViewStylePlain]; //创建数组 self.dataObjects = [NSMutableArray arrayWithObjects:@"美女0",@"美女1",@"美女2",nil]; self.imageArrayM = [NSMutableArray arrayWithObjects:[UIImage imageNamed:@"美女0.jpg"],[UIImage imageNamed:@"美女1.jpg"],[UIImage imageNamed:@"美女2.jpg"],nil]; //设置数据源和代理 self.tableView.dataSource = self; self.tableView.delegate = self; [self.view addSubview:self.tableView]; //设置主控制器Master的导航栏和按钮 self.navigationItem.title = @"Master"; self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:nil]; self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemAdd target:self action:nil]; }
实现表格视图的数据源协议方法
#pragma mark -<UITableViewDataSource> //多少行 -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return self.dataObjects.count; } //设置每一个单元格的内容 -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { //1.根据reuseIdentifier,先到对象池中去找重用的单元格对象 static NSString *reuseIdentifier = @"Cell"; UITableViewCell *cell = [self.tableView dequeueReusableCellWithIdentifier:reuseIdentifier]; //2.如果没有找到,自己创建单元格对象 if(cell == nil) { cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:reuseIdentifier]; } //3.设置单元格对象的内容 cell.textLabel.text = [self.dataObjects objectAtIndex:indexPath.row]; return cell; }
实现表格视图的代理协议方法
#pragma mark -<UITableViewDelegate> //选中单元格时,设置详细控制器中的内容 -(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { //获取详细控制器 UINavigationController *detailNAV = [self.splitViewController.viewControllers lastObject]; DetailViewController *detatilVC = (DetailViewController*)[detailNAV topViewController]; //创建图像视图 UIImageView *imageView = [[UIImageView alloc]initWithFrame:detatilVC.view.frame]; [imageView setImage:[self.imageArrayM objectAtIndex:indexPath.row]]; [detatilVC.view addSubview:imageView]; }
//在DEtailViewController.m文件中
设置视图背景颜色
- (void)viewDidLoad { [super viewDidLoad]; //设置视图颜色为白色 [self.view setBackgroundColor:[UIColor whiteColor]]; }
演示结果如下:
开始时:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151917395-2126379090.png)
点击Master,显示Master主控制器:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151930755-1593558769.png)
点击单元格时,Detail详细控制器显示的内容:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151941208-15873822.png)
点击屏幕,关闭Master主控制器:
![](https://images2015.cnblogs.com/blog/791499/201510/791499-20151021151952161-2054829373.png)
相关文章推荐
- uGUI事件系统简述及使用方法总结
- Grunt 之 RequireJS
- pat1051Pop Sequence (25)
- rpmbuild
- UIPickerView与UIDatePicker
- 读《认知与设计:理解UI设计准则》第四章
- iOS uitableview 局部刷新
- 关于UIView的autoresizingMask属性的研究
- Android 界面—UI 开发控件
- StringBuffer和StringBuilder的区别
- Android UI 设计——TextView 控件
- Android UI 设计——Button 控件
- Android UI 设计——EditText 控件
- 上边的UITableViewCell覆盖下边的UITableViewCell的问题
- Android UI 设计——RadioButton 和 CheckBox 控件
- LR中select next row和update value on的设置
- Android UI 设计——ImageView 和 ImageButton 控件
- Android UI 设计(10):ListView 控件和自定义 Adapter(四)
- HDU 4908 BestCoder Sequence(BestCoder Round #3)
- Android UI 设计(11):ListView 控件使用优化(五)