用POP动画模拟真实秒钟摆动效果

简介:

用POP动画模拟真实秒钟摆动效果

静态图:

动画图:

此处用到了POP中的Spring系列动画,现提供源码如下:

SecondClockView.h 与 SecondClockView.m

//
//  SecondClockView.h
//  YouXianMingClock
//
//  Created by YouXianMing on 14-10-12.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface SecondClockView : UIView

/**
 *  Use in conjunction with 'springSpeed' to change animation effect. Values are converted into corresponding dynamics constants. Defined as a value in the range [0, 20]. Defaults to 18.
 */
@property (nonatomic, assign) CGFloat springBounciness;

/**
 *  The mass used in the dynamics simulation.
 */
@property (nonatomic, assign) CGFloat dynamicsMass;

/**
 *  Use in conjunction with 'springBounciness' to change animation effect. Values are converted into corresponding dynamics constants. Defined as a value in the range [0, 20]. Defaults to 18.
 */
@property (nonatomic, assign) CGFloat springSpeed;

/**
 *  给与时间进行的动画
 *
 *  @param second 当前秒
 */
- (void)startAnimationWithSecond:(float)second;

@end


//
//  SecondClockView.m
//  YouXianMingClock
//
//  Created by YouXianMing on 14-10-12.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "SecondClockView.h"
#import "POP.h"

/**
 *  将角度转换为弧度
 *
 *  @param d 角度
 *
 *  @return 弧度
 */
#define DEGREES__TO__RADIANS(d)  ((d) * M_PI / 180.f)

@interface SecondClockView ()

{
    
    BOOL firstTime;
    
}

@end

@implementation SecondClockView

- (void)startAnimationWithSecond:(float)second
{
    // 秒钟
    POPSpringAnimation *springAnimation = \
        [POPSpringAnimation animationWithPropertyNamed:kPOPLayerRotation];
    
    springAnimation.fromValue        = @(DEGREES__TO__RADIANS((360)/60.f)*(second - 1) + DEGREES__TO__RADIANS(-90));
    if (firstTime == NO) {
        firstTime = YES;
        springAnimation.fromValue    = @(0);
    }
    springAnimation.toValue          = @(DEGREES__TO__RADIANS((360)/60.f)*second + DEGREES__TO__RADIANS(-90));
    springAnimation.springBounciness = (_springBounciness > 0 && _springBounciness <= 20)?_springBounciness:18.f;
    springAnimation.dynamicsMass     = (_dynamicsMass > 0)?_dynamicsMass:1.5f;
    springAnimation.springSpeed      = (_springSpeed > 0 && _springSpeed <= 20)?_springSpeed:18.f;
    [self.layer pop_addAnimation:springAnimation forKey:nil];
}

@end

使用时候的情形

使用的时候请引入POP库

目录
相关文章
|
27天前
|
JavaScript Serverless
Vue 封装一个函数,小球原始高度不固定,弹起比例不固定、计算谈几次后,高度低于1米
Vue 封装一个函数,小球原始高度不固定,弹起比例不固定、计算谈几次后,高度低于1米
8 1
|
10月前
封装一个函数,小球原始高度不固定,弹起比例不固定、计算谈几次后,高度低于1米
封装一个函数,小球原始高度不固定,弹起比例不固定、计算谈几次后,高度低于1米
28 0
360度不停旋转动画demo效果示例(整理)
360度不停旋转动画demo效果示例(整理)
|
9月前
|
算法 C语言 C++
【模拟】特别数的和、移动距离、连号区间、错误票据思路详解及代码实现
取出最后一位,然后将n除去最后一位,将刚刚取出的进行判定。
49 0
B. Following Directions(模拟::坐标)
B. Following Directions(模拟::坐标)
27 0
HIMA BV7046-4 准确地实现受控到达期望位置
HIMA BV7046-4 准确地实现受控到达期望位置
HIMA BV7046-4   准确地实现受控到达期望位置
【每日一题Day82】LC1806还原排列的最少操作步数 | 模拟
思路:按照题意进行变换,直至数组变为原始数组,记录变换次数
56 0
|
前端开发 算法 JavaScript
【前端算法】将一个数组旋转K步
使用typescript完成将一个数组旋转K步的过程
|
调度
每日三题-跳跃游戏、根据身高重建队列、任务调度器
每日三题 跳跃游戏 根据身高重建队列 任务调度器
64 0
每日三题-跳跃游戏、根据身高重建队列、任务调度器
图片旋转 (30 分)(模拟)
图片旋转 (30 分)(模拟)
59 0