iOS Android Material Design使用UICollectionView进行分层计时

Question

我想使用UICollectionView在iOS中使用Android Material Design Hierarchical Timing引入动画

让我们说它是一个collectionView,调整视图大小不是问题,以及时的方式做这个动画的最佳做法是什么.如何执行延迟

Answer 1

实现此目的的一种方法是使用计时器一次添加一个单元格，并在这些单元格出现到窗口时将其扩展至完整大小。

#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