自定义UIPageControl 控件(一)
大家都见过iPhone上的那几个小点点了。那就是iPhone用来控制翻页的UIPageControl控件，但是许多人不会用UIPageControl，又不愿意去看Apple的文档和例子。所以首先我们来讲讲这个控件的使用。
1、新建项目UsingPageControl。删除MainWindow.xib文件。 在Resources组中添加几张图片，在这里我随便找了几张动物的图片，你也可以另外找几张。
2、编辑delegate类代码，#import "UsingPageControlViewController.h"，在application:didFinishLaunchingWithOptions:方法中加入以下代码：
UIViewController *vc=[[UsingPageControlViewController alloc]init];
[window addSubview:vc.view];
3、加入框架QuartzCore.framework。然后新建类UsingPageControlViewController,继承UIViewController。在interface中声明必要变量：
#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>
@interfaceUsingPageControlViewController : UIViewController {
UIPageControl* pageCtr;
NSMutableArray* pages;
UIView *pageView;
int previousPage;
}
-(void)transitionPage:(int)from toPage:(int)to;
-(CATransition *) getAnimation:(NSString *) direction;
@end
4、在implementation中，编辑init方法，把我们要用到的3个图片文件名放入到pages数组：
-(id)init{
if (self = [super init]) {
pages=[[NSMutableArray alloc]initWithObjects:@"Dolphin.png",
@"Butterfly.png",
@"Hippopotamus.png",
nil];
}
return self;
}
5、编辑loadView方法，在上方放入一个UIPageControl用于翻页，在下方放入一个UIView用于显示图片，注意上下分开，不要重叠，避免UIPageControl被遮挡住：
-(void)loadView{
[super loadView];
CGRect viewBounds = self.view.frame;
viewBounds.origin.y = 0.0;
viewBounds.size.height = 460.0;
//控件区域
pageCtr=[[UIPageControl alloc]initWithFrame:CGRectMake(viewBounds.origin.x,
viewBounds.origin.y,
viewBounds.size.width,
60)];
pageCtr.backgroundColor=[UIColor blackColor];
pageCtr.numberOfPages = 3;
pageCtr.currentPage = 0;
// 设定翻页事件的处理方法
[pageCtr addTarget:self action:@selector(pageTurn:)
forControlEvents:UIControlEventValueChanged];
[self.view addSubview:pageCtr];
// 页面区域
CGRect contentFrame=CGRectMake(viewBounds.origin.x,
viewBounds.origin.y+60,
viewBounds.size.width,
viewBounds.size.height-60);
pageView=[[UIView alloc]initWithFrame:contentFrame];
[pageView setBackgroundColor:[UIColor brownColor]];
// 添加两个imageview，动画切换时用
for (int i=0; i<2; i++) {
[pageView addSubview:[[UIImageView alloc] initWithFrame:CGRectMake(0,
0,
contentFrame.size.width,
contentFrame.size.height)]];
}
// 设置最上面的subview（显示的图片）
[[[pageView subviews] lastObject] setImage:[UIImage imageNamed:
[pages objectAtIndex:0]]];
[self.view addSubview:pageView];
}
6、翻页控件在感知到翻页动作时，会调用pageTurning方法：
-(void)pageTurn:(UIPageControl*)pageControl{
[self transitionPage:previousPage toPage:pageControl.currentPage];
previousPage=pageControl.currentPage;
}
7、transitionPage方法是这样定义的：
-(void)transitionPage:(int)from toPage:(int)to{
NSLog(@"previouspage:%d",from);
NSLog(@"currentpage:%d",to);
CATransition *transition;
if (from!=to) {
if(from<to){
transition=[self getAnimation:kCATransitionFromLeft];
}else{
transition=[self getAnimation:kCATransitionFromRight];
}
// 取出pageView的下面的图片作为准备显示的图片
UIImageView *newImage=(UIImageView *)[[pageView subviews] objectAtIndex:0];
// 将视图修改为要显示的图片
[newImagesetImage:[UIImage imageNamed:[pages objectAtIndex:to]]];
// 将pageView的上下图片交换
[pageView exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
// 显示上面的图片，隐藏下面的图片
[[pageView.subviews objectAtIndex:0] setHidden:YES];
[[pageView.subviews objectAtIndex:1] setHidden:NO];
// 设置转换动画
[[pageView layer] addAnimation:transition forKey:@"pageTurnAnimation"];
}
}
8、其中getAnimation方法根据用户手指滑动的方向返回CATransition转换动画：
// 返回一个转换动画
-(CATransition *) getAnimation:(NSString *) direction
{
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setType:kCATransitionPush];
[animation setSubtype:direction];
[animation setDuration:1.0f];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
return animation;
}
这是一个翻页动画，通过其subtype属性设定翻页从哪边开始：上、下、左、右4个方向。duration属性是动画转换的时间；timingFunction属性指定转换过程中要使用的特效，使用常量字符串指定5种不同的效果（但不知什么原因，在这里不管设成什么值，都只有一种效果：淡入淡出）。
程序最终效果如下：
http://img.ph.126.net/OOXkrJ0gGIDLFYbTK-216g==/1347139238554061973.png
