iOS Android Material Design使用UICollectionView进行分层计时 [英] iOS Android Material Design Hierarchical Timing using UICollectionView
问题描述
我想制作Android Material Design推出的动画使用UICollectionView在iOS中进行分层计时
I want to do the animation introduced by Android Material Design Hierarchical Timing in iOS using UICollectionView
让我们说它是一个collectionView,调整视图大小不是问题,这个动画的最佳做法是什么以及时的方式。如何执行延迟
Lets say its a collectionView, and resizing the view is not an issue, what would be the best practice to do this animation in that timely fashion. How to perform the delay
推荐答案
执行此操作的一种方法是使用计时器一次添加一个单元格,并且当这些单元格进入窗口时,将这些单元格扩展为完整大小。
One way to do this would be to add the cells one at a time with a timer, and have those cells expand to full size as they come on to the window.
#import "ViewController.h"
#import "RDCollectionViewCell.h"
@interface ViewController () <UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>
@property (weak,nonatomic) IBOutlet UICollectionView *collectionview;
@property (strong,nonatomic) NSMutableArray *mutableArray;
@property (strong,nonatomic) NSArray *data;
@end
@implementation ViewController
-(void)viewDidLoad {
[super viewDidLoad];
self.mutableArray = [NSMutableArray new];
self.data = @[@"one", @"two", @"three", @"four", @"five", @"six", @"seven", @"eight", @"nine", @"ten"];
[self performSelector:@selector(startTimer) withObject:nil afterDelay:0.5];
}
-(void)startTimer {
[NSTimer scheduledTimerWithTimeInterval:.05 target:self selector:@selector(addCells:) userInfo:nil repeats:YES];
}
-(void)addCells:(NSTimer *) timer {
static int counter = 0;
[self.mutableArray addObject:self.data[counter]];
counter ++;
[self.collectionview insertItemsAtIndexPaths:@[[NSIndexPath indexPathForItem:self.mutableArray.count -1 inSection:0]]];
if (self.mutableArray.count == self.data.count) {
[timer invalidate];
}
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return self.mutableArray.count;
}
-(UICollectionViewCell *) collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
RDCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath];
cell.contentView.backgroundColor = (indexPath.row % 2 == 0)? [UIColor colorWithRed:180/255.0 green:210/255.0 blue:254/255.0 alpha:1] : [UIColor colorWithRed:50/255.0 green:167/255.0 blue:85/255.0 alpha:1];
cell.label.text = self.mutableArray[indexPath.row];
return cell;
}
在自定义单元格类中,
@implementation RDCollectionViewCell
-(void)awakeFromNib {
self.contentView.transform = CGAffineTransformMakeScale(0.01, 0.01);
}
-(void)didMoveToWindow {
[UIView animateWithDuration:0.3 delay:0.1 options:0 animations:^{
self.contentView.transform = CGAffineTransformIdentity;
} completion: nil];
}
项目可以在这里找到, http://jmp.sh/aDw846R
The project can be found here, http://jmp.sh/aDw846R
这篇关于iOS Android Material Design使用UICollectionView进行分层计时的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!