CoverFlow特效实现（1）
Cover flow是苹果⾸创的将多⾸歌曲的封⾯以3D界⾯的形式显⽰出来的⽅式。如下图所⽰：
随处可见的Cover Flow特效
iTunes：在iTunes⾳乐中点击搜索框左边“查看”项第三个，即以cover flow形式显⽰专辑封⾯（前提是你得添加插图或⾳乐⾃带插图），也可以在全屏模式使⽤
iPhone/iPod Touch：在竖屏模式播放⾳乐，iPhone只会显⽰⼀张专辑的封⾯；但当⽤户将机⾝旋转为横屏模式后，则能看到多⾸歌曲的封⾯以3D界⾯的形式显⽰出来，⽤⼿指左右的滑动能够进⾏歌曲的选择，点击相应的专辑封⾯则会显⽰该张唱⽚的曲⽬，点击相应歌曲即可开始播放。
苹果官⽹：官⽹上有以Flash展⽰的cover flow界⾯
iPod NANO3/4/5：基本类似于在iphone中的操作，利⽤触摸轮滑动使封⾯转换
Safari 4：使⽤ Cover Flow，您可以像在 iTunes 中翻看专辑插图⼀样轻松地翻看⽹站。Cover Flow 可以将您的书签和历史记录显⽰为⼤图预览，这样您就能⽴即到⽹站。要查看 Cover Flow 如何⼯作，请单击 Safari“书签”栏左端的打开书本图标来打开书签列表。在“精选”列表中选择“历史记录”或您要查
看其标签的精选。使⽤⽔平滚动条来翻看⽹页预览。您还可以使⽤⿏标上的滚动按钮来翻看预览。如果您的触控板已配置为⽀持触控板⼿势，则您可以左右扫动。
特效制作
⽅法⼀：UICoverFlowLayer
正式的SDK并未包含UICoverFlowLayer，但是它仍然是标准的uikit。通过steve nygard的类转储(class-dump), 能从uikit框架中提取UICoverFlowLayer头⽂件。
由于UICoverFlowLayer是私有的，⽆法应⽤于应⽤程序(⽆法通过苹果的审查)，所以在此简单介绍使⽤⽅法：将UICoverFlowLayer.h⽂件拷贝到⼯程中
创建cover flow视图，并将UICoverFlowLayer图层分配到视图图层中
UICoverFlowLayer *cfLayer = [[UICoverFlowLayer alloc] initWithFrame:frame numberOfCovers:count];
[[self layer] addSublayer:cfLayer];
网页特效小人源码视图发送dragFlow:atPoint消息，以处理与Cover Flow图层的触摸和拖动的交互过程
构建cover flow视图控制器，分配和初始化视图，并提供委托和数据源⽅法。
⽅法⼆：OpenFlow
OpenFlow是⼀个⽤于实现Cover Flow特效的开源库，它是基于Quartz实现的，能很好的实现Cover Flow特效，同时⼜易于使⽤。
OpenFlow是⼀个⽤于实现Cover Flow特效的开源库，它是基于Quartz实现的，能很好的实现Cover Flow特效，同时⼜易于使⽤。使⽤OpenFlow的基本步骤如下：
创建⼯程
添加OpenFlow源代码到⼯程中
添加QuartzCore和CoreGraphics框架到⼯程中
定义CoverFlowViewController(⾃定义)类
在CoverFlowViewController.h中导⼊”AFOpenFlowView.h”
实现AFOpenFlowViewDelegate类和AFOpenFlowDataSource协议
// CoverFlowViewController.h
// CoverFlow
//
// Created by Avinash on 4/7/10.
// Copyright Apple Inc 2010. All rights reserved.
//
#import
#import "AFOpenFlowView.h"
@interface CoverFlowViewController : UIViewController {
// Queue to hold the cover flow images
NSOperationQueue *loadImagesOperationQueue;
}
@end
实现CoverFlowViewController类
加载图⽚
- (void)viewDidLoad {
[super viewDidLoad];
// loading images into the queue
loadImagesOperationQueue = [[NSOperationQueue alloc] init];
NSString *imageName;
for (int i=0; i < 10; i++) {
imageName = [[NSString alloc] initWithFormat:@"cover_%d.jpg", i];
[(AFOpenFlowView *)self.view setImage:[UIImage imageNamed:imageName] forIndex:i];
[imageName release];
NSLog(@"%d is the index",i);
}
[(AFOpenFlowView *)self.view setNumberOfImages:10];
}
实现委托⽅法，以设置Cover Flow默认图⽚及通知哪幅图⽚被选中
//delegate protocols
// delegate protocol to tell which image is selected
- (void)openFlowView:(AFOpenFlowView *)openFlowView selectionDidChange:(int)index{
NSLog(@"%d is selected",index);
}
// setting the image 1 as the default pic
- (UIImage *)defaultImage{
return [UIImage imageNamed:@"cover_1.jpg"];
}
修改xib⽂件中视图的类UIView为AFOpenFlowView(重要)
完成上述步骤之后，就可以运⾏⼀下程序看⼀下效果了。虽然与苹果的Cover Flow效果还是有点差距，但还是不错哦。
⽅法三：FlowCover
FlowCover也是⼀个开源库，它是基于OpenGL ES。FlowCover的源代码⾮常简单，只有FlowCoverView和DataCache两个类。这两个类的功能如下：
FlowCoverView：定义主视图。这是⼀个OpenGL ES视点，可以被嵌套在其它视图中。
DataCache：提供⼀个简单的数据缓存⽅案，保存⼀定量的对象，当对象超过最⼤值时，旧的对象会被舍弃。使⽤FlowCover的基本步骤如下：
创建⼯程
添加FlowCover源代码到⼯程中
然后就可以像⽤其它UIView⼀样使⽤FlowCoverView了
FlowCover中需要实现FlowCoverViewDelegate协议，该协议中主要有三个⽅法：
-(int)flowCoverNumberImages:(FlowCoverView *)view;
返回FlowCoverView视图中显⽰的图⽚数量
-(UIImage *)flowCover:(FlowCoverView *)view cover:(int)cover;
返回FlowCoverView视图中⽤cover指定的图⽚
-(void)flowCover:(FlowCoverView *)view didSelect:(int)cover;
当⽤户触击FlowCoverView中的cover时调⽤。
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论