iOS不得姐項目--pop框架的初次使用

一.pop和Core Animation的區別

　　1.Core Animation的動畫只能添加到layer上

　　2.pop的動畫能添加到任何對象

　　3.pop的底層並非基於Core Animation,是基於CADisplayLink

　　4.Core Animation的動畫僅僅是表象,並不會真正修改對象的frame/Size等值

　　5.pop的動畫實時修改對象的屬性,真正的修改了對象的屬性

二.簡單結構

三.pop框架簡單使用 -- pop不僅可以給layer添加動畫,只要是UIView都可以添加動畫

　　1.給view添加動畫

　　2.給layer添加動畫

四.項目中的動畫效果實現

　　1.利用pop框架做動畫的時候,如果動畫關系到了尺寸或者frame,剛開始控件的尺寸或者frame建議不要設置.有時候會出現問題,如下圖.由於pop框架做動畫是直接修改的屬性,所以可以考慮在fromValue中設置尺寸.

　　2.點擊取消按鈕的動畫,實現思路--直接遍歷了控制器中子控件,通過xib添加的控件最早,所以做動畫的控件從第2個開始遍歷

　　3.監聽按鈕的點擊 -- 要求是動畫依次做完,最后處理對應的事件.

　　難點:pop框架提供了動畫完成的block,自己的目標就是在動畫完成后執行相應的事件處理.例如:點擊了'發段子'按鈕,先做動畫,動畫完成,跳轉到發段子的控制器.

　　解決方案:抽取方法,將點擊取消按鈕的動畫封裝起來,並用block作為參數.點擊取消按鈕,不需要處理事件,那么block就為nil;如果點擊'發段子'之類的按鈕,將需要處理的代碼用block封裝.

　　

- (void)cancleWithBlock:(void(^)())btnClickBlock
{
    // 點擊了取消之后,動畫的過程中就不要處理事件了
    self.view.userInteractionEnabled = NO;
    
    for (int i = 2; i < self.view.subviews.count; i++) {
        
        UIView *subView = self.view.subviews[i];
        POPBasicAnimation *anim = [POPBasicAnimation animationWithPropertyNamed:kPOPViewCenter];
        
        anim.toValue = [NSValue valueWithCGPoint:CGPointMake(subView.centerX, subView.centerY + ChaosScreenH)];
        anim.beginTime = CACurrentMediaTime() + (i - 2) * ChaosTimeInterval;
        anim.duration = 0.25;
        
        [subView pop_addAnimation:anim forKey:nil];
        // 監聽最后一個view動畫的完成
        if (i == self.view.subviews.count - 1) {
            [anim setCompletionBlock:^(POPAnimation *anim, BOOL finished) {
                
                [self dismissViewControllerAnimated:NO completion:nil];
                // 判斷點擊按鈕后要執行的block是否為空
                if (btnClickBlock) {
                    btnClickBlock();
                }
            }];
        }
    }
}

- (IBAction)cancelClick {
    [self cancleWithBlock:nil];
}

- (void)buttonClick:(UIButton *)button
{
    [self cancleWithBlock:^{
        if (button.tag == 0) {
            ChaosLog(@"發視頻");
        } else if (button.tag == 1){
            ChaosLog(@"發圖片");
        } else if (button.tag == 2){
            ChaosLog(@"發段子");
        } else if (button.tag == 3){
            ChaosLog(@"發聲音");
        }
    }];
}

五.最后是項目中的代碼

　　

#import "ChaosPublishViewController.h"
#import "ChaosVerticalButton.h"

#import <POP.h>

@interface ChaosPublishViewController ()

@end
@implementation ChaosPublishViewController

static CGFloat const ChaosTimeInterval = 0.1;
static CGFloat const ChaosAnimSpeed = 15;

- (void)viewDidLoad {
    [super viewDidLoad];
    
    // 先讓所有不能處理事件
    self.view.userInteractionEnabled = NO;
    // 數據
    NSArray *images = @[@"publish-video", @"publish-picture", @"publish-text", @"publish-audio", @"publish-review", @"publish-offline"];
    NSArray *titles = @[@"發視頻", @"發圖片", @"發段子", @"發聲音", @"審帖", @"離線下載"];
    
    // 設置按鈕位置
    CGFloat buttonW = 72;
    CGFloat buttonH = buttonW + 30;
    CGFloat startY = (ChaosScreenH - 2 * buttonH) * 0.5;
    CGFloat startX = 30;
    NSInteger maxCols = 3; // 列數
    CGFloat buttonMargin = (ChaosScreenW - 2 * startX - maxCols * buttonW) / (maxCols - 1);
    // 添加發布類別
    for (int i = 0; i < images.count; i++) {
        ChaosVerticalButton *button = [[ChaosVerticalButton alloc] init];
//        button.width = buttonW; // 用了pop后,直接修改了按鈕的frame,這里可以先不用設置
//        button.height = buttonH; // 設置了動畫效果反而不好
        [button setImage:[UIImage imageNamed:images[i]] forState:UIControlStateNormal];
        [button setTitle:titles[i] forState:UIControlStateNormal];
        [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        button.titleLabel.font = [UIFont systemFontOfSize:14];
        button.tag = i;
        // 添加點擊事件
        [button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
        NSInteger btnRow = i / maxCols; // 按鈕所在行
        NSInteger btnCol = i % maxCols; // 按鈕所在列
        CGFloat buttonEndY = startY + btnRow * buttonH; // 按鈕最終Y值
        CGFloat buttonX = startX + btnCol * (buttonMargin + buttonW); // 按鈕X值
        
        [self.view addSubview:button];
        
        // 設置動畫
        POPSpringAnimation *anim = [POPSpringAnimation animationWithPropertyNamed:kPOPViewFrame];
        anim.fromValue = [NSValue valueWithCGRect:CGRectMake(buttonX, buttonEndY - ChaosScreenH, buttonW, buttonH)];
        anim.toValue = [NSValue valueWithCGRect:CGRectMake(buttonX, buttonEndY, buttonW, buttonH)];
//        anim.springBounciness = 8;
        anim.springSpeed = ChaosAnimSpeed;
        anim.beginTime = CACurrentMediaTime() + i * ChaosTimeInterval;
        [button pop_addAnimation:anim forKey:nil];
    }
    
    // 添加標語
    [self setupSlogan];
}

- (void)setupSlogan
{
    // 添加標語
    UIImageView *sloganImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"app_slogan"]];
    sloganImageView.y = -200;
    [self.view addSubview:sloganImageView];
    
    CGFloat centerX = ChaosScreenW * 0.5;
    CGFloat centerEndY = ChaosScreenH * 0.2;
    CGFloat centerBeginY = centerEndY - ChaosScreenH;
    // 設置動畫
    POPSpringAnimation *anim = [POPSpringAnimation animationWithPropertyNamed:kPOPViewCenter];
    anim.fromValue = [NSValue valueWithCGPoint:CGPointMake(centerX, centerBeginY)];
    anim.toValue = [NSValue valueWithCGPoint:CGPointMake(centerX, centerEndY)];;
//    anim.springBounciness = 8;
    anim.springSpeed = ChaosAnimSpeed;
    anim.beginTime = CACurrentMediaTime() + 6 * ChaosTimeInterval;
    [anim setCompletionBlock:^(POPAnimation *anim, BOOL finished) {
        // 動畫完成恢復處理事件的能力
        self.view.userInteractionEnabled = YES;
    }];
    [sloganImageView pop_addAnimation:anim forKey:nil];
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    [self cancleWithBlock:nil];
}

- (void)cancleWithBlock:(void(^)())btnClickBlock
{
    // 點擊了取消之后,動畫的過程中就不要處理事件了
    self.view.userInteractionEnabled = NO;
    
    for (int i = 2; i < self.view.subviews.count; i++) {
        
        UIView *subView = self.view.subviews[i];
        POPBasicAnimation *anim = [POPBasicAnimation animationWithPropertyNamed:kPOPViewCenter];
        
        anim.toValue = [NSValue valueWithCGPoint:CGPointMake(subView.centerX, subView.centerY + ChaosScreenH)];
        anim.beginTime = CACurrentMediaTime() + (i - 2) * ChaosTimeInterval;
        anim.duration = 0.25;
        
        [subView pop_addAnimation:anim forKey:nil];
        // 監聽最后一個view動畫的完成
        if (i == self.view.subviews.count - 1) {
            [anim setCompletionBlock:^(POPAnimation *anim, BOOL finished) {
                
                [self dismissViewControllerAnimated:NO completion:nil];
                // 判斷點擊按鈕后要執行的block是否為空
                if (btnClickBlock) {
                    btnClickBlock();
                }
            }];
        }
    }
}

- (IBAction)cancelClick {
    [self cancleWithBlock:nil];
}

- (void)buttonClick:(UIButton *)button
{
    [self cancleWithBlock:^{
        if (button.tag == 0) {
            ChaosLog(@"發視頻");
        } else if (button.tag == 1){
            ChaosLog(@"發圖片");
        } else if (button.tag == 2){
            ChaosLog(@"發段子");
        } else if (button.tag == 3){
            ChaosLog(@"發聲音");
        }
    }];
}

@end