iPhone开发之UIPageControl

今天我们介绍iPhone的UIPageControl。UIPageControl就是一串连续的小圆点，代表不同的视图，点击小圆点，会转到相应的视图，并且该小圆点会高亮显示。如下图鼠标所指处：

下面开始：

1.

新建一个 View-based Application，名称为PageControl：

2.

修改 PageControlViewController.h 如下：

[cpp] view plaincopy

1. //  
2. //  PageControlViewController.h  
3. //  PageControl  
4. //  
5. //  Created by HuTao on 8/20/12.  
6. //  Copyright __MyCompanyName__ 2012. All rights reserved.  
7. //  
8.   
9. #import <UIKit/UIKit.h>  
10.   
11.   
12. @interface PageControlViewController : UIViewController  
13. {  
14.     UIImageView * imageView;  
15.     UIPageControl * pageControl;  
16.       
17.     NSArray * imageNameList;  
18. }  
19.   
20.   
21. @property (retain, nonatomic) UIImageView * imageView;  
22. @property (retain, nonatomic) UIPageControl * pageControl;  
23. @property (retain, nonatomic) NSArray * imageNameList;  
24.   
25.   
26. @end  

修改 PageControlViewController.m 如下：

[cpp] view plaincopy

1. //  
2. //  PageControlViewController.m  
3. //  PageControl  
4. //  
5. //  Created by HuTao on 8/20/12.  
6. //  Copyright __MyCompanyName__ 2012. All rights reserved.  
7. //  
8.   
9. #import "PageControlViewController.h"  
10.   
11.   
12. @implementation PageControlViewController  
13.   
14.   
15. @synthesize pageControl;  
16. @synthesize imageView;  
17. @synthesize imageNameList;  
18.   
19.   
20. // Implement viewDidLoad to do additional setup after loading the view, typically from a nib.  
21. - (void)viewDidLoad  
22. {  
23.     [super viewDidLoad];  
24.       
25.     int width = self.view.frame.size.width;  
26.     int height = self.view.frame.size.height;  
27.     int pageControlHeight = 20;  
28.       
29.     imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, width, height - pageControlHeight)];  
30.     pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, height - pageControlHeight, width, pageControlHeight)];  
31.   
32.     imageNameList = [[NSArray alloc] initWithObjects: @"1.jpg", @"2.jpg", @"3.jpg", @"4.jpg", @"5.jpg", nil];  
33.   
34.     pageControl.numberOfPages = [imageNameList count];  
35.     pageControl.currentPage = 0;  
36.     pageControl.hidesForSinglePage = YES;  
37.     pageControl.backgroundColor = [UIColor blackColor];  
38.     [pageControl addTarget:self action:@selector(pageControlChanged:) forControlEvents:UIControlEventValueChanged];    
39.   
40.     [imageView setImage:[UIImage imageNamed:[imageNameList objectAtIndex:pageControl.currentPage]]];  
41.       
42.     [self.view addSubview:imageView];  
43.     [self.view addSubview:pageControl];  
44. }  
45.   
46.   
47. - (IBAction)pageControlChanged:(id)sender  
48. {  
49.     //按如下方法获取 UIPageControl:  
50.     //UIPageControl * control = (UIPageControl *)sender;  
51.   
52.     int page = pageControl.currentPage;  
53.     NSLog(@"currentPage: %d", page);  
54.       
55.     [imageView setImage:[UIImage imageNamed:[imageNameList objectAtIndex:page]]];  
56. }  
57.   
58.   
59. - (void)viewDidUnload  
60. {  
61.     imageView = nil;  
62.     pageControl = nil;  
63. }  
64.   
65.   
66. - (void)dealloc  
67. {  
68.     [super dealloc];  
69.       
70.     [imageView release];  
71.     [pageControl release];  
72. }  
73.   
74.   
75.   
76. @end  

说明：

 UIPageControl 有几个属性和方法：

numberOfPages：有几个可以切换的视图，即几个小圆点

currentPage：当前视图的小圆点序号

addTarget：设置当点击小圆点时应该调用的回调函数

hidesForSinglePage：当只有一个视图时是否隐藏小圆点

4.

将要显示的图片加入 Project，运行结果如下：

第一张图：

第四张图：

最后我把完整代码也上传上来了：

http://download.csdn.net/detail/htttw/4514206

最后还要说的是，本程序在点击 UIPageControl 时会立即切换到新的视图，更好的办法是使用 UIScrollView 滚动视图。另外 UIPageControl 往往作为 UIScrollView 的附加物（划动 UIScrollView 转到下一个视图的同时 UIPageControl 小圆点也会跟着改变），这些功能以后再实现。