【汤姆猫的实现 Objective-C语言】

本文详细介绍了如何使用Objective-C实现汤姆猫应用的动画效果,包括背景图片框的设置、帧动画原理、UIImageView的animationImages属性、动画持续时间、重复次数的设置以及如何启动和停止动画。通过加载一系列图片并快速切换,实现了汤姆猫各种动作的动画效果,如喝牛奶、抓屏幕等。
摘要由CSDN通过智能技术生成

一、实现之后的效果

汤姆猫

1.左边3个按钮,分别是

1)点击之后,汤姆猫掏出一只白色的小鸟,刚要吃,它飞走了,

2)汤姆猫放屁

3)汤姆猫喝牛奶,

右边3个按钮,分别是

1)汤姆猫用爪子把屏幕抓出3个道子,

2)汤姆猫用披萨饼砸屏幕,

3)汤姆猫拿出两个锣,对着一敲,

2.这些动画怎么实现的,

是不是很多很多图片顺序播放啊,

很多图片快速的切换,然后你眼睛感觉是不是它们就在动吧,

3.所以,这个app实现的方式,就是背景放一个大的图片框,

为什么是图片框,而不是按钮,

需要点吗,背景,不需要,

点一下,疑,有用了,汤姆猫被打倒了…

说明我在这儿放了一个透明的按钮,

其实,整个这儿背景是一个图片框,你点是没有用的,

它需要放一张图片,又不需要点击,

所以说,这儿用一个图片框就可以了,

4.左边3个按钮,右边3个按钮,也是小图片,

但是这些能点,说明这6个是什么啊,按钮吧

当你点击某个按钮的时候,我就通过动画的方式,快速的切换这个图片框中的每1张图片,

这样的话,看起来就是一个动画了,

5.看一下Supporting Files里面的素材,

1)Angry文件夹,是汤姆猫“生气”的动画,是一大堆图片,单看每一张没什么效果,但是快速切换的时候,就能看到汤姆猫生气的动画了

2)要实现这个效果,首先,我先把素材拷进来,

我们这里用到的素材,一个就是这些图片,再一个,就是这个tom.plist文件,

我们先把图片素材拷进来,

找到我们这个素材文件夹,找到里面的汤姆猫文件夹,找到里面的Animations文件夹,这些是不是我们具体使用的一些图片啊,

在以前xcode5的时候,只有这个图片是png图片的时候,才可以直接拷到images.xcassets文件夹下,

但是在xcode6的时候,你这个图片是jpg的图片,也可以直接拷到这个images.xcassets文件夹下,

只要是图片,都可以拷过来,

这是我们动画图片,

这个Buttons,是我们的按钮图片,

然后我把Animations文件夹,和Buttons文件夹,一起拽到我的Xcode的images.xcassets文件夹下,

接下来,我们就尝试把这个汤姆猫做一下,看一看怎么做

二、实现汤姆猫app,

1.打开storyboard,

选中控制器,size调成4.7inch,

2.背景放一个大的图片框,UIImageView控件,

让它充满整个屏幕,

我给它先来一张默认图,例如,来一个angry_00

这是在imageView右边的属性控制器里实现的,找到它的image属性,给个angry_00,

接下来,我们实现动画,就是要让这些图片,快速的切换,

我们已经学了两种动画方式,

一种是“头尾试”

通过调UIView的一个类方法,beginAnimation,

和一个setAnimationDuration,

以及commitAnimation,

通过这3个方法,可以执行一个“头尾式”动画吧,

第二种是调UIView的一个animateWithDuration,那个block方式,

接下来,我们要实现的这个汤姆猫的动画,跟前面那两个没关系,

这个不是说要让它的位置从一个地方移动到另一个地方,大小变化,在动画里面执行,不是这个意思,

现在的动画是,要让这个图片框,快速的切换图片,实现的动画,

3.这个动画的实现思路是这样的,

我们首先这个图片是在一个UIImageView,一个图片框里面吧,我们通过调图片框的一些方法,那么这个时候,图片框会把在图片框里面的图片,它自己会做动画,我们只要调图片框这个对象的一些方法,就ok了,

这个是完全通过图片框自己实现的,

和那两个动画没有关系,

4.那么接下来,我们看一下,这个图片框是怎么实现动画呢,

我们说,这个动画,叫做

UIImageView帧动画,

就是让图片框里面的图片一张一张变的动画,

既然它要让图片框里面的图片一张一张变,

你想想,这个图片框里面能只有1张图片吗,

1张图片,你再怎么变,它也不会动吧,

所以说,第一个,是要告诉这个图片框,它里面,有哪些图片,就是给它的animationImages,给这个属性设置值,

@property(nonatomic,copy) NSArray *animationImages;

这个属性,是1个什么类型的属性,数组类型吧,

意味着,我们一开始,要把所有的图片,加载到这个数组里面,

也就是说,这个图片框,它首先有一个数组,这个数组里面,保存了它要执行动画的所有的图片,

@property(nonatomic,copy) NSArray *animationImages;

那为什么@property的参数要用copy,是不是不希望把数组赋值给下划线属性之后,如果修改了赋值之前的数组,下划线属性也会

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

清风清晨

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值