前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >UI动画效果

UI动画效果

作者头像
用户1941540
发布2018-05-11 13:50:03
1.7K0
发布2018-05-11 13:50:03
举报
文章被收录于专栏:ShaoYL

UI界面的动画效果总结

方式1:头尾式

代码语言:javascript
复制
//开始动画
[UIView beginAnimations:nil context:nil];
//设置动画时间
[UIView setAnimationDuration:2.0];

/* 需要执行动画的代码 */

//提交动画
[UIView commitAnimations];

方式2:block式

代码语言:javascript
复制
[UIView animateWithDuration:2.0 delay:1.0 options:kNilOptions animations:^{

    /* 需要执行动画的代码 */

} completion:nil];

// 1s后,再执行动画(动画持续2s)
代码语言:javascript
复制
[UIView animateWithDuration:2.0 delay:1.0 options:kNilOptions animations:^{

    /* 需要执行动画的代码 */

} completion:^(BOOL finished){
    /* 动画结束后执行的代码 */
}];

帧动画

代码语言:javascript
复制
// 设置动画图片(images 是数组存放的是图片)
self.imageView.animationImages = images;

// 设置播放次数
self.imageView.animationRepeatCount = 1;

// 设置图片
self.imageView.image = [UIImage imageNamed:@"imageName"];

// 设置动画的时间
self.imageView.animationDuration = image.count * 0.04;

// 开始动画
[self.imageView startAnimating];

//self.imageView.animationDuration 时间后 执行next方法
[self performSelector:@selector(next) withObject:nil afterDelay:self.imageView.animationDuration];

更新View动画

  • 让 self.view 以及它的所有子控件强制更新的动画
代码语言:javascript
复制
//利用 2 秒的时间去更新
[UIView animateWithDuration:2.0 animations:^{
    [self.view layoutIfneeded];
}];
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2015-06-26 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • UI界面的动画效果总结
    • 方式1:头尾式
      • 方式2:block式
        • 帧动画
          • 更新View动画
          领券
          问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档