一百、创建基于页面视图控制器的应用程序

来源：互联网发布：档案管理系统软件源码编辑：程序博客网时间：2024/09/21 08:57

在Xcode当中创建基于页面控制器的应用程序时，我们有一个选择就是利用 Xcode提供的基于页面的应用程序模板。当我们选择基于页面的应用程序模板后，Xcode 会生成一个用12个页面显示一年中各个月份的应用程序。这个模板使人感到很奇怪，因为这个模板所提供的不仅是一个我们在其之上创建应用程序的基础而相当于是一个示例程序了。虽然这对于最初的学习很有用，但是除非在12个页面上写上12个月的名称正好是你所需要的，否则我们必须把多余的功能去除，然后才能用于其它用途。

与其选择 Xcode提供的基于页面的应用程序模板，我们在这篇博文中要选择单视图应用程序模板并且在其之上实现页面功能。

创建项目

我们启动 Xcode 并且创建一个新的iOS单视图应用程序。我们将这个应用程序的产品名称和物件类型名称前缀设定为 pageApp。我们还要确保使用故事板（Use Storyboard）选项没有被选择。

添加内容视图控制器

在这里这个例子当中我们要使用一个视图控制器物件向用户展示页面。这个视图控制器中的视图上会包含一个网页视图物件（UIWebView类型）根据当前的页数显示出不同的html内容。另外这个视图控制器物件还需要另外一个物件来容纳需要显示的html内容。

为了添加这个视图控制器，我们需要创建一组Objective-c Class文件。创建新的Objective-c Class文件时，将 Class选项填写为 ContentViewController 并且确保选择了 With XIB for user interface这个选项。

选择 ContentViewController.h这个文件并且将这个文件修改为这样：

1
2
3
4
5
6
7
8
9
#import <UIKit/UIKit.h>
@interface ContentViewController : UIViewController
@property (strong,nonatomic) IBOutlet UIWebView *webView;
@property (strong,nonatomic) id dataObject;
@end

这样一来每个ContentViewController类型的物件都包含一个网页视图物件webView 和一个任意类型的数据物件dataObject。

接着打开 ContentViewController.xib这个文件再从物件库中拖一个网页视图（Web View）放到画布中的视图上。

然后按住键盘上的control键并且用鼠标点住 File’s Owner图标不放。再将鼠标光标拖到画布中的网页视图上并且放开鼠标。最后在弹出来的菜单中选择 webView这个选项。

每次用户在应用程序中翻页时，适用于UIPageViewController类型物件的一项措施都会得以实施从而创建一个新的ContentViewController类型的物件并且将正确的html内容存储在这个ContentViewController物件所包含的数据物件dataObject当中以便网页视图物件webView 显示出来。而在ContentViewController类型的物件所包含的视图显示出来之前，适用于ContentViewController这类物件的措施viewWillAppear: 会得以执行，于是我们要在viewWillAppear:这项措施中将数据物件dataObject中的内容存储在网页视图物件webView当中。所以我们打开 ContentViewController.m这个文件并且在@implement命令之后加入

1
@synthesizewebView,dataObject;

这行语句，用以生成 webView、setWebView: 和 dataObject、setDataObject:这四项措施。

同时还要在这个文件中加入 viewWillAppear这项措施：

1
2
3
4
5
6
7
8
9
-(void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];
    [self.webView loadHTMLString:self.dataObject baseURL:[NSURL URLWithString:@""]];
}

到目前为止，我们已经设计好了内容视图控制器。下一步我们要设计应用程序的数据模型。

创建数据模型

这个应用程序的数据模型由一个数组物件构成，这个数据物件包含若干个字符串物件，其中每个字符串物件都是需要显示在各个页面上的html内容。在我们这个例子当中我们把pageAppViewController类型的物件用作页面视图控制器的数据源。同时由于这个原因 pageAppViewController这类物件必须遵循 UIPageViewControllerDataSource这项协议，所以我们打开 pageAppViewController.h这个文件并且将 @interface这行语句修改成这样：

1
@interfacepageAppViewController:UIViewController<UIPageViewControllerDataSource>

以表明 pageAppViewController这类物件遵循 UIPageViewControllerDataSource这项协议。除此之外我们需要在@interface命令和 @end命令之间加入这两行语句：

1
2
3
@property (strong,nonatomic) UIPageViewController *pageViewController;
@property (strong,nonatomic) NSArray *pageContent;

这样每个pageAppViewController类型的物件都会包含一个页面控制器物件pageViewController 和数组物件pageContent。其中数组物件pageContent 用来存储各个页面的html内容。同时不要忘了在pageAppViewController.m这个文件中的@implementation命令后加入

1
@synthesizepageViewController,pageContent;

接着我们要编写一项适用于pageAppViewController这类物件的措施createContentPages：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
-(void)createContentPages
{
    NSMutableArray *pageStrings=[[NSMutableArray alloc] init];
    for(int i=1;i<11;i=i+1)
    {
        NSString *contentString=[[NSString alloc] initWithFormat:@"<html><head></head><body><h1>第%i章</h1><p>这里是利用UIPageViewController显示出来的第%i章的内容。</p></body></html>",i,i];
        [pageStrings addObject:contentString];
    }
    self.pageContent=[[NSArray alloc] initWithArray:pageStrings];
}

在createContentPages这项措施中

1
NSMutableArray*pageStrings=[[NSMutableArrayalloc]init];

这行语句创建了一个数组物件pageStrings 用于存储每个页面所需的html内容。

接下来的for()循环会运行十次，每运行一次，都会创建一个包含html内容的字符串并且将这个字符串添加到数组物件pageStrings当中。

这项措施中最后

1
self.pageContent=[[NSArray alloc] initWithArray:pageStrings];

这行语句将数组物件pageStrings的全部内容存储在createContentPages这项措施的实施对象所包含的数组物件pageContent当中。

另外我们还需要在pageAppViewController类型物件中的视图加载后对这个类型的物件采取 createContentPages这项措施，于是我们将pageAppViewController.m这个文件中的viewDidLoad这项措施修改为这样：

1
2
3
4
5
6
7
8
9
-(void)viewDidLoad
{
    [superviewDidLoad];
    [selfcreateContentPages];
}

现在我们为这个应用程序设计好了内容视图控制器和数据模型，接下来我们需要编写为页面视图控制器提供数据的措施，也就是 UIPageViewControllerDataSource这项协议规定的两项措施，其中一项措施用于生成当前内容视图控制器之后的内容视图控制器，而另外一项措施用于生成当前内容视图控制器之前的内容视图控制器。

由于pageAppViewController这类物件充当页面视图控制器的数据源，所以 UIPageViewControllerDataSource这项协议规定的措施必须适用于 pageAppViewController这类物件，于是我们要在pageAppViewController.m这个文件中编写这些措施。首先我们在pageAppViewController.m这个文件中添加这两项措施：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
-(NSUInteger)indexOfViewController:(ContentViewController *)contentViewController
{
    return [self.pageContent indexOfObject:contentViewController.dataObject];
}
-(ContentViewController *)viewControllerAtIndex:(NSUInteger)index
{
    if(([self.pageContent count]==0)||(index>=[self.pageContent count]))
    {
        return nil;
    }
    ContentViewController *contentViewController=[[ContentViewController alloc] initWithNibName:@"ContentViewController" bundle:nil];
    contentViewController.dataObject=[self.pageContent objectAtIndex:index];
    return contentViewController;
}

其中 indexOfViewController这项措施会收到 ContentViewController类型的视图控制器contentViewController 并且找到这个视图控制器是第几个视图控制器。这是这样办到的：先把视图控制器contentViewController中的数据物件dataObject提取出来，然后对数组物件pageContent 采取 indexOfObject:这项措施从而找出当前视图控制器所包含的数据物件dataObject 是数组物件pageContent中的第几个，于是就知道当前的视图控制器就是第几个视图控制器了。

viewControllerAtIndex:这项措施会收到 NSUInteger类型的无标记整数并且存放在变量index当中。然后变量index的值是几，这项措施就会生成第几个内容视图控制器。在viewControllerAtIndex:这项措施中

1
2
3
4
5
6
7
if(([self.pageContentcount]==0)||(index&gt;=[self.pageContentcount]))
{
    returnnil;
}

这个if()语句会判断需要需要显示的页面数量是否为领以及变量index的值是否超过了需要显示的页面数量。如果这两个条件任意满足一个，则将 nil 作为结果传递回去，也就是什么都不传递回去。

接着

1
ContentViewController *contentViewController=[[ContentViewController alloc] initWithNibName:@"ContentViewController" bundle:nil];

这行语句利用 ContentViewController.xib这个文件中的设计创建了 ContentViewController类型的内容视图控制器contentViewController。

1
contentViewController.dataObject=[self.pageContentobjectAtIndex:index];

这行语句从数组物件pageContent 找出当前页面需要显示的内容并且存储在内容视图控制器contentViewController所包含的数据物件dataObject当中。

1
return contentViewController;

这行语句则将已经准备好了的内容视图控制器contentViewController 作为结果传递回去。

刚刚编写的indexOfViewController: 和 viewControllerAtIndex:这两项措施恰恰是 UIPageViewControllerDataSource这项协议所规定的措施中需要用到的。接下来我们编写 UIPageViewControllerDataSource这项协议所规定的两项措施。这两项措施依然写在pageAppViewController.m这个文件中：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
-(UIViewController*)pageViewController:(UIPageViewController*)pageViewControllerviewControllerBeforeViewController:(UIViewController*)viewController
{
    NSUIntegerindex=[selfindexOfViewController:(ContentViewController*)viewController];
    if((index==0)||(index==NSNotFound))
    {
        returnnil;
    }
    index=index-1;
    return[selfviewControllerAtIndex:index];
}
-(UIViewController*)pageViewController:(UIPageViewController*)pageViewControllerviewControllerAfterViewController:(UIViewController*)viewController
{
    NSUIntegerindex=[selfindexOfViewController:(ContentViewController*)viewController];
    if(index==NSNotFound)
    {
        returnnil;
    }
    index=index+1;
    if(index==[self.pageContentcount])
    {
        returnnil;
    }
    return[selfviewControllerAtIndex:index];
}

其中 viewControllerBeforeViewController:viewController这项措施实施后，我们可以得到 viewController这个内容视图控制器之前的内容视图控制器。而 viewControllerAfterViewController:viewController这项措施实施后，我们可以得到 viewController这个内容视图控制器之后的内容控制器。

在viewControllerBeforeViewController:viewController这项措施中

1
NSUInteger index=[self indexOfViewController:(ContentViewController *)viewController];

这行语句检查当前收到的内容视图控制器是第几个并且将结果存储在变量index当中。

1
2
3
4
5
6
7
if((index==0)||(index==NSNotFound))
{
    returnnil;
}

这个if()语句检查 index的值是否是有效的值，如果不是，则什么也不传递回去。

1
2
3
index=index-1;
return [self viewControllerAtIndex:index];

这两行语句生成了第index-1个内容视图控制器并且作为结果传递回去。

在viewControllerBeforeViewController:viewController这项措施当中

1
2
3
4
5
6
7
8
9
NSUIntegerindex=[selfindexOfViewController:(ContentViewController*)viewController];
if(index==NSNotFound)
{
    returnnil;
}

这几行语句先检查当前收到内容视图控制器是第几个内容视图控制器并且将结果存储在变量index。接着检查当前是不是收到了内容视图控制器，如果没有收到，也就是变量index的值为常熟NSNotFound，则什么也不传递回去。

1
2
3
4
5
6
7
8
9
10
11
 index=index+1;
 if(index==[self.pageContent count])
 {
     return nil;
 }
 return [self viewControllerAtIndex:index];

这几行语句先检查 index+1的值是否超过了所有内容视图控制器的数量，如果没有超过，则创建第index+1个内容视图控制器并且作为结果传递回去。

创建并且初始化页面视图控制器

整个应用程序的最后一步就是创建一个页面视图控制器，也就是 UIPageViewController类型的物件并且正确地对其初始化。因为应用程序启动后，第一个呈现在用户面前的视图就是 pageAppViewController类型视图控制器所包含的视图，而 pageAppViewController类型视图控制器中的视图一加载完毕，适用于这类视图控制器的措施viewDidLoad: 就会得以实施，所以我们在viewDidLoad:这项措施中创建并且初始化页面视图控制器。我们需要将 viewDidLoad:这项措施在原来的基础之上修改为这样：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
-(void)viewDidLoad
{
    [superviewDidLoad];
    [selfcreateContentPages];
    NSDictionary*options=[NSDictionarydictionaryWithObject:[NSNumbernumberWithInteger:UIPageViewControllerSpineLocationMin]forKey:UIPageViewControllerOptionSpineLocationKey];
    self.pageViewController=[[UIPageViewControlleralloc]initWithTransitionStyle:UIPageViewControllerTransitionStylePageCurlnavigationOrientation:UIPageViewControllerNavigationOrientationHorizontaloptions:options];
    self.pageViewController.dataSource=self;
    [pageViewController.viewsetFrame:[self.viewbounds]];
    ContentViewController*initialViewController=[selfviewControllerAtIndex:0];
    NSArray*viewControllers=[NSArrayarrayWithObject:initialViewController];
    [self.pageViewControllersetViewControllers:viewControllersdirection:UIPageViewControllerNavigationDirectionForwardanimated:NOcompletion:nil];
    [selfaddChildViewController:self.pageViewController];
    [self.viewaddSubview:self.pageViewController.view];
    [pageViewControllerdidMoveToParentViewController:self];
}

在编译并且运行这个程序之前，我们需要花一点时间来分析一下 viewDidLoad:这项措施中的代码。

1
NSDictionary *options=[NSDictionary dictionaryWithObject:[NSNumber numberWithInteger:UIPageViewControllerSpineLocationMin] forKey:UIPageViewControllerOptionSpineLocationKey];

这行语句创建了一个NSDictionary类型的物件options 用来存储 UIPageViewControllerOptionSpineLocationKey这个选项。UIPageViewControllerOptionSpineLocationKey这个选项代表了页面视图控制器中 “书脊”的位置。我们这里将 UIPageViewControllerOptionSpineLocationKey的值设定为了 UIPageViewControllerSpineLocationMin，这表明我们将 “书脊”的位置设定在页面视图控制器的最左边。

1
self.pageViewController=[[UIPageViewControlleralloc]initWithTransitionStyle:UIPageViewControllerTransitionStylePageCurlnavigationOrientation:UIPageViewControllerNavigationOrientationHorizontaloptions:options];

这行语句为页面视图控制器分配了内存地址并且对其采取了 initWithTransitionStyle:navigationOrientation:options这项措施。其中第一个参数UIPageViewControllerTransitionStylePageCurl 表明两个视图之间切换的效果为 “翻页”的效果；第二个参数UIPageViewControllerNavigationOrientationHorizontal 表明翻页的方向为左右翻页，而不是上下翻页；第三个参数options中则存储了页面视图控制器的“书脊”位置。

1
self.pageViewController.dataSource=self;

这行语句将页面视图控制器pageViewController的数据源设定为了 pageAppViewController类型的视图控制器。

1
[pageViewController.viewsetFrame:[self.viewbounds]];

这行语句先获取了 pageAppViewController类型视图控制器所包含的视图，然后对其采取了 bounds这项措施从而获得这个视图的大小和位置。最后将页面视图控制器pageViewController中的视图view的大小和位置设定为刚刚获得的数值。

在页面视图控制器显示出来之前，我们必须手工创建第一个内容视图控制器，而

1
ContentViewController *initialViewController=[self viewControllerAtIndex:0];

这行语句就创建了第一个内容视图控制器initialViewController。

1
NSArray*viewControllers=[NSArrayarrayWithObject:initialViewController];

这行语句将第一个内容视图控制器initialViewController 装入数组物件viewControllers当中。接着包含着第一个内容视图控制器的数组物件需要装入页面视图控制器pageViewController：

1
[self.pageViewController setViewControllers:viewControllers direction:UIPageViewControllerNavigationDirectionForward animated:NO completion:nil];

第一个参数UIPageViewControllerNavigationDirectionForward 将导航方向设定为了正向。

1
[selfaddChildViewController:self.pageViewController];

这行语句将 pageAppViewController类型的视图控制器的子视图控制器设定为页面视图控制器pageViewController。

1
[self.viewaddSubview:self.pageViewController.view];

这行语句将页面视图控制器pageViewController所包含的视图view 作为子视图添加到 pageAppViewController类型视图控制器所包含的视图上。

将子视图控制器添加到主视图控制器中后，我们需要对子视图控制器采取 didMoveToParentViewController:这项措施并且将主视图控制器作为参数。

编译并且运行这个程序

编译并且运行这个程序后，我们可以看到这样的效果：

UIPageViewController

一百、创建 基于页面视图控制器的应用程序

创建 项目

添加 内容视图控制器

创建 数据模型