iOS开发UI篇—iOS开发中三种简单的动画设置

简介: iOS开发UI篇—iOS开发中三种简单的动画设置 【在ios开发中,动画是廉价的】 一、首尾式动画 代码示例: // beginAnimations表示此后的代码要“参与到”动画中 [UIView beginAnimations:nil context:nil]; //设置动画时长 [UIView setAnimationDuration:2.

iOS开发UI篇—iOS开发中三种简单的动画设置

【在ios开发中,动画是廉价的】

一、首尾式动画

代码示例:

    // beginAnimations表示此后的代码要“参与到”动画中

    [UIView beginAnimations:nil context:nil];
//设置动画时长
    [UIView setAnimationDuration:2.0];
    
      self.headImageView.bounds = rect;

    // commitAnimations,将beginAnimation之后的所有动画提交并生成动画
    [UIView commitAnimations];

说明:如果只是修改控件的属性,使用首尾式动画还是比较方便的,但是如果需要在动画完成后做后续处理,就不是那么方便了

二、block代码块动画

代码示例:

   //简单的动画效果
    [UIView animateWithDuration:2.0 animations:^{
        showlab.alpha=0;
    } completion:^(BOOL finished) {
        [showlab removeFromSuperview];
    }];

说明:

(1)在实际的开发中更常用的时block代码块来处理动画操作。

(2)块动画相对来说比较灵活,尤为重要的是能够将动画相关的代码编写在一起,便于代码的阅读和理解.

三、序列帧动画(以一个简单的TOM猫动画示例)

      

导入提前准备好的素材,对UIImageview和button按钮进行连线。

代码示例:

- (IBAction)eat {
    
    NSMutableArray  *arrayM=[NSMutableArray array];
    for (int i=0; i<40; i++) {
        [arrayM addObject:[UIImage imageNamed:[NSString stringWithFormat:@"eat_%02d.jpg",i]]];
    }
    //设置动画数组
    [self.tom setAnimationImages:arrayM];
    //设置动画播放次数
    [self.tom setAnimationRepeatCount:1];
    //设置动画播放时间
    [self.tom setAnimationDuration:40*0.075];
    //开始动画
    [self.tom startAnimating];
}

点击按钮,即可执行动画,实现效果截图如下:

四、补充知识

1. Images.xcassets中的素材

(1)只支持png格式的图片

(2) 图片只支持[UIImage imageNamed]的方式实例化,但是不能从Bundle中加载

(3)  在编译时,Images.xcassets中的所有文件会被打包为Assets.car的文件

 

 2. UIImageView的序列帧动画(需要考虑程序性能,释放数据)

// 0. 是否正在动画

[self.tom isAnimating];

// 1. 设置图片的数组

[self.tom setAnimationImages:arrayM];

// 2. 设置动画时长,默认每秒播放30张图片

[self.tom setAnimationDuration:arrayM.count * 0.075];

// 3. 设置动画重复次数,默认为0,无限循环

[self.tom setAnimationRepeatCount:1];

// 4. 开始动画

[self.tom startAnimating];

// 5. 动画播放完成后,清空动画数组

[self.tom performSelector:@selector(setAnimationImages:) withObject:nil afterDelay:self.tom.animationDuration];

 

3. UIImage imageNamed

(1)在图片使用完成后,不会直接被释放掉,具体释放时间由系统决定,适用于图片小,常用的图像处理

(2)如果要释放快速释放图片,可以使用[UIImage imageWithContentsOfFile:path]实例化图像

 

4. 方法重构的策略

(1) 将具有共性的代码复制到一个新的方法

(2)根据不同的调用情况,增加方法的参数

提示:在写程序时不要着急重构,有时候把代码先写出来,更容易看清楚如何重构才会更好

 

5. Bundle(包)中的图片素材

往项目中拖拽素材时,通常选择

(1) Destination: 勾选

(2) Folders:

    1)选择第一项:黄色文件夹

        注意点:Xcode中分文件夹,Bundle中所有所在都在同一个文件夹下,因此,不能出现文件重名的情况

        特点:

       a.可以直接使用[NSBundle mainBundle]作为资源路径,效率高!

       b.可以使用[UIImage imageNamed:]加载图像

    2)选择第二项:蓝色文件夹

        注意点:Xcode中分文件夹,Bundle中同样分文件夹,因此,可以出现文件重名的情况

        特点:

        a.需要在[NSBundle mainBundle]的基础上拼接实际的路径,效率较差

        b.不能使用[UIImage imageNamed:]加载图

目录
相关文章
|
4月前
|
前端开发 图形学 开发者
【独家揭秘】那些让你的游戏瞬间鲜活起来的Unity UI动画技巧:从零开始打造动态按钮,提升玩家交互体验的绝招大公开!
【9月更文挑战第1天】在游戏开发领域,Unity 是最受欢迎的游戏引擎之一,其强大的跨平台发布能力和丰富的功能集让开发者能够迅速打造出高质量的游戏。优秀的 UI 设计对于游戏至关重要,尤其是在手游市场,出色的 UI 能给玩家留下深刻的第一印象。Unity 的 UGUI 系统提供了一整套解决方案,包括 Canvas、Image 和 Button 等组件,支持添加各种动画效果。
202 3
|
4月前
|
图形学 iOS开发 Android开发
从Unity开发到移动平台制胜攻略:全面解析iOS与Android应用发布流程,助你轻松掌握跨平台发布技巧,打造爆款手游不是梦——性能优化、广告集成与内购设置全包含
【8月更文挑战第31天】本书详细介绍了如何在Unity中设置项目以适应移动设备,涵盖性能优化、集成广告及内购功能等关键步骤。通过具体示例和代码片段,指导读者完成iOS和Android应用的打包与发布,确保应用顺利上线并获得成功。无论是性能调整还是平台特定的操作,本书均提供了全面的解决方案。
163 0
|
5月前
|
开发者 图形学 前端开发
绝招放送:彻底解锁Unity UI系统奥秘,五大步骤教你如何缔造令人惊叹的沉浸式游戏体验,从Canvas到动画,一步一个脚印走向大师级UI设计
【8月更文挑战第31天】随着游戏开发技术的进步,UI成为提升游戏体验的关键。本文探讨如何利用Unity的UI系统创建美观且功能丰富的界面,包括Canvas、UI元素及Event System的使用,并通过具体示例代码展示按钮点击事件及淡入淡出动画的实现过程,助力开发者打造沉浸式的游戏体验。
133 0
|
5月前
|
测试技术 Swift iOS开发
探索iOS自动化测试:使用Swift编写UI测试
【8月更文挑战第31天】在软件开发的海洋中,自动化测试是保证船只不偏离航线的灯塔。本文将带领读者启航,深入探索iOS应用的自动化UI测试。我们将通过Swift语言,点亮代码的灯塔,照亮测试的道路。文章不仅会展示如何搭建测试环境,还会提供实用的代码示例,让理论知识在实践中生根发芽。无论你是新手还是有经验的开发者,这篇文章都将是你技能提升之旅的宝贵指南。
|
7月前
|
前端开发 iOS开发
input框设置placeholder属性在iOS中显示不完整
input框设置placeholder属性在iOS中显示不完整
87 1
|
8月前
|
安全 开发者 iOS开发
iOS16系统手机设置开启开发者模式才能安装ipa包
iOS16系统手机设置开启开发者模式才能安装ipa包
261 1
|
8月前
按钮的image图片是非圆角,直接对UIButton设置圆角,iOS13系统没有圆角效果的问题及解决方案
按钮的image图片是非圆角,直接对UIButton设置圆角,iOS13系统没有圆角效果的问题及解决方案
56 0
|
iOS开发
iOS动画开发之五——炫酷的粒子效果(二)
iOS动画开发之五——炫酷的粒子效果
345 0
iOS动画开发之五——炫酷的粒子效果(二)
|
iOS开发
iOS动画开发之五——炫酷的粒子效果(一)
iOS动画开发之五——炫酷的粒子效果
385 0