美文网首页
iOS-重力弹跳动画(流畅版)

iOS-重力弹跳动画(流畅版)

作者: 金丝楠 | 来源:发表于2017-04-17 11:37 被阅读0次
方法一:

如果需弹跳多次,动画要多层嵌套,代码量稍微有点大,弹跳结束中心点不变。

//动画弹跳效果关键代码
弹跳多次可自行多嵌套几次   调用此方法  只需传入弹跳对象
- (void)animationShootOut:(UIView *)animationView{
    CGRect frame = animationView.frame;
    [UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseIn animations:^(void){
        
    } completion:^(BOOL finished){
        [UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseOut animations:^(void){
            //弹起
            animationView.frame = CGRectMake(frame.origin.x, frame.origin.y-20, frame.size.width, frame.size.height);
        } completion:^(BOOL finished){
            [UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseIn animations:^(void){
                //下降
                animationView.frame = frame;
            } completion:^(BOOL finished){
                [UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseOut animations:^(void){
                    //弹起
                    animationView.frame = CGRectMake(frame.origin.x, frame.origin.y-10, frame.size.width, frame.size.height);
                } completion:^(BOOL finished){
                    //下降
                    [UIView animateWithDuration:0.4f delay:0.0f options:UIViewAnimationOptionCurveEaseOut animations:^(void){
                        animationView.frame = frame;
                    } completion:^(BOOL finished){
                    }];
                }];
            }];
        }];
    }];
}
方法二:

usingSpringWithDamping:弹簧动画的阻尼值,也就是相当于摩擦力的大小,该属性的值从0.0到1.0之间,越靠近0,阻尼越小,弹动的幅度越大,反之阻尼越大,弹动的幅度越小,如果大道一定程度,会出现弹不动的情况。
initialSpringVelocity:弹簧动画的速率,或者说是动力。值越小弹簧的动力越小,弹簧拉伸的幅度越小,反之动力越大,弹簧拉伸的幅度越大。这里需要注意的是,如果设置为0,表示忽略该属性,由动画持续时间和阻尼计算动画的效果,弹跳结束后中心点下移10

    [UIView animateWithDuration:1 delay:0 usingSpringWithDamping:0.2 initialSpringVelocity:4 options:UIViewAnimationOptionAllowUserInteraction animations:^{
        CGPoint tempPoint=_btn.center;
        tempPoint.y += 10;
        _btn.center=tempPoint;
    } completion:^(BOOL finished) {
        
    }];
方法三:

弹跳结束后中心点不变,推荐使用此方法。

    // _btn调用动画效果 
    shakerAnimation(_btn, 2, 20);
// 重力弹跳动画效果
void shakerAnimation (UIView *view ,NSTimeInterval duration,float height){
    CAKeyframeAnimation * animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.translation.y"];
    CGFloat currentTx = view.transform.ty;
    animation.duration = duration;
    animation.values = @[@(currentTx), @(currentTx + height), @(currentTx-height/3*2), @(currentTx + height/3*2), @(currentTx -height/3), @(currentTx + height/3), @(currentTx)];
    animation.keyTimes = @[ @(0), @(0.225), @(0.425), @(0.6), @(0.75), @(0.875), @(1) ];
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    [view.layer addAnimation:animation forKey:@"kViewShakerAnimationKey"];
}

相关文章

  • iOS-重力弹跳动画(流畅版)

    方法一: 如果需弹跳多次,动画要多层嵌套,代码量稍微有点大,弹跳结束中心点不变。 方法二: usingSpring...

  • iOS-重力弹跳动画

    方法一: usingSpringWithDamping:弹簧动画的阻尼值,也就是相当于摩擦力的大小,该属性的值从0...

  • javascript模拟重力感应弹跳,做个不一样的登陆端口

    效果知识点:原生js动画效果 ,重力系统,弹跳算法, 迭代与递归, 动画序列, , 两种定时器配合使用, 循环判断...

  • iOS-重力感应

    原文首发地址iOS-重力感应话不多说,开始上代码(这里是最新的) 1.导入头文件 2.定义变量 3.实例化 4:定...

  • Flutter - 弹跳按钮动画

    您作为用户的经历多次点击没有动画的按钮,因为您不知道它是否确实发送了您请求的操作?如果按钮有一个轻微的动画告诉你它...

  • iOS框架学习之UIKit Dynamics

    UIKit Dynamics 用来模拟物理动作,有重力、碰撞、弹跳、附着、瞬间位移、推力、元素行为。下面分别是各个...

  • 常用第三方库

    UI动画 波浪控件 Tabbar items显示萌萌的动画 qq侧滑 橡皮筋弹跳式动画 菜单动画 帧动画 手势驱动...

  • 随手记

    核心动画翻译https://zsisme.gitbooks.io/ios-/content/chapter14/l...

  • 随手记

    核心动画翻译https://zsisme.gitbooks.io/ios-/content/chapter14/l...

  • 2019-07-15

    iOS高级核心动画技巧 浏览地址:https://zsisme.gitbooks.io/ios-/content/...

网友评论

      本文标题:iOS-重力弹跳动画(流畅版)

      本文链接:https://www.haomeiwen.com/subject/umctzttx.html