求大神帮忙用FLASH CS 2.0做一个小动画 万分感谢 英文在线等......

求大神帮忙做一个flash动画,高分悬赏,谢谢_百度知道您现在的位置: >>
>> 正文内容
中文flash cs2.0摘抄
文章来源:
发布时间:日
1.1& 初识as
1.2& as语法规则
是指令一个动画在播放时做某些事情的一些句子。例如gotoAndPlay命令就是把播放头放到指定的帧。
常量是不能改变的量 。
是可以用于创建新对象类型的数据类型。若要定义类,请在外部脚本文件中使用关键字Class,并且必须先创建一个构造函数。
用于定义类的属性和方法的函数。例如,一下代码通过创建称为Circle的构造函数来创建一个新的圆类。
//文件 Circle.as
& class Circle {
&& private var radius:Number
&&&& private var circumference:Number
//构造函数
&function Circle(radius: Number) {
circumference=2*Math.PI*
用于描述变量或动作脚本元素可以包含的信息种类。数据类型包括字符串,数字,布尔值,对象,影片剪辑,函数,空值,未定义
动画播放时发生的动作。
7事件处理函数
是用于管理诸如MouseDown或Load等事件的特殊动作。事件处理函数分两类
;事件处理函数方法和事件侦听器。在AS命令列表窗口中,每个有事件处理函数方法或事件侦听器的动作脚本对象都有一个名为&Event&&或&&&Listeners&的子类别。某些命令既可以用于事件处理函数方法,也可以用于事件侦听器,并且包含上述两个子类别中。
表达式是代表值的动作脚本元件的任意合法组合,它由运算符和操作数组成。例如,X+Y就是一个表达式。
是可以向其传递参数并能够返回值的可重复使用的代码块。例如,GetProperty函数用于传送属性名和电影剪辑实例名,然后返回这些属性的值。getVersion 函数返回当前正在播放动画的Flash播放器的版本。
用于表示变量,属性,对象,函数或方法的名称。他的第一个字符必须是字母,下滑线或美元符号。。其后的字符也同样必须是字母,数字,下滑线或美元符号。
是用于传递函数值的量。
实例是属于某个类的对象。类的每个实例均包含该类的所有属性和方法。例如,所有影片剪辑都是MovieClip类的实例,因此可以将MovieClip类的任何方法或属性用于任何影片剪辑实例。
13实例名称
是脚本中用来指向影 片剪辑实例和按钮实例的唯一名称。例如,库中的元件名称可以是Counter,但在动画中科将该元件的实例名称命名为ScorePlayer1_mc
有特殊含义的保留字。例如var 是用于声明本地变量的关键字。他不能被用作标识符。
1.22& 语法规则
在AS中,点用于指示对象或或影片剪辑相关的属性和方法。他还用于标识硬盘剪辑,变量,函数或对象的目标路径。点语法表达式以对象或影片剪辑的名称开头,后面跟着一个点,最后要以指定的元素结尾。例如,_x影片剪辑属性指示影片剪辑在舞台上的X轴的位置,表达式ballMC._x引用影片剪辑实例ballMC的_x属性。如果用户要播放ball_mc影片剪辑实例。则输入命令ball_mc.play()
在as中用{}分隔一段代码,
小括号()是表达式的一个符号,具有运算符的最优级别。当用户定义一个函数时,要把参数放在圆括号内,如:
调用函数时,要将传递给函数的所有参数都包含在括号中,如:
function myFunction(name,age ,reader){
//此处是用户的代码
调用函数时,要将传递给函数的所有参数都包含在括号中,如
myFunctiond(&Steve&,10,true);
As语句以分号;结束,如
var column=passedDate.getDay();
若要添加注释,请在该注释插入&//&或执行comment,如:
6区分大小写
关键字,类名,变量,方法名等均区分大小写。
1.3变量,表达式和函数
在首次定义一个变量时,最好赋给它一个已知的值,这称为初始化变量。
1变量的类型
逻辑变量:用于判断指定的条件是否成立。其值有两个:True和Flale
数值型变量:用于存储一些特定的数值
字符型变量:用于存储一些特定的文本信息。
2变量作用范围
变量的作用范围是指能够识别和引用该变量的区域。可以是全局变量和局部变量。全局变量可以在所有的时间轴***享;局部变量仅在他所在的代码块中有效。
可以用setVariables命令或赋值号&=&来生命全局变量,结果是一样的。在函数体内可以使用var语句来声明局部变量。
例如:,变量i和j常常被用作循环计数器。
function makeDays()
for (i=0;i&monthArray[month];i++)
_root.Days.attachMovie(&DayDisplay&,i,i+2000);
_root.Days[i].num=i+1;
_root.Days[i]._x=column*__root.Days[i]._
_root.Days[i]._y=row*_root.Days[i]._
&column=cl=olumn+1;
if(column= =7){
row=row+1;
变量的命名过程中的规则:
变量名必须是一个标识符
不能是一个关键字或逻辑常量。
在他的作用范围内必须是唯一的。
1.32表达式
它是用于为变量复制的短语,它由操作符和变量值组成。分3种类型:数值表达式,逻辑表达式,和字符表达式。
数值表达式:是由数值,数值型变量和算术运算符构成的表达式。
算术运算符如:&&&&&&&&&&&&&&&
逻辑运算符
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 字符串运算符
字符表达式:是由字符串,字符串变量和字符串运算符构成的表达式。
字符串运算符如表
由一个变量按照一定的法则决定另一个变量的值,这种对应的关系叫函数。如获取对象的坐标,显示焦点区域,产生随机函数,获取系统时间。
eval :获取某一变量的值,或者是返回某一对象。
getTime: 获取计算机的系统时间
false:& 获得布尔非值0
true :& 获得布尔真真值 1
int&&&&& 把十进制数值强制转换成整数,即取整
random&&& 产生0到用户指定数间的随机数。
_alpha& 对象的透明度
_height&& 对象的高度
_name&& 对象的实例名称
_roration&& 对象的旋转角度
_visible&&& 显示/隐藏对象
_width&&&& 对象的宽度
_x&&&& 对象的x轴坐标
_y&& 对象的y轴坐标
_xscale&& 以百分比来缩放对象的宽度。
_yscale&& 以百分比来缩放对象的宽度。
_url&&&&&& 对象的连接地址
_current&&& 当前帧的位置
4字符串函数
substring 截取字符串中的子串
length 返回字符串的长度
ord&&& 将字符转化成ascii码
chr&& 将ascii码转化成相应的字符
1.4常用交互动作命令
跳转命令:
Gotoandstop&
Gotoandplay
图像质量命令
ToggleHigQuality,他可以取消锯齿,
On (release) {
toggleHighQuality();
声音停止命令
Stopallsounds
1.4.6获取RUL路径命令
getURL为获取URL路径命令,他可以将指定的URL加载到浏览器窗口和将变量数据发送给指定的URL.
获取URL路径命令格式为getURL(url,窗口,方法)。
url:加载到浏览器窗口的地址或发送数据对象的地址。他可以是一个相对路径,也可以是一个绝对路径。
窗口:指定加载并显示指定的URL的浏览器窗口或HTML页。如果用户已经有了一个HTML窗口,并希望指定的URL加载并显示在该窗口,则只需输入该窗口名称即可。如果没有,也可以选择一下选项
_self:将指定URL加载并显示在当前影片所在的页或窗口。
_blank:将指定URL加载并显示在一个新的浏览器窗口。
_parent:将指定URL加载并显示在当前页的父页中。
_top:将指定URL加载并显示在当前影片所在的页或窗口,但当前页中的该帧内容将被删除。
方法:用来设置是否传送变量以及传送方式。他有3个选项:
& 无参数:不发送变量
& get:发送附在指定的URL画面的变量,但有大小限制。
&& Post:传送与URL分开的变量,可以发送多个。
如,此鼠标事件,他将在一个新的窗口中加载并显示指定的URL
&& on(release){
& getURL(&/mypage.html&,blank);
在实践中常常使用获取URL路径命令来打开与动画内容相连的HTML网页。
1.4.7& FS命令
Fscommand 为FS命令,它用于与外部程序进行通信,还可以控制Flash Player播放器。
FS命令格式为(命令,参数)
命令:是FS语句执行的命令
参数:是执行命令的参数。
&如,控制全屏播放
on (release) {
&& fscommand(fullscreen,true);
1.48& 加载与卸载命令
加载电影命令格式为loadMovie(url,目标,方法),
url& :要加载的电影的文件路径。可以是相对路径,如hd.也可以是绝对路径如
目标 :用来指定代替当前电影的影片剪辑名称。加载的影片剪辑将继承当前影片剪辑的所有属性。
方法 :用来设置是否传送变量以及传送方式。他有三个选项:
无参数:表示不发送变量
get发送附在指定url画面的变量,但有一定的大小限制。
post:传送与url分开的变量,可以发送多个。
如,这是一个鼠标事件,他将一个名为droZone的影片剪辑加载到products中
&&&&& on(release){
loadMovie(&products.swf&,dropZone);
unloadMovie用于卸载外部电影,格式为unloadMovie(目标)。如这个鼠标事件,他将一个名为draggable_mc的影片剪辑从时间轴上卸载。
& on(release){
unloadMovie(draggable_mc)
1.49 通知目标命令
tellTarget为通知目标命令,它用于通知目标对象,然后进行其他的一些做动作。其格式为
tellTarget(目标)。只有一个参数,含义为希望通知对象的实例名称。
&& 选择 否定的,动作,tellTarget。即可添加通知目标命令。如此鼠标事件,它通知时间轴上的ball影片剪辑,然后从第2帧开始播放
& on(release){
tellTarget(ball){
gotoAndPlay(2);
在实践中常用通知目标命令在一部影片中链接另一部影片,或是一部影片播放完毕然后接着播放下一部。
1.410按钮事件命令
press&&点击--鼠标指针在按钮上时按下鼠标键;
release&&释放--鼠标指针在按钮上时,释放鼠标按键;
rollOver&&指针经过--鼠标指针移到按钮上面;
rollOut&&指针离开--鼠标指针从按钮上移出;
releaseOutside&&释放离开--鼠标指针在按钮上时按下鼠标按键,移出按钮外后才释放按键;
dragOut&&拖放离开--鼠标指针在按钮上时按下鼠标键,然后拖出按钮外;
dragOver&&拖放经过--鼠标指针在按钮上时按下鼠标键,然后拖出按钮外,接着又拖回按钮上;
keyPress&&按键--按下指定的键盘键
1.411影片事件命令
enterFrame
1.412条件循环控制命令
1.条件控制命令
If为条件控制命令,它表示当前满足一些条件时去执行设定的动作的语句,否则就执行另外的语句。他经常与else语句配合使用。他有3种格式。
(1)如果满足条件,则执行指令体1,如果不满足,则退出if指令,继续执行后面的指令,如
(2)如果满足条件,则执行指令体1,如果不满足,则执行指令体2,如
(3)条件语句之间还可以相互嵌套,它可以根据多个条件的判断结果执行相关的语句。如
if (条件1成立{
else if (条件2成立){
。。。。。。
else if(条件N成立){
语句中展示的是查看变量name 的值是否等于erica,等于erica则开始播放影片,否则停止。
if(name==&erica&){
&& play();
2.循环控制命令
For 为循环控制命令,他有一个循环条件表达式,如果满足条件,则执行大括号里的命令,否则跳出循环体执行下面的命令。
循环控制命令格式为for (初始值,条件,下一个),该命令有3个参数,
初始值& :为循环条件表达式中变量赋的初始值。
条件& :每次循环前都执行该表达式,如果其值为true,则继续循环,如果其值为false,则退出循环。
下一个:循环条件表达式中变量执行的操作。
如下展示的是为一个1*10的数组中添加元素。
my_array=new Array();
for(i=0 ;i&10;i++){
my_array [i]=(i+5)*10;
trace(my_array [i]);
在实践中用来执行多次重复执行的动作。
1.4.13对象属性设置/获得命令
1.对象属性设置命令
&setProperty为对象属性设置命令,他可以设置指定对象的各种属性值。对象属性设置命令格式为setProperty(目标,属性,值)
& 目标:影片剪辑对象的的名称
属性 :要设定的属性类型。它包含一下种类:
_alpha: 设置对象的透明度
_height设置对象的高度
_highquality设置对象播放时的画面质量
_name设置对象的名称
_rotation设置对象的旋转角度
_soudnbuftime设置声音在开始播放前的下载时间
_visible设置电影的可见性。其值为0或false,电影不可见,否则可见
_width设置对象的宽度
_x设置对象的x轴坐标
_y设置对象的y轴坐标
_xscale设置对象在x轴方向上的缩放比例
_yscale设置对象y轴方向上的缩放比例
值:要设置属性的值。
如,此鼠标事件,它设置一个名为star的影片剪辑对象的透明度为30%
on(release){
setProperty(&star&,_alpha,&30&);
2.对象属性获得命令
Getproperty为对象属性获得命令,它用于获得指定对象的各种属性值。对象属性 获得命令格式为getproperty(目标,属性)。
如,此鼠标事件。他获得一个名为star的影片剪辑对象的x轴的坐标值,然后将其赋给变量my_mc_x。
&on(release){
my_mc_x=getProperty(&star&,_x);
在实践中常使用对象属性获得命令来获得对象的属性值,然后进行精确的控制。
1.4.14对象变量设置命令
&Set& variable &为对象变量设置命令,它用于先声明一个变量,然后给此变量赋值。对象变量设置命令格式为set(名称,值)
名称:要声明变量或要给新变量的名称
值:赋给变量的具体的数值。
如:语句,变量,set variable.即可添加。
如一下鼠标事件,他先获得一个名为ship的影片剪辑对象的x轴坐标值,然后在赋给声明的变量&hd&
&on (release) {
& set(&hd&,getProperty(&ship&));
一.初识对象
讲到对象就必须提到类,因为类识建立对象的模型,对象是类的实例。
使用&new&操作符,依据预定义类或自定义类创建对象。
使用对象初始化操作符&{}&来创建类形式对象。
如果要使用new操作符创建对象,需要用到 构造函数。构造函数特有的功能就是创建某种类型的对象。预定义的类就是预先写好的构造函数。创建新对象就是实例化一或创建预定义类的副本,并给他分配该预定义类的所有属性和方法。这类似于从库中把一个电影剪辑拖到舞台中。
使用new操作符创建对象如下:
自定义一个类或调用的具体步骤如下
class person
//constructor
public function Person(n:Stringf,a:Number,tel:Number)
public function getName():String
public function getAge():Number
public function getTelNum():Number
public function saySomeThing():Void
Trace(&I an a Person named&+name);
Trace(&I am &+age&years old&);
Trace(&My telephone number is&+ telNum);
Trace(&=========================&);
//properties
private var name:S
private var age,telNum:N
在as中声明类的一般形式为:
class Classname
(2)使用person.as名称存储自定义的类,然后可以利用new操作符创建对象,如
person=new person(25,)
使用对象初始化操作符{}创建类型式的对象,其方法如下:
circle ={radius:10,area(pi*radius*radius)};
具体点说就是先输入新对象的名字(这里是circle),然后再输入初始化符号{},最后在初始化符号{}中输入属性名和值或表达式,两者之间用冒号分隔,如果有多个属性,属性与属性之间用逗号分隔。在对象circle中,用两个属性名:radius和area,前者的值是10 ,后者的值是一个表达式pi*radius*radius,系统会计算此表达式的值。,并返回给变量area。
2.访问对象属性
属性是类中定义的数据成员。可以使用.操作符访问对象属性的值。对象名在点的左边,
属性名在点的右边。例如,在newperson.name语句中,newperson是对象,name是他的属性。如果在动作-帧面板中给属性赋值,必须用set Variable命令或&=&命令。如
set (newperson.name,liming);
newperson.name=&liming&;
如果需要改变属性的值,只需赋给属性新的值即可,如:
set (newperson.name,chenhua);
newperson.name=&chenhua&;
引用对象必须先定义变量,然后再引用。对前面定义的person类进行引用如下:
var liming:Person=new Person(&liming&,22,);
var chenghua:Person=new Person(&chenghua&,21,);
这里liming和chenghua为两个局部变量。还可以通过.来直接引用对象,但必须用到set Variable命令,如
hd =newPerson(this&)
hd.setname(&dayong&)
二,预定义类
有:Array,Color,Date,Key,Mouse等。
数组类是内置类,常常使用new Array()直接实例化一个数组对象,这个新的数组对象长度是动态的,默认数组的索引值从0开始,可以直接使用这个字符串 ,也可已更改。
新建一个Flas***件
把一个库中的按钮拖入舞台
在按钮上写入
&on (release){//创建一个按扭事件。
&Output=new Array();
//实例化一个新的数组对象,新数组名为Output
Output[0]=0;
Output[1]=1;
Output[2]=2;
Output[3]=3;
//为数组赋值,该书组使用数值索引
trace (Output[0]);
trace (Output[1]);
trace (Output[2]);
trace (Output[3]);
//使用trace ()语句测试数组
trace是跟踪脚本名命令,主要用来调试脚本,将结果显示在输出窗口。其命令格式为trace(消息),该命令只有一个参数,即为测试的对象。
测试影片输出
常常使用newdate=new Date(年,月,日,小时,分,秒)来实例化一个时间对象。
1,新建一个Flas***档
2,使用文本工具在舞台上输入文本&今天是:&和&00.00.00,并设置为宋体,字号为50
3,选中&00.00.00&然后设置为动态文本,实例名为date。
按照步骤2和4在舞台中输入&时间是:&和&00:00:00&。并将&00:00:00&设置为动态文本,实例名为&time &
6,新建图层,在第一帧写入
&newDate=new Date();//定义新类
Cur_year= newDate.getFullYear();
Cur_ Month=newDate.getMonth();
Cur_Date= newDate.getDate();//定义年,月,日变量
&& date= Cur_year+&.&+Cur_Month+&.&+Cur_D
Cur_ Hour=newDate.gertHours();
Cur_ Minute=newDate.getMinutes();
Cur_Second= newDate.getSeconds();//定义小时,分钟,秒变量。
& time=Cur_Hour+&:&+Cur_Minute+&:&+Cur_S
getFullYear()命令功能为返回系统年份。getMonth()命令返回系统月份,getDate()命令返回系统的第几天,getHour()返回系统的小时数。getMinutes()返回系统的分钟数,getSeconds返回系统的秒数。
在第二帧输入gotoAndPlay(1)命令,一实现当前时间的更新。
3.Sound类
使用预定义类Sound类可以控制动画中的声音。使用newsound=new Sound()来实例化一个声音对象。下面通过一个控制动画的声音的实例来为读者介绍时间类的应用。如下:
新建Flas***件
导入到库中一段声音
选中库中声音,右键选择链接命令,选中为动作脚本导出,在标识符的文本框中输入sound
单击第一帧,输入
newsound=new Sound();
newsound .attachSound(&sound&)
newsound.start();
attachS命令的功能为将库中的声音插入到时间轴。star()为开始播放。
5.测试影片
可以使用Color类来获取或设置影片剪辑对象的颜色。
新建一个Flas***件,1新建一个元件,为&树叶&的影片剪辑元件。
&&&&&&&&&&&&&&&&&& 2导入一个位图树叶到舞台。
3返回场景一。
4把树叶元件拖入舞台
5实例名称命名为leaf
6使用文本工具在舞台输入&颜色设置&并拖出一个文本框。
7选中文本框,在属性面板中,设置为&输入文本&设置其变量名为&intext&
8选一个按钮拖入舞台。
9单击按钮,输入
on (release){
newcoler=new Color(leaf);//实例化一个color对象
newcole.setRGB(intext);//设置对象颜色
10.测试影片。在文本中输入ff0000 ,表示红色。
由于key类没有构造函数,因此不能用它来制作一个实例化对象。但我们可以直接使用它的方法:使用getCode方法可以获得 最后按键的虚拟键码;使用getAscii方法可以获得最后按键的ASCII码值。
键盘上的每一个物理按键都于一个虚拟键码一一对应。如enter键的虚拟键码是13 。
Key.getCode方法常用在onClipEvent事件处理程序中,用于获得最后一次按键的虚拟键码。例如,当按下enter时,影片跳转执行其他动作的语句如下:
onClipEvert(keyDown){
if (key.getCode()= =13) {
gotoAndPlay(1);//当按enter时,执行跳转到第一帧
Mouse与key类比较类似,没有构造函数,可以直接使用通的两个属性_xmouse 和_ymouse ._mouse属性的功能是返回鼠标的x轴的坐标,_ymouse同理。他可以获得四种坐标值:
获得主时间轴内的鼠标坐标值:主时间轴坐标是相对于整个舞台而言,使用如下语句可以返回住时间轴内的坐标轴。
x_pos=_root._
y_pos=_root._
在一个影片剪辑中获得另一个影片剪辑的坐标值:这需要用到影片剪辑实例名称和绝对目标路径。如
x_mcpos=_root.myMovieClip._
y_mcpos=_root.myMovieClip._l
获得影片剪辑中鼠标的坐标值:直接是使用_xmouse 和_ymouse2属性就可以了。如
onClipEvent(mouseDown){
xmousePosition=_
ymousePosition=_
实时获得鼠标坐标值:可以通过使用mouseMove事件来时时获得鼠标的坐标值,如
onClipEvent(mousemove){
x_pos=_root._
y_pos=_root._
上一篇:[ 06-14 ]
下一篇:[ 06-16 ]当前位置&&&&&&&&&2.0 FLASH的基本操作
更多文章查询:&
2.0 FLASH的基本操作
&&&&&&&日13:32&&来源:&&
【文章摘要】FLASH是Macromedia公司推出的一种优秀的矢量动画编辑软件,FLASH8.0是其最新的版本。利用该软件制作的动画尺寸要比位图动画文件﹙如GLF动画﹚尺寸小的多,用户不但可以在动画中加入声音,视频和位图图像,还可以制作交互式的影片或者具有完备功能的网站。通过本章的学习,读者应熟悉FLAS***的特点,FLASH8.0的界面组成元素,并通过制作实例了解FLAS***的一般步骤。
从"笔触颜色选取器"中选择"没有颜色"选项。
在"笔触颜色选取器"中选择"没有颜色"选项
从"填充颜色选取器"中选择一种自己喜欢的颜色。
请确保填充颜色与舞台颜色形成适当对比。
选择"椭圆"工具,在按住 Shift 键的同时在舞台上拖动,绘制一个圆。
按住 Shift 键会使"椭圆"工具只能绘制圆。
在舞台上绘制的圆
责任编辑:张洪
&关于&flash dreamweaver&相关报道
&硅谷动力最新热点
loading...
频道热文排行
经典软件下载
往期精彩文章
网站合作、内容监督、商务咨询、投诉建议:010-
Copyright © 2000--
硅谷动力公司版权所有 京ICP证000088号使用Photoshop构建动态演示GIF动画
使用Photoshop构建动态演示GIF动画
动态已成趋势,相比静态,更直观,更能展示产品效果。本教程将教你用PS制作动态演示GIF。教程信息本教程使用了PS CC,但是CS5和CS6依然能够支持本教程。然后您还需要下载手机Mock UP效果模板和一些图库照片。静态设计步骤1新建画布步骤2视图&新建参考线,垂直,间隔15px,左面4条,右面4条视图&新建参考线,水平,在40px,128px,220px处设置水平参考线。完成后效果如下图。步骤 3在画布上添加状态栏(也就是第一条水平参考线上方40px处),状态栏各位可以从源文件里面直接复制获取。不过这里我用了iOS 7 UI Kit的动作包&&&&微盘下载下一步,创建新图层,然后在40px和128px之间创建选区,填充颜色#2c3137.步骤4在标题栏添加应用的标题和Logo步骤5画一个放大镜icon,圆形结合圆角矩形即可,颜色和App Logo相同。再画一个选项icon,圆角矩形即可,颜色和App Logo相同。步骤6在128和220px水平参考线之间的区域创建选区,填充颜色和上一选区颜色一样。然后在两个区域之间添加2px,不透明度80%的亮色的分割线。步骤7选择文字工具,添加分类。为了暗示所选中的分类,所选中的分类要用粗体、亮色。其他用普通粗细,暗色。然后”杂志”复制一份,使用粗体+亮色,然后不透明度设置为0%,暂时隐藏“首页复制一份”,常规体+暗色,不透明度设置为0%,暂时隐藏 步骤8在菜单项的左右添加箭头,使用圆角矩形即可。步骤9背景填充为标题栏和菜单栏的颜色,确保背景图层处于GUI元素下方。步骤10在主题区域中,划出如下图选区,填充颜色#3f464e添加图层样式,描边,内阴影,外发光。具体参数如下。
步骤11在形状上方画一个白色圆角矩形,我们会在这个区域放置图像。设置图层样式内发光。(图层样式若不满意可不设置)步骤12添加图像,然后创建剪贴蒙版.然后添加文本图层,利用尺寸,颜色,粗细,来营造清晰的阅读层级。最后添加几个按钮图标。步骤13其他几个矩形同理步骤14先把主要区域的矩形图层全部隐藏,然后构建一个较大的矩形区域,这将应用到选择具体卡片后的细节界面。做完后,此图层组不透明度设置为0%触控点步骤1创建新图层,命名为”Tap”,画一个白色形状,不透明度70%步骤2复制这个圆形,扩大,去掉填充,描边设置为3pt白色继续复制,扩大,描边2pt完事后居中对齐隐藏tap图层组,因为刚加载完界面是不会显示触控点的,但是当选择元素产生转场时会出现。滚动效果步骤1现在,终于开始做UI动态演示效果了,打开时间轴面板,创建帧动画按下图那个红色划线按钮,创建新帧 步骤2显示Tap图层组,隐藏两个描边圆,用来代表滚动手势。当开始滚动时,两个描边圈也出现,涟漪效果能够突出滚动手势。步骤3第一帧1s,第二帧开始帧延迟设置为0.2s步骤4添加帧步骤5显示Tap图层组所有突出。使用移动工具,来上移Tap图层组和主要内容图层组步骤6为了让滚动效果更流畅,选中当前帧和前一帧,点击时间轴面板中得选项,选择过渡设置如下现在,便有稍微流畅的效果了。步骤7如果感觉动效有点慢,想让它快点,那么可以将帧延迟设置为0.1s播放一下,不要忘记循环次数选择永远,更好地观摩效果以便调试步骤8现在我们想让界面滚动回来,我们需要复制第二帧到最后一帧拷贝单帧选择粘贴单帧,将其移动到最后一帧。 步骤9同步骤7,选择过渡添加新帧,隐藏Tap图层组。效果演示:点击菜单分类项效果步骤1现在想要设置点击菜单项后的效果。首先,创建新的帧0.5s。然后再创建一个帧,在这个帧里面,将首页加(粗版)不透明度设置为0%,常规从0%-&100%杂志(粗版)不透明度设置为100%。常规从100%-&0%步骤2激活Tap图层组,将其移动到杂志选项附近,然后将帧延迟设置成0.2s步骤3创建新帧,延迟0.1s,隐藏tap图层组中最细的描边步骤4再添加一帧,再隐藏剩下的那个描边步骤5添加新帧,隐藏tap圆步骤6创建新帧,将和杂志无关的内容项不透明度设置为0%(这里修改了最后一个作品)步骤7依旧在这一帧中,将和杂志相关项上移步骤8在当前帧和上一帧直接选择过渡,为了加速动效,要添加的帧数选择3步骤9最后一帧设置延迟1s效果展示:点击具体项效果步骤1创建关键帧,延迟0.2s,显示Tap图层组(移动到具体项位置)步骤2添加新帧,延迟0.1s,隐藏最细的描边再添加新帧,隐藏次细描边步骤 3添加帧,隐藏Tap圆图层。添加帧,将具体项大图不透明度设置为100%,将图中的小项不透明度设置为0%步骤4在当前帧和前一帧添加过渡,要添加的帧数5效果:嵌入到手机模板里步骤1时间轴面板,选择将帧数拼合到图层每一帧都变成了图层步骤2在图层面板中选择所有帧,转换为智能对象,然后点击转换为视频时间轴 步骤3将智能对象复制到模板PSD里面 步骤4选择智能对象,按cmd+(Control-T),按住CMD/Control来调整每个点。 步骤5保存为web所用格式,ok,成功。(如果对效果不满意,可以导出城视频,然后导入到AE中合成)附:《如何快速保存APP动效?》《移动UI实时动态设计技巧》《设计师应该知道的UI动态设计规则》精选导读:【第13期】07.20~08.03 聊聊那些令人愉悦的动画效果原文地址: 上一篇: 下一篇:

参考资料

 

随机推荐