Cover Flow特效实现(2)

Cover Flow特效实现(1)

Cover Flow特效实现(2)

方法四：Tapku框架

Tapku库是一个开源的iOS框架，它包含CoverFlow, Calendar Grid, Char View等等API，总之还是一个比较强大的库。把Tapku加下工程中还是比较复杂的，有兴趣的童鞋可以去网上搜一下。

Tapku下载地址：https://github.com/devinross/tapkulibrary

Tapku中与Cover Flow相关的类主要有如下两个：

• TKCoverflowCoverView: 该类表示的是单个cover。相当于UITableViewCell
• TKCoverflowView:该类相当于UITableView类，用来管理和显示cover flow中图片及实现cover flow效果。

同时还有两个相关的协议：TKCoverflowViewDelegate， TKCoverflowViewDataSource，分别是 TKCoverflowView的代理及数据源。这两个协议分别有一个必须实现的方法，分别是

//TKCoverflowViewDelegate协议的
- (void) coverflowView:(TKCoverflowView*)coverflowView coverAtIndexWasBroughtToFront:(int)index;

//TKCoverflowViewDataSource协议的
- (void) coverflowView:(TKCoverflowView*)coverflowView coverAtIndexWasDoubleTapped:(int)index

在工程中使用 Tapku的CoverFlow步骤如下

• 创建工程
• 添加Tapku库到工程中(该步骤有点麻烦，而且Tapku库比较大，个人认为可以只把CoverFlow相关的类抽取出来直接用)。
• 新建一个视图控制器CoverflowViewController，在该控制器中添加如下代码
  • 在头文件CoverflowViewController.h中

@interface CoverflowViewController : UIViewController <TKCoverflowViewDelegate,TKCoverflowViewDataSource,UIScrollViewDelegate> {
    TKCoverflowView *coverflow; 
    NSMutableArray *covers; // album covers images
    ......
}

• 在CoverflowViewController.m文件中主要有如下处理

//创建视图
- (void) loadView{
    [super loadView];
    ......
    coverflow = [[TKCoverflowView alloc] initWithFrame:self.view.bounds];
    coverflow.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    coverflow.coverflowDelegate = self;
    coverflow.dataSource = self;
    if([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPad){
        coverflow.coverSpacing = 100;
        coverflow.coverSize = CGSizeMake(300, 300);
    }
    [self.view addSubview:coverflow];
    ......
}

//实现代理方法
- (void) coverflowView:(TKCoverflowView*)coverflowView coverAtIndexWasBroughtToFront:(int)index{
}

//生成单个cover flow
- (TKCoverflowCoverView*) coverflowView:(TKCoverflowView*)coverflowView coverAtIndex:(int)index{
    TKCoverflowCoverView *cover = [coverflowView dequeueReusableCoverView];
    if(cover == nil){
        BOOL phone = [UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPhone;
        CGRect rect = phone ? CGRectMake(0, 0, 224, 300) : CGRectMake(0, 0, 300, 600);

        cover = [[[TKCoverflowCoverView alloc] initWithFrame:rect] autorelease]; // 224
        cover.baseline = 224;
    }
    cover.image = [covers objectAtIndex:index%[covers count]];

    return cover;
}

- (void) coverflowView:(TKCoverflowView*)coverflowView coverAtIndexWasDoubleTapped:(int)index{
    TKCoverflowCoverView *cover = [coverflowView coverAtIndex:index];
    if(cover == nil) return;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:cover cache:YES];
    [UIView commitAnimations];
    NSLog(@"Index: %d",index);
}

效果比较

在效果上个人感觉Tapku会好些，渲染流畅，美中不足的是在快速拖动时，停止下来的时候会有抖动的感觉（当然快速拖动这一功能是否需要可视情况而定，如果将此功能禁掉，跟苹果自身的效果还是差不多的）。

OpenFlow的问题在于当改变图像时，新选中的图像会先放大并置于表层，然后才缓动到中间。这是其一个瑕疵。

总体感觉上来讲，苹果自身的CoverFlow的缓动效果还是最好的，有那种渐进渐出的效果，而如上几个开源的库其动画显得有点生硬，有兴趣的童鞋可以试着改进一下。