美文网首页iOS绘图与动画
[iOS]支付宝咻一咻动画

[iOS]支付宝咻一咻动画

作者: 羽惊 | 来源:发表于2016-02-27 22:40 被阅读1191次

效果图


xxx.gif

模仿支付宝咻一咻的动画,动画由两部分组成,一是scale由小变大,二是透明的由1到0

两个部分的变化都是由基础动画完成,再将两个动画添加到动画组中完成整个动画

- (void)startAnimation{

//创建执行动画的Layer

CALayer*layer = [CALayerlayer];

layer.frame=CGRectMake(0,0, [UIScreenmainScreen].bounds.size.width, [UIScreenmainScreen].bounds.size.width);

layer.cornerRadius= [UIScreenmainScreen].bounds.size.width/2;

layer.position=self.view.layer.position;

layer.backgroundColor= [UIColorcolorWithRed:arc4random() %254/255.0green:arc4random() %254/255.0blue:arc4random() %254/255.0alpha:1.0].CGColor;
[self.view.layer addSublayer:layer];

//圆的大小改变

CABasicAnimation*boundsAnimation = [CABasicAnimationanimationWithKeyPath:@"transform.scale.xy"];

boundsAnimation.fromValue= [NSNumber numberWithFloat:0];

boundsAnimation.toValue= [NSNumber numberWithFloat:1];

boundsAnimation.removedOnCompletion=YES;

boundsAnimation.duration=3.0;

//透明度的改变

CABasicAnimation*opacityAnimation = [CABasicAnimationanimationWithKeyPath:@"opacity"];

opacityAnimation.fromValue= [NSNumbernumberWithFloat:1];

opacityAnimation.toValue= [NSNumbernumberWithFloat:0];

opacityAnimation.removedOnCompletion=YES;

opacityAnimation.duration=3.0;

//创建动画组

CAAnimationGroup*group = [CAAnimationGroupanimation];

group.animations=@[boundsAnimation, opacityAnimation];

group.duration=3.0;

group.removedOnCompletion=YES;

[layeraddAnimation:groupforKey:@"xiuyixiu"];

//动画完成后移除Layer

[selfperformSelector:@selector(removeLayer:)withObject:layerafterDelay:3];

}

//移除Layer

- (void)removeLayer:(CALayer*)layer{

[layer removeFromSuperlayer];

}

//点击页面开始执行动画

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent*)event{

[selfstartAnimation];

}

相关文章

  • [iOS]支付宝咻一咻动画

    效果图 模仿支付宝咻一咻的动画,动画由两部分组成,一是scale由小变大,二是透明的由1到0 两个部分的变化都是由...

  • 支付宝咻一咻动画探究

    过年支付宝升级,新版本多了咻一咻功能,里面动画做得挺不错的,特意研究了里面的动画都是怎么实现的。首先是一进去看到...

  • 咻一咻动画的实现

    实现逻辑: 第一步:设置VC的背景颜色 self.view.backgroundColor=[UIColor co...

  • 咻···咻···咻···

    2018年10月1日9:00至10月7日18:00 我们一起赋予这段时间意义和价值 徐敬东老师倾心分享,不断带给大...

  • 咻咻咻

    本来不想写的 好累好累了 今天该完成的完成了 早起背单词记账步数✅ 工作上帖子没发 该打 100条哇 约了客户 没...

  • Swift中利用Runtime解决UIButton重复点击的问题

    写在前面 今年春节的时候,支付宝“咻一咻”红包火了起来,整个春晚都在疯狂地点击“咻一咻”,后来发现不对劲,要是全国...

  • ios咻一咻,雷达功能

    demo有详细的注释,菜鸟一名互相学习=-=。 demo地址

  • 仿支付宝咻一咻功能

    偶然间在CocoaChina上看到了一个动画类的文章,还有支付宝咻一咻的动图。俗话说,自己动手,丰衣足食,从而就出...

  • iOS核心动画实现仿支付宝咻咻、雷达效果

    今天闲余时间写了一个类似支付宝咻咻或者说雷达效果。望大神勿笑、写的粗糙。 更新了下文章,贴出Demo地址(已更新一...

  • 咻咻咻 duang

    咻咻咻 duang听到这个声音有没有觉得很耳熟呢,不错,这就是陈翔六点半啊。 第一次看六点半的视频还是在上大学的时...

网友评论

    本文标题:[iOS]支付宝咻一咻动画

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