image
,
iOS9里面的多任務(wù)效果如上圖所示夺谁，原理其實(shí)跟簡單，只要計(jì)算好各個卡片之間的距離以及偏移量就行，現(xiàn)在我們利用iCarousel來實(shí)現(xiàn)這個效果低矮，首先附上代碼：
//
// ViewController.m
// Icarouse
//
// Created by 魏信洋 on 2018/5/18.
// Copyright ? 2018年 com.LifeTreasure.www. All rights reserved.
//
#import "ViewController.h"
#import <iCarousel.h>
@interface ViewController ()<iCarouselDelegate,iCarouselDataSource>
@property (nonatomic, strong) iCarousel *carousel;
@property (nonatomic, assign) CGSize cardSize;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
CGFloat cardWidth = [UIScreen mainScreen].bounds.size.width*5.0f/7.0f;
self.cardSize = CGSizeMake(cardWidth, cardWidth*16.0f/9.0f);
self.view.backgroundColor = [UIColor blackColor];
self.carousel = [[iCarousel alloc] initWithFrame:[UIScreen mainScreen].bounds];
[self.view addSubview:self.carousel];
self.carousel.delegate = self;
self.carousel.dataSource = self;
self.carousel.type = iCarouselTypeCustom;
self.carousel.bounceDistance = 0.2f;
}
- (NSInteger)numberOfItemsInCarousel:(iCarousel *)carousel
{
return 15;
}
- (CGFloat)carouselItemWidth:(iCarousel *)carousel
{
return self.cardSize.width;
}
- (UIView *)carousel:(iCarousel *)carousel viewForItemAtIndex:(NSInteger)index reusingView:(UIView *)view
{
UIView *cardView = view;
if ( !cardView )
{
cardView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.cardSize.width, self.cardSize.height)];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:cardView.bounds];
[cardView addSubview:imageView];
imageView.contentMode = UIViewContentModeScaleAspectFill;
imageView.backgroundColor = [UIColor whiteColor];
cardView.layer.shadowPath = [UIBezierPath bezierPathWithRoundedRect:imageView.frame cornerRadius:5.0f].CGPath;
cardView.layer.shadowRadius = 3.0f;
cardView.layer.shadowColor = [UIColor blackColor].CGColor;
cardView.layer.shadowOpacity = 0.5f;
cardView.layer.shadowOffset = CGSizeMake(0, 0);
CAShapeLayer *layer = [CAShapeLayer layer];
layer.frame = imageView.bounds;
layer.path = [UIBezierPath bezierPathWithRoundedRect:imageView.bounds cornerRadius:5.0f].CGPath;
imageView.layer.mask = layer;
}
return cardView;
}
- (CATransform3D)carousel:(iCarousel *)carousel itemTransformForOffset:(CGFloat)offset baseTransform:(CATransform3D)transform
{
NSLog(@"%f",offset);
return CATransform3DTranslate(transform, offset * self.cardSize.width, 0, 0);
}
@end
最后一個代理方法決定了你滑動卡片的動畫效果，這個其實(shí)是可以自定義的
被冒，只要計(jì)算出offset就可以實(shí)現(xiàn)和iOS9多任務(wù)的效果军掂，具體的計(jì)算方法推薦看里脊串的開發(fā)隨筆，我這里也只是摘錄下來的姆打，然后附上鏈接!(http://adad184.com/2015/08/01/advanced-icarousel-tutorial-copycat-of-ios9-task-tray/).
然后最后附上最后的實(shí)現(xiàn)代碼：
//
// ViewController.m
// Icarouse
//
// Created by 魏信洋 on 2018/5/18.
// Copyright ? 2018年 com.LifeTreasure.www. All rights reserved.
//
#import "ViewController.h"
#import <iCarousel.h>
@interface ViewController ()<iCarouselDelegate,iCarouselDataSource>
@property (nonatomic, strong) iCarousel *carousel;
@property (nonatomic, assign) CGSize cardSize;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
CGFloat cardWidth = [UIScreen mainScreen].bounds.size.width*5.0f/7.0f;
self.cardSize = CGSizeMake(cardWidth, cardWidth*16.0f/9.0f);
self.view.backgroundColor = [UIColor blackColor];
self.carousel = [[iCarousel alloc] initWithFrame:[UIScreen mainScreen].bounds];
[self.view addSubview:self.carousel];
self.carousel.delegate = self;
self.carousel.dataSource = self;
self.carousel.type = iCarouselTypeCustom;
self.carousel.bounceDistance = 0.2f;
}
- (NSInteger)numberOfItemsInCarousel:(iCarousel *)carousel
{
return 15;
}
- (CGFloat)carouselItemWidth:(iCarousel *)carousel
{
return self.cardSize.width;
}
- (UIView *)carousel:(iCarousel *)carousel viewForItemAtIndex:(NSInteger)index reusingView:(UIView *)view
{
UIView *cardView = view;
if ( !cardView )
{
cardView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.cardSize.width, self.cardSize.height)];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:cardView.bounds];
[cardView addSubview:imageView];
imageView.contentMode = UIViewContentModeScaleAspectFill;
imageView.backgroundColor = [UIColor whiteColor];
cardView.layer.shadowPath = [UIBezierPath bezierPathWithRoundedRect:imageView.frame cornerRadius:5.0f].CGPath;
cardView.layer.shadowRadius = 3.0f;
cardView.layer.shadowColor = [UIColor blackColor].CGColor;
cardView.layer.shadowOpacity = 0.5f;
cardView.layer.shadowOffset = CGSizeMake(0, 0);
CAShapeLayer *layer = [CAShapeLayer layer];
layer.frame = imageView.bounds;
layer.path = [UIBezierPath bezierPathWithRoundedRect:imageView.bounds cornerRadius:5.0f].CGPath;
imageView.layer.mask = layer;
}
return cardView;
}
- (CATransform3D)carousel:(iCarousel *)carousel itemTransformForOffset:(CGFloat)offset baseTransform:(CATransform3D)transform
{
CGFloat scale = [self scaleByOffset:offset];
CGFloat translation = [self translationByOffset:offset];
return CATransform3DScale(CATransform3DTranslate(transform, translation * self.cardSize.width, 0, offset), scale, scale, 1.0f);
}
- (void)carouselDidScroll:(iCarousel *)carousel
{
for ( UIView *view in carousel.visibleItemViews)
{
CGFloat offset = [carousel offsetForItemAtIndex:[carousel indexOfItemView:view]];
if ( offset < -3.0 )
{
view.alpha = 0.0f;
}
else if ( offset < -2.0f)
{
view.alpha = offset + 3.0f;
}
else
{
view.alpha = 1.0f;
}
}
}
//形變是線性的就ok了
- (CGFloat)scaleByOffset:(CGFloat)offset
{
return offset*0.04f + 1.0f;
}
//位移通過得到的公式來計(jì)算
- (CGFloat)translationByOffset:(CGFloat)offset
{
CGFloat z = 5.0f/4.0f;
CGFloat n = 5.0f/8.0f;
//z/n是臨界值 >=這個值時 我們就把itemView放到比較遠(yuǎn)的地方不讓他顯示在屏幕上就可以了
if ( offset >= z/n )
{
return 2.0f;
}
return 1/(z-n*offset)-1/z;
}
@end
