樓主看了下著名code4app網站,上面有很多實現無限輪播的方法,但是很酷炫的動畫并沒有,于是樓主本著有資源一定共享,有湯大家一起喝的無私奉獻心里寫了這篇文章,來分享一篇自己寫的無限輪播動畫 _ .
源代碼在這里, 效果非常好看,建議大家下載源碼以供研究.https://github.com/damowanglidong/LDEndlessShow/tree/master/LDEndlessShow
下面就簡單的介紹下我所寫的框架
先上幾張效果圖,首先是一個tablerViewController,而它的headerView先是在屏幕的最下方,然后以重力加速度的形式往上飄,當碰擊到導航欄的時候,會有彈性效果(來回彈擊幾下),然后以轉場動畫的形式進行無限翻轉,并且樓主添加了點擊事件.
屏幕快照 2016-04-02 下午10.13.49.png
或者在主頁的界面,可以選擇動畫的效果,也可以切換是否添加重力引擎,不添加則直接進行轉場動畫.兩種方式都是一句代碼實現,我指的是轉場動畫與普通輪播,重力引擎的話我是寫在了控制器中,當然樓主前天剛寫的,還有很多東西需要完善_
好了.閑話不多說了,下面是樓主轉場動畫無限輪播的思路與代碼:
1.先自定義一個animationView繼承UIview,并重寫它的構造方法
- (instancetype)initWithFrame:(CGRect)frame withImageArray:(NSArray *)array withTypeName:(NSString *)typeName
{
if (self = [super initWithFrame:frame])
{
self.index= -1;
self.typeName = typeName;
self.imgArray = array;
[self initImageView];
[self initPageControl];
[self initAnimation];
}
return self;
}
2.懶加載轉場動畫,設置轉場動畫的屬性,typeName為傳入進來的轉場動畫的效果形式
- (CATransition *)transition
{
if (_transition == nil)
{
_transition = [[CATransition alloc] init];
_transition.type = self.typeName;
_transition.duration = 2.0;
_transition.subtype = kCATransitionFromRight;
}
return _transition;
}
3.在View上面添加一個imageView, self.imgArray為傳入進來的裝有圖片的名字字符串或者是圖片的網絡地址數組
{
self.imgView = [[UIImageView alloc] initWithFrame:self.bounds];
self.imgView.image = [UIImage imageNamed:self.imgArray[0]];
self.imgView.userInteractionEnabled = YES;
[self addSubview:self.imgView];
}
4.添加一個定時器 NSTimer 或者CADisplayLink都可以
- (void)initAnimation
{
[self addPageCount];
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
self.displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(addPageCount)];
[self.displayLink addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
self.displayLink.frameInterval = 150;
});
}
5.在計時器調用的方法addPageCount里面,改變imageView的image就可以了,關于里面的一些很簡單的邏輯我就不一一說了,最后記得將轉場動畫添加到imageView的layer層.
- (void)addPageCount
{
self.index ++;
if (self.index == self.imgArray.count)
{
self.index = 0;
}
self.pageControl.currentPage = self.index;
if ([self.imgArray[self.index] hasPrefix:@"http://"])
{
//通過圖片地址下載圖片
[self.imgView sd_setImageWithURL:self.imgArray[self.index]];
}else{
NSString * imgName = self.imgArray[self.index];
self.imgView.image = [UIImage imageNamed:imgName];
}
self.imgView.tag = self.index;
[self.imgView.layer addAnimation:self.transition forKey:@"anim"];
UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(clickImg:)];
[self.imgView addGestureRecognizer:tap];
}
6.給UIView添加一個分類,在分類里面創建一個animationView的對象,調用第一步寫的構造方法就可以了.
+ (instancetype)endlessAnimationWithRect:(CGRect)frame withArray:(NSArray *)array target:(id)obj animationTypeName:(NSString *)name
{
LDAnimationView * animationView = [[LDAnimationView alloc] initWithFrame:frame withImageArray:array withTypeName:name];
animationView.delegate = obj;
return animationView;
}
7.使用的時候導入分類的頭文件,一句代碼即可實現轉場動畫無限輪播,很簡單,很酷炫,裝逼必備!
self.tableView.tableHeaderView = [UIView endlessAnimationWithRect:CGRectMake(0, 0, self.view.bounds.size.width, 200) withArray:array target:self animationTypeName:self.typeName];
還有一種普通的scrollView實現的這里就不說了,想試一試的可以到github https://github.com/damowanglidong/LDEndlessShow/tree/master/LDEndlessShow上搜索
LDEndlessShow,上面有我的開源源碼,當然我們也可以相互交流_
下面是動畫展示:
其實配合動力引擎更好看呢,這里就不一一展示了,希望這篇文章能幫的到你.喜歡就給個贊吧_
