数学建模社区-数学中国

标题: FLASH教学[闪客学堂] [打印本页]

作者: OA帅哥    时间: 2004-9-15 18:20
标题: FLASH教学[闪客学堂]
* F3 _8 n. ~% K* w. \7 u, Y' j* ?3 L6 o- ~, T w6 R( r+ S, A! Z) k; @( \. x' O* n7 X/ G" f1 c, D# B
FLASH介绍
% [4 V3 G* p1 W

  Flash是用来编辑二维动画的软件,经过几代版本改进后,采用了矢量图形和流式技术,迅速成为网上动画的霸主。Flash能够很好地支持声音,具有交互功能,简单易学,越来越多的教师以此平台制作课件。Flash界面和Director极为相似,可分为工具箱、总谱区、层控制面板和舞台四大支块。Flash制作动画比较简单,你只要定义好各个关键帧,当中的过程由计算机自动生成。它在制作动画方面和秘密武器是多层透明效果和变形技术,再结合按钮符号的交互功能,就能制作出炫目的课件。Flash特别适合表现现实中难以实现的、抽象的概念或现象,像炮弹的轨迹图,原子裂变效果等。只用Flash当然可以开发出一个完整的课件,而且“身材苗条”,适于网上传播。但Flash并不是为课件定制的,在课件开发上存在一定欠缺,最好与其他编辑平台配合使用。

3 G/ l- T8 Q$ x
作者: OA帅哥    时间: 2004-9-15 18:21
标题: 基础篇

基础篇

) d: l. Y& i" `8 Z# N6 e

2 k) [5 t! {8 w$ G
/ ~5 _- B h; [) e7 L* p6 L. F - I |! H3 K+ O1 E* M

一、什么是FLASH?

3 ^( V3 B* K% w y$ x" h% u

  FLASH是Macromedia公司出品的,用在互联网上动态的、可互动的shockwave。它的优点是体积小,可边下载边播放,这样就避免了用户长时间的等待。 $ G2 \7 `* y1 i6 o* Y: k2 F  FLASH可以用其生成动画,还可在网页中加入声音。这样你就能生成多媒体的图形和界面,而使文件的体积却很小。 1 U8 P* S, u. W' a8 s& kFLASH虽然不可以象一门语言一样进行编程,但用其内置的语句并结合JAVASCRIPE,您也可作出互动性很强的主页来。( r7 H1 L1 P j% C- j: L2 \- w+ t   FLASH另外一个特点就是必须安装插件PLUG-IN,才能被浏览器所接受!当然这也避免了浏览器之间的差异,使之一视同仁!

0 {4 K# U Y. p+ o9 ^, [

  有人曾经说过:下个世纪的网络设计人不会用FLASH,必将被淘汰出局! 4 p2 l# j5 J- _- N m  我相信这句话没错!

& v0 z) ?8 k" v4 Y% b4 Q, h" n

二、如何得到FLASH3/FLASH4?

4 O; [3 |2 T' U

  Macromedia公司提供试用版本的免费下载,您可通过该公司的主页得到 FLASH3/FLASH4。

0 g: i4 V: j2 v5 f& f2 I6 P

三、其他相关工具有哪些?

+ E) s" H; @0 h/ g- x# T# h

  基本的工具有DREAMWEAVE2.0,同样也是Macromedia公司出品的网页编辑器,功能强大,与FLASH结合的非常好!(强烈推荐, [; h" f2 B5 J4 x  另外还有AFTERSHOCK,用这配合其它的网页编辑器工作。(比较麻烦)

+ p( O9 ~* [% ~' Y! j0 y% v

  如果你掌握了矢量图设计工具就更佳!如:Adobe illustator8.0 、CorelDraw8.0等。


作者: OA帅哥    时间: 2004-9-15 18:26
标题: 如何产生Motio的变化

1. 首先按主菜单「插入」的「建立符号」选项,建立一个新的符号元件。

5 A! w1 V! J* u4 ]

5 N- h, K) l+ A7 Y; N
1 M: ]) k$ g8 h/ @4 f/ D! E 1 I9 }$ y" Y* h8 u, d: z

2. 给予这个符号一个名称,并选为「图形」性质。

1 ?# O2 n6 O0 Z, | b

% X9 m: p( \9 z+ ]$ Z
8 w F: b/ J+ a$ a0 q0 }% n " n6 O) n. D! O+ ^! _/ x- M

3. 设定完符号内容后,会出现符号的编辑画面,请按左边「工具」图示中的「文字工具」.

# I# a8 a" {$ h7 j4 M

& i1 F* A5 Q# Q; @. a h+ O
6 y+ x5 m+ u# e: v: \) U ! D% K* p! T! Y- n2 s& e

4. 选择您要使用的字型,及字体的大小。

$ k; N- ^$ G+ j+ {1 P. l! R4 {. b

- B7 p5 k( ~& S7 F7 r
# T, i2 b( `% ]* X) o ; a; d6 e: E! E+ v! f- p+ `

5. 在符号编辑画面中,输入文字。

( x( s- Z! L' I1 ~' h

3 m3 C4 M6 K; P; g9 D5 m
1 ]# Q0 T! s$ j5 `; t4 ?( r9 R. u+ ^

6. 按主菜单「检视」的「网格」选项,符号编辑画面会出现网格,这样可以方便精确地排列整齐喔!

6 r7 ?* C+ S+ L: f, j

0 P" q9 ]' o( X
% c! ~" X8 I) Z6 U) x2 n' ?9 @9 x) p9 Y5 N/ l

7. 移动符号到中心点 + 的位置,建立网格比较容易对齐中心点。

8 h* b; A9 {# _! v$ I$ Q6 L

; U" l7 f! S/ @/ K
( x: s' Y7 d3 T' r" I. Y: o R* L/ x" I7 \9 X% }

8. 按 Ctrl + B ,将文字打散,这样可以为文字上漂亮的颜色,相对的输入文字也无法改变,除非重新输入,所以先确定所输入的文字,再做「打散」的动作!您也可以按主菜单「修改」的「打散」选项來完成。

# ^2 u+ B+ |: {; D

% [) M$ ]! ^( S
$ N, }; {$ w' d4 I , @& H& Y6 r q6 G0 @. _

9. 按左边「工具」图示中的「油漆桶」,调配喜欢的渐层颜色,里面有一些渐层颜色供使用。

3 d( M9 @' n; i: y8 C

6 M5 j$ i& W7 r$ E% @
7 S/ i: H: Q; ^* @) U* v - S& ~* y) `1 q) Y6 a$ D1 W

10. 选好颜色,移动鼠标到打散后的文字处,这时键头已经变成像油漆桶的样子,点一下文字,隐约可以看到文字已经上了颜色啦!

7 X- f, S) q. M, t

- M3 p. V1 B9 D. Y" O
! r* a+ D3 l% b! B* ^ j- k) e+ D( g2 f

11. 或许渐层颜色的效果不是很满意,没关系,可以做高速。按左边「工具」图示中的「油漆桶」,下面有两个小方块可以选取,请选右边的「转换填涂」小方块。

, a$ F0 n; h0 }) [" C

- C3 e: T( R7 v
# N* ~+ d4 l! a: w1 J: g; Q( _ $ Y6 _2 G0 L+ H0 o- ^( t

12. 这时点一下文字,旁边会出现一个小圆圈和一个小方块。小圆圈就是旋转渐层颜色,小方块就是缩放渐层颜色,中心点就是移动渐层颜色,依自己的喜好做高速,可以达到很棒的效果喔!

7 u" S5 J$ X* t+ h1 K1 y

. f( `4 k( k( U8 [- \( P$ o) {" X
: `4 D( X( X- ^! R* J8 M( q4 J( n8 D& N! L5 B

13. 调整后的渐层颜色。

( [. E: P+ Y4 V/ C9 b5 G* q

5 D* \* l- I& @8 U3 B @
' K2 H; b' T6 Y- \! U 0 R d z% |$ H y8 f4 ? _6 h

14. 完成符号编辑后,右边有一排符号标签,按 钮回到主画面,这时就可以应用刚刚建立好的符号。按主菜单「视窗」的「图库」选项。

( j- J( h. c/ Y ?4 g0 n5 |4 m+ D

2 ]) W: H) I, T- {
s- L; W) X# H* f3 q) @: @. r1 _5 l1 E. e- o

15. 这时会出现一个图库的小视窗,里面会列出您动画中所建立和使用到的符号。

6 C4 l, a& o2 v; f, g% X

5 G+ N' M0 X1 s7 |
7 `/ ~6 z* a5 U0 j2 R) ~, x + J; Z* m$ {* g3 t& a

16. 拉住预览窗口中的符号,拉到编辑画面中,虚线方块就是该符号!

/ B: ]$ o, w9 L B, q1 |9 e$ j

1 a/ X; ?) ?5 {' w' D7 p) S
) t( V, o; D: S( R% r A& x6 w; K' ^* N7 I5 c, B3 [; Y

17. 放开后,符号就跑出来啦!这时您的第一影格会有一个小蓝点,代表播放动画至时,就会出现这个画面。

+ n$ r9 _; o7 E# C$ |4 M( k. }( E

- S! ]$ C% F$ X* r/ j. s8 b' E
4 R- j/ D; M6 Q5 d$ K6 I4 y4 h . R1 H3 d5 p8 t6 J6 z

18. 为了方便符号的排列与编辑,按主菜单「编辑」的「尺规」选项,就会出现尺。

9 P: J! }. |8 q1 P+ a6 N' M* K

6 [/ J5 ^. }2 `( D/ h" u
, X- j; n; R* I/ s0 }- a) c & u3 p* A6 |3 v, {* v( b$ C. G" O6 P

19. 之前符号已经在第 1 影格处建立画面,因为我们要利用到这个画面,做点小变化,成为后面的画面,于是在第 10 影格处,按鼠标右键选择「插入关键画面」,这样第 1 影格的画面就复制过来了!

9 R$ ~- P7 \+ y7 {

+ @6 m- J* m: X( e1 o7 n8 l! Y4 a
( c8 P( U2 Q8 u8 N# g. d $ S) w, g3 `# o% ^" r5 f

20. 在第 20 影格处,也是重复刚刚的步骤,复制影格画面!

8 V! D' ^- I/ D9 r7 M

% f' Y& `6 F2 `: M3 s$ _
2 ?3 `. M' S5 X7 u; k+ T c' ^% d0 q y+ u8 y6 I ~3 {1 Q* D3 W

21. 接着就是变化啦!将时间轴移到 第 10 影格处,选择符号,按工具列的 缩放工具,将符号放大缩小。

: s. d% u/ W' L* K4 U$ \8 m

, w. l/ q* u" a4 T
+ \) V( [) q% ^ 1 u: _* n7 n( q: V

22. 放大后的符号将成为第 10 影格的画面,其他的画面將不受影响!

% Q4 V0 n$ z3 _

7 v% Z3 K- W/ O5 m1 l
3 ?. D: d* i2 g1 L; M9 h. c 5 T; o; P$ e$ C1 f6 }

23. 建立好动画大概的画面后,再来是怎么表演啦!在第 1 影格按鼠标右鍵的「內容」选项。

" K" f: o" g A3 I

9 x; r L/ h2 L/ e" ?. U" b j& k
% G2 t1 B- Y. f4 u- Y B& i# O! }0 b* `" k! b: G

24. 定义第 1 影格至第 10 影格间的变化,在此我们设定它为「Motion」,意思是第 1 影格至第 10 影格间自动产生產生连续动画 , 够厉害吧!Flash 会依前后影格画面,自动替您产生中间的画面变化!

: I5 S. z) S$ i3 U& u) ^ C5 w. u

+ A3 L: |1 r; C) L: J: R
3 W1 p: Q- i2 c + z v. m9 j7 y8 x6 \

25. 记得选取「自动产生缩放」喔!因为我们做了缩放的动作。

8 I+ Q8 t, i U

6 t6 C3 q: m" r y Q
+ [. W1 W9 `5 O! |8 m2 U 1 X2 F" G; P6 f

26. 您应该很聪明,现在应该知道接着要做什么了吧!?没错,就是产生第 10 影格至第 20 影格间的连续动画,重复前面的步骤,在第 10 影格按鼠标右键的「內容」选项,设定为「Motion」,一定要选取「自动产生缩放」喔!

3 O# O& w. k D; e1 D

2 v; @, \+ x4 L" w2 m# R3 y
7 y- v) r$ g9 |! M1 H+ z- e* _% z+ l0 B, S; l4 ], [/ X: g3 l/ J

27. Yeah!大致完工啦!剩下一些后续工作,或许这个动画您以后还要利用,深怕过一段时间,自己都忘记哪个图层是什么功用!所以就要养成好习惯,替符号、图层、场景、标签等等,取个有意义、好记的名称。现在就来更改图层名称吧!鼠标按一下「图层 1」的地方,它会变成 这个样子,就可以为图层输入新的名称。

% a: D- [4 f6 O6 L( W q" ?( o, _

& Y) F) c T( \: p
' F, X) _! I4 |, m" f, f # J! d# J, j' b+ `: U

28. 迫不及待要输出作品啦!方法很简单,按主菜单「档案」的「输出电影」选项。

1 V2 ~; k' `) {1 m# X8 T5 L. g, [

d& [; R: Q4 M1 a+ q
; u ~4 _& s3 a! R2 t6 {* ] - Y; R, s1 ^2 d

29. 选择好储存动画文件的路径,并输入文件名,扩展名为swf。

3 k3 y% P [& S

/ X. `: q0 R/ D6 E9 }2 y& {: k
" x( F5 g! I& L6 a6 N4 U# C% X t7 Z

30. 设定Flash动画属性,以下是常使用到的项目说明:% r8 `) \6 J" e9 O" m. z. g: _ 产生大小报表:这个功能是输出动画时,附带的动画文件大小说明,可以此来酌情降低文件的大小。- x# l ?+ D# F( B" N 输入保护:如果您认为自己辛苦的作品,不希望被别人修改变成他的作品,这个功能就可以保障您的辛苦。3 H% P# H# n5 N+ N) d5 p+ y( i: { JPEG 品质:动画中如果使用到图形文件,您可以统一全部文件的压缩品质,值越大品质越好。) c, q: X& a# k( Y 音效:您可以在此统一设定动画中使用到的全部声音文件品质。

! A7 E, E+ z! ~9 U U


作者: OA帅哥    时间: 2004-9-15 18:30
标题: 如何使用移动导线

1. 首先按主菜单「插入」的「建立符号」选项,建立一个新的符号元件。

+ g2 _7 l$ E$ B* Z5 B8 l

& |' i) N Y+ O/ X# c/ N3 n
( D9 N& s' u( ]2 l# [6 M. {$ V% G ^3 ~

2. 给予这个管理人员五个名称,并选为「图形」性质。

1 G) f- A/ Z0 P Q n2 V# p

) S, w0 B, }* @" \) C7 v
7 M; |& `1 f" y& ~% Z6 m ! w* O8 r/ _% }8 f

3. 输入一个文件来当符号,按主菜单「文件」的「输入」选项。

5 Y1 G, e% P0 T

/ S) R& M# G& R7 J0 W% f
( }6 S: F# ~5 K) \ . O% a, i( [1 a) y

4. 选择好输入文件的路径及文件,按下「打开文件」。

# A* H5 o% C4 m& h0 r

7 [2 w# j T% y
$ ]7 Z' U; E$ s$ q, J 2 Z/ n# n' A8 ?$ a1 k* [

5. 简单的步骤,图形就输入到Flash中了!声音文件也一样。

3 ?' ?! F: g% G! r7 z/ `8 |/ J! v

0 o6 s# J+ v# j" @+ J/ t3 P& l
6 ^5 C) M3 l% i4 S* M4 ] 7 {$ L, s+ S0 W4 p4 j

6. 因为输入的天使是向左,想把它转换成向右,方法很简单。按主菜单「修改」的「转换」的「水平翻转」选项。

+ u3 A" k2 K. R

/ v3 Q/ r, \& }9 N7 v- H, I8 |0 }
: T" I, G- K) L6 S* F3 V " y9 O/ R! i( R' P

7. 瞧!是不是转向右了呢?!完成符号编辑后,右边有一排符号标签,按右边符号标签排列的 标签回到主画面。

1 _9 M9 V# A5 V7 ? }* I

) s( I+ ^3 I3 ?/ x8 D: W9 d; R( z5 K
& p! Y0 U% e; U9 R & ?9 E% f4 ~, y: z2 d6 f5 x

8. 这时就可以应用刚刚建立好的符号啦!按主选单「窗口」的「图库」选项。

v- r- q& F+ X( h" E9 g, h

+ v' A/ q/ M' B: ?+ [
4 N8 O7 B1 n' c s. F1 m # H* v( k* D+ d6 M$ y$ ]& m0 W

9. 出现一个图库的小窗口,里面会列出您动画中所建立和使用到的符号。 / E- q2 j: @6 r: Z( l9 g. f! @0 G- w3 a ( P.s : flyg 是刚刚输入的文件 )

; n' a4 j8 o' X0 @! k / u/ J$ J' Q4 l/ @5 A& h
# N+ \) q) D6 _) ^ $ P& p0 m; H6 C' }5 T% A2 T. o

10. 拉住预览窗口中的符号,拉到编辑画面中,虚线方块就是该符号啦!放开后,符号就跑出来了。

; m0 h5 o6 ^: p" s; U

) z: [/ l# h, @; \% A$ [, W3 W
/ q3 P, h5 @1 j# E% i 4 S. w& Q( a; R; }. y

11. 接着就是开始应用「移动导线」。在图层 1 的位置按一下标签按钮,并选择「加入移动导线」选项。

6 q0 y( V; r2 r7 }3 G3 R3 {" e

, C, M/ _! Q0 x1 X
% O9 m U: l2 W: N& W X ( e2 ?) p4 O) N) o) y

12. 是不是新增一个图层,前面多了一个曲线的符号,代表您图层1使用「移动导线」。

( J( F/ l& ~) L) v

4 Z5 H$ q# M6 X- b$ f: _
7 J" S" n6 ?3 @3 m+ n6 I G ' d# q c5 o @$ P. L( k# p, {

13. 目前编辑状态在「移动导线」图层 1 的位置,使用工具列中的「铅笔」的「曲线」,随便画一条曲线,主要是用来当符号的轨迹。

/ C) o' ^2 w+ k6 O7 v

* C5 U' D+ Y( V4 F3 \7 l( N
# h. Y. T- X7 T 9 v+ F/ o% W% L1 i' q

14. 画完曲线后,可以做些小修改,使用工具列中的 工具,将曲线拉得更漂亮,记得要先选取曲线。

: @1 G, B9 h( |4 v3 S

; ]' s2 x1 ?8 S9 i
2 n0 T: O3 `7 z9 G* W1 R$ r / j, M6 K( T4 i4 z* |, m/ F g

15. 鼠标从第 2 影格处,按住左键拉到第 20 影格处,再按「F 5」键插入画面。

' W# t/ _6 s. G+ P9 M3 {0 u

$ _9 I0 v1 r, s9 W/ \) M
" G. ?: a5 X9 t: m$ g $ i% C+ p8 J* I- i l- V! k r

16. 将鼠标移到第 1 影格的位置,接着拉住符号的中心點 , 移动到轨迹上,您会看到符号中心出现一个小圆圈圈,只要将小圆圈圈移到轨迹上即可放开,记得要点选選工具列中的 工具,才会出現小圆圈。

7 C0 @: e; U6 q

( V, B" H+ w' L/ L3 A
* O! ], n6 ^, n9 t: o0 z ; W% N) P: f4 r- ]+ M! {% U. v$ E

17. 接着在第 20 影格处,按鼠标右键「插入关键画面」,复制第 1 影格画面。

) \ }) T' u4 `2 T

; m& J2 w T8 `. t" y# q8 s+ h
" X2 g1 g% X4 [$ Q i: D ' R1 Y, i# g6 C

18. 将鼠标移到第 20 影格的位置,接着拉住符号的中心点,移动到轨迹上,您会看到符号中心出现一个小圆圈圈,只要将小圓圈圈移到轨迹s上即可放开。

% l. n ~. y: N4 E. T* R5 M$ @. U

' W, D3 Q6 I8 C1 W8 J% Y
( N4 Z2 b3 e1 B7 E5 f( j# I # ]% R. C$ {8 {( {2 q% j6 }3 {; J. o

19. 接着在第 1 影格处,按鼠标右键「內容」选项。

. e! C( F$ _0 E2 h5 I

) m, Z0 n* H& v" M0 A- y
0 H: J8 v; Q2 v6 E 0 U1 g+ {5 t( |7 q$ V

20. 产生Motion连续动画,记得选中「沿路径方向」选项,因为我们使用了「移动导线」!

( e, l! O2 q0 C3 U) R3 w( |' l

8 v: I5 @* v% ~6 A
' e g# Y& ^7 J3 j0 p , l* ^; S' D: H) i( p. Y( V& W% K

21. 完成第 1 影格至第 20 影格的 Motion 设定后,接着把「移动导线」的图层「隐藏」起来。

9 `- A. n7 h/ M' V$ G8 |+ g) Q

5 K; J1 j2 v% s
) L; E. x6 N. C / u* [ |1 I9 ]- s. g3 R7 p

22.这个「移动导线」图层的标签就会变成一个打叉的眼睛,代表隐藏起来,播放动画时不会显示出来。

! `! k' h* H3 C+ X9 z, a

' g/ q8 D$ U3 P9 j5 f' s* H+ s, _
8 m0 M+ H6 l' H7 O* `3 Q* n % [3 v, J" ~7 t* p+ A C# `

23. 完工啦!可以输出作品啦


作者: OA帅哥    时间: 2004-9-15 18:33
标题: 如何使用移动导线二

1. 每次制作动画前,您可以先行定义画面的大小、背景颜色等等,初始值是 550 px X 400 px白色,修改方法:按主菜单「修改」的「电影」选项,就会出现如下图的设定。

: d# M6 C. J% q1 s3 M2 t! q. Z

% h" _& y, e, b
! G" a( y v7 X 0 t' l/ I7 P7 v; _. A+ T

2. 首先按主菜单「插入」的「建立符号」选项,建立一个新的符号元件。

! G6 w2 |& U9 M

! O' ]$ K1 t9 f! A9 A% G2 ?4 q$ V
& l8 t6 y2 I; D, q+ C# r' G . ]- w. ?3 J, M# K

3. 给予这个符号一个名称,并选为「图形」性质。

( V' `6 G' B$ g9 m0 B$ z# |# g

, \/ i4 r" l; Q1 `; r: x* x- \! K
/ V6 }0 T) ` j1 U$ r% _ ; g q. {* I/ g1 M

4. 完成符号编辑后,右边有一排符号标签,按右边符号标签列的 回到主画面。

2 B% W7 D3 ^, r- ^; i. f7 z

$ o5 o$ i- v2 ~6 x/ X6 j8 x
$ W3 ]. h6 F3 G" y 6 o% f1 Q# q& X+ S. U# k, l

5. 这时就可以应用刚刚建立好的符号啦!按主菜单「窗口」的「图库」选项。

" |. f; k5 f" v

& W: I# P" b; C0 u% I1 I( r
) d' }6 ?& m; k- T / E- M2 k2 G% G( Z* m% z

6. 出现一个图库的小窗口,里面会列出您动画中所建立和使用到的符号。

5 m/ ]+ X" E6 A0 O$ a

( D Q1 Y3 K) P1 O
) \' w' ` F4 ^" F+ e& p ' @8 _( N9 |8 _# v0 _

7. 拉住预览窗口中的符号,拉到编辑画面中,虚线方块就是该符号。

, S: p3 e% ], ~" H* E2 m

- r- P, j- m6 e' V! K
' J7 g! _; [; h5 |0 w8 _ & Y+ Z4 {) L! S) B

8. 放开后,符号就跑出来了。这时您的第一影格会有一个小蓝点,代表播放动画至第一影格时,就会出现这个画面。

4 N4 y9 E7 C% S5 Q* z

4 G0 q) G9 l' e! f3 m* U# e
- s; E1 q! E: n / R5 c D0 W1 b

9. 接着就是开始应用「移动导线」啦!在图层 1 的位置按一下标签按钮,并选择「加入移动导线」选项。s

) Y4 m. O" v3 p" s& l

/ M1 e d9 H6 G7 Y3 v4 m5 x# f+ W
9 k5 x0 W, V9 t# m( | * x2 Q6 W( `( n! O% z

10. 是不是新增一具图层,前面多了一个曲线的符号,代表图层 1 使用「移动导线」。

4 I' _! Y6 e$ {7 h: G

9 q* X7 n5 s" \, w5 G! U- U
" r& M( `4 e9 j/ L. t L ; C8 V! D5 X3 z( A3 ~

11. 目前编辑状态在「移动导线」图层 1 的位置,怎么看呢? 就是「铅笔」的标签,就是目前编辑状态在哪个图层。现在可以加上符号移动的轨迹,在画面中使用工具列中的「铅笔」的「椭圆形」,随便画一个圆,不一定要是圆,曲线、直线都可以,主要是用来当符号移动的轨迹。

+ {$ b) j: S$ G

: a! }2 {& W" A; e% p" g5 w% _% D
' c C$ d' N5 z: D2 U! [$ C3 z; [ 0 m' H1 f8 ~# ]2 S1 T) x' k

12. 在第 20 影格及第 40 影格处,分别按鼠标右键「插入关键画面」,复制第 1 影格的画面。

7 c. d. |/ ] H/ W8 p# o 6 X5 ?1 Z% n( k% B0 p# z" g
9 z$ W( w- ~* ]% q' X0 |9 _* _) Q) f, Q! T9 D

13. 将鼠标移到 第 1 影格的位置,接着拉住符号的中心点,移动到轨迹上,您会看到符号中心出现一个小圆圈圈,只要将小圆圈圈移到轨迹上即可放开,记得要选取工具列中的 ,才会出現小圆圈圈喔!

8 r* z3 W2 m, e1 ~; I

+ d; Q) ?+ r8 G3 a; g
, G! ]; G% m! m4 u K. J q" |" @1 F+ Q% K7 M, d" y

14. 依样画葫芦,将鼠标移到 第 20 影格的位置,接着拉住符号的中心点,移动到轨迹上,您会看到符号中心出現一个小圆圈圈,只要将小圆圈圈移到轨迹上即可放开,做完第 20 影格后,并完成第 40 影格。

6 ~' y+ d' N. j/ b, _. ^ G

8 R+ |0 R4 J, }3 a# W: l
5 w0 J! F" y7 }* Z2 l. Q 7 G6 B+ o& k. G" ] U

15. 移动的位置在轨迹上的任何一点都可以,只要是让动画播放起來有连贯的动作,下面 3 张图片分別是第 1 影格、第 20 影格、第 40 影格移动放置的位置。

8 }9 V/ J# o# R& C% [

( P.s : 第 40 影格第 1 影格的位置不同喔 ! 第 40 影格比较靠近第 20 影格的位置,至于为什么,请看此节的最后一个步骤即可明白 ! )

: c4 k& \ B1 t, b( `* S9 x8 F! s7 L% b

! ?0 [/ K: E' I* Z. B
" h4 G: a1 `4 H; }% h1 j2 | - M7 k8 w4 r' y! r/ U4 \

16. 接着在第 1 影格处,按鼠标右键「內容」选项。

- ? Y0 \2 {9 g# h* a; }! F

. \; U1 i: h: W+ j* R

* r& W1 z% O: F2 d
, Q m( N/ t; |: T7 }& a; k 3 [. c( k5 O3 R9 K6 Z

17. 产生 Motion 连续动画,记得选取「沿路径方向」选项,因为我们使用了「移动导线」!

$ m7 L+ i" Z" q* T! l7 S+ G 0 d( s* e+ R) V7 `/ R" ~
. g8 f$ H& H0 V% C! Z& B5 Z8 i # i0 P2 q/ ^- }; V: N4 u

18. 依循上一步骤,也将第 20 影格完成 Motion 设定

2 U' }* W& j I' y

5 Q' ^& f& {+ x2 x5 L. ?6 r! g6 P
( V( U- ~( x# T! I $ I; V/ {* Q$ m) Y( F; g

19. 如果您不想显示出符号移动的轨迹路径,可以在「移动导线」的图层中,按一下标签按钮设定为「隐藏」。

1 c9 G7 i1 S5 E: `% | s D

7 |, l& _5 U: N+ R/ Y
7 [. O8 m- \2 k# Y, l1 _ 4 Q' K9 K; F" O" @

20. 这个「移动导线」图层的标签就會变成一个打叉的眼睛,代表隐藏起來,播放动画时不会显示出来。

' C) t! s. d S

7 i0 j9 w, H, e$ c r% r
. V. e0 F7 I& n3 f2 z6 c , w1 \4 p. U0 N4 B

21. 完工啦!可以输出作品了。 ( P.s : 输出电影方法及步骤可参考 [如何产生 Motion 变化])

* _6 O5 F* G$ x* s/ ]
/ [" m! q2 R/ V0 T- ]) K4 l- _) m3 X8 G! z

22. 附带一提,以此例來說,为什么 Motion 要分成两个部分呢 ? 是这样的,当您使用到圆形的「移动导线」时, Motion 勾选「沿路径方向」,Flash 会依照第一个画面和最后一个画面产生连续动画,它会走捷径,也就是最短的移动路线,所以要分成两个 Motion!如果您只使用一个 Motion,第一个画面的放置位置完成,再来是最后一个画面放置位置移动一点点,设定 Motion,希望能依照着移动路径跑一圈,Sorry,没有办法,因为它会跑前后画面最短的移动路径,所以无法以一個 Motion 完成,要用两个 Motion 以上才可以完成喔!是不是又学会一招了呢?!


作者: 熙佑    时间: 2004-9-16 17:41

不错!


作者: OA帅哥    时间: 2004-9-19 12:08
标题: 如何制作互动式按钮(一)

1. 首先按主菜单「插入」的「建立符号」选项,建立一个新的符号元件。

9 v6 p: O* W+ D

0 f& I5 u) A) E6 D( F$ J
' i9 t( Y! C( f$ F5 s. D0 M, x& b) v& ~( q

2. 给予这个符号一个名称,并选为「按钮」性质。

6 N. ~# _4 N: o: |* R

: T% V+ L" v+ z# h
2 ^ u7 l& h+ z+ P% d; D : u5 f3 u9 d7 S0 ~, ^

3. 点取右边工具列中的「铅笔」,选择「椭圆形」并设定线条粗细。

1 F+ u* {5 L9 t

% Y, N J( U& W! ^; J
# G0 d$ {+ ? c! c* ~1 a8 n$ n5 ~, G4 h3 p5 S8 x! E$ k

4. 在编辑画面中,画一个简单的形状。

; O2 `9 [2 F6 m; N5 C

" Q: P4 }& w0 l$ R: z
7 N; E7 U/ G H5 D* K" \ ' m6 L: g( ~9 R5 q% `% c9 E

5. 接着点取右边工具列中的「油漆桶」,填入漂亮的渐层颜色,可以调自己喜欢的颜色!

4 L2 g, S) ~9 G( Y; [4 k

3 R# P1 K1 Y: g% ?5 o% h) z2 j5 O
" h6 J( [# y" M 9 H% y R: p) @( o

6. 填入颜色至刚刚画的椭圆形区域里。

& M6 b! E" q' t

8 v+ K8 E. m, z
5 y H. U' Q$ S6 a; N) u - o+ I2 F. h `- \* L3 n4 G

7. 这样就完成按钮原始的外型,不过没啥特别。所以接下來就来制作互动式的按钮。在「滑过」的影格处,也就是 Over , 按鼠标右键,选择「插入关键画面」选项,复制前一个影格画面 ( 一般 ) ,这样就不用辛苦地再画一次啦!

$ I/ J4 |" l$ |

8 @0 C1 B! {# ^- H3 W
5 i4 {5 E& I+ O 0 ?! T8 _) R3 o# p

8. 来点特别的,填上不同的颜色,方法可参考前面第5步骤。这个画面就是鼠标「靠近」按钮时会产生的变化。

" N" r5 f. l X0 M* q. \

/ f( e; D& c& ~
/ x- p+ D5 n/ ]4 X: T4 ^ & E3 s" t. v5 y& B; X( T

9. 同样的,在「按下」的影格处,也就是 Down,按鼠标右键,选择「插入关键画面」选项,复制前一个影格画面 ( 滑過 , 其实 Over 和 Down 都可以同时复制「一般」影格画面,因为我们只是改变里面的颜色,没有改变形状等)

. b- b# f/ c) c' K' g

8 H, N/ b" n' d+ x
T! Q2 D0 \9 _8 {" R$ m. k 6 N+ e$ Z6 s$ r8 k

10. 填上不同的颜色,方法可参考前面第 5 步骤!这个画面就是鼠标「按下」按钮时会产生的变化。

$ A/ X H9 w2 ~6 d$ V. f' J. C

7 a0 S8 \- P4 @' D, k8 L9 J" n
0 R ]6 T7 p o5 E/ t3 {6 s& r 2 Y/ U% R1 N/ g8 c. K5 E0 s

11. 按钮图层下新增一个图层,在「铅笔」图示的下方小方块,按滑鼠右鍵,选择「插入图层」,此图层是加上文字用的。

& Z: G- C0 |2 s6 X( u! h5 T

2 V! v# A/ p; y5 [0 P; \, T$ Y
* y5 R( B" F! k8 ]& E& P8 w5 `& z/ Y; I2 S

12. 可以为图层来命名,双击图层名称处,即可更改。

. U; L# U' i! @

3 W; F7 e$ G1 e' c! o
( x/ T Q; x( X3 ~3 H8 i9 ` # k. e. ~; _+ R3 y% g- u& H; {( X' G

13. 接下來就是加上文字,点右边工具列中的「文字」,设定好字型、字体大小属性等等。

1 q" w/ M0 E- Q' [7 @

( i# j" A" r& X$ G5 @
- |( ~# N- Y8 b3 k- x6 c # N" z# l5 c0 f# p* e

14. 在适当的位置加上文字,可以用鼠标移动文字调整位置。

" C* l: z) x Y5 p

& B! S8 P/ R6 T% S1 s( s
& C! s' u, l5 s P) } 6 Y- y9 z3 F1 p$ r1 d

15. 文字输入完成的画面。

3 E7 [' Y9 Z# F7 u

! n! A; h; N2 M' a9 l" L
, @! K: H. F: m$ u/ q- o) T/ m2 x8 z

16. 同样的,我也想在「滑过 Over」、「按下 Down」的影格画面加上文字,可是文字不一样怎么办?方法很简单,只要插入空白画面即可啦!鼠标移至「滑过」影格处,按住鼠标左键拉至「按下」影格处,即可放开,就选择这两个影格了!再按鼠标右键,选择「插入空白关键画面」。

6 [ R3 `- M1 D F% {' Q

. u. d4 _& G6 H; h' M. s' t
9 _& B$ b- v+ R2 Y4 {3 U7 j8 l ! j& Z, L z3 ?+ O

17. 将时间轴移到按钮的「滑过 影格处,这样所编辑的动作才是「滑过」影格的画面,不然,很容易更改到其他的画面。

/ r, Q' D9 K- d3 N/ U8 e9 F
: U( R* i8 y/ r- s ( ^7 q4 A, F1 j& P! D1 \

18. 文字输入完成的画面。

% c3 ~0 l) D4 ?: u

% E" p, w9 o/ S) Q4 X3 a4 A
9 {' h, A$ D. a9 b) P% Y7 b7 ]9 h* {0 I% `" n# j' _+ Y

19. 同样的,将时间轴移到铵钮的「按下 影格处,这样所编辑的动作才是「按下」影格的画面。

" y k/ b/ J' [5 d1 [9 y% W
2 w* k9 y+ @5 S k) A & a% L y+ e7 {' l2 d- U

20. 文字输入完成的画面。

( f% \! S$ j/ U

, w( R6 ]3 O$ Y4 X% O4 z
' `) c* \/ E9 G" [ + }. q1 B$ Y/ W. u7 t: z0 c# |

21. 完成符号编辑后,右边有一排符号标签,按右边符号标签列的 标签回到主画面。

6 c: b' w/ s) j- O1 I0 Q' `4 s6 W
7 @0 K" q4 T5 b7 I0 y: k' S* Y6 z, |; O }

22. 这时就可以应用刚刚建立好的符号啦!按主菜单「视窗」的「图库」选项。

" r$ t3 N- Y: u

- `$ q3 b8 x- s- V: V4 x' T
3 t! @4 `+ v, {" L( M 2 O0 K; q- ?8 |; G0 Z# z6 l

23. 出现一个图库的小窗口,里面会列出您动画中所建立和使用到的符号,鼠标按住左键拖曳符号至主画面中

. A Z% V d( K1 @" X. Y7 k

" N7 f5 j1 B5 o/ k" T) D, V
- r1 h: ]5 k& s- U# M; _- Z; \/ X1 J: r1 ]3 M$ f3 O! t

24. 虚线方块就是该符号啦!

' _; q. G. _8 Z" L: [/ b. T V

% f" U. U) ~8 {& V
; o, F* U9 p" C: r . v% s. w4 ?0 C1 |0 f9 c. M

25. 放开后,符号就跑出来啦!

! X$ m0 H, X8 k7 d$ E K

/ G8 u9 ?: b$ ?4 ~" k
5 Q6 F& R% G9 _! w " ~! @4 x; _, R6 O. Z

26. 想不想先预览成果呢?沒问题,按主菜单中的「控制」的「启动按钮功能」,就可以试试按钮的动作了!

" o3 H% F* Y! U9 V- ~

0 D1 R1 `2 N5 t
4 n8 \- W, |% Q, D ' ?) }8 P( h7 n% A% Z* A

27. 互动式铵钮。

% R7 I# G3 u9 |! e+ |5 ^: h; [" N- w7 a, \1 ^9 Z$ {8 d" f( x$ I& u$ A2 X* K" l% z$ n4 R; Z0 y* }; V6 Z6 l8 O& j h8 i* A, g6 }% X9 S+ H9 @ y: z8 m3 e/ t# e% n" y. b1 F' I4 W, e' m2 L2 D* g" K1 F% X- `0 a# o3 D4 i7 ~0 f) @6 ]
按钮「一般」画面 按钮「滑过」画面 按钮「按下」画面
* o9 s2 Q5 w# h F" I
6 ?2 a/ ? ? F/ B2 [% M7 r) z5 z- Y

28. 完工啦!可以输出作品啦!

6 `$ d: B1 u) j9 m. d0 J( M) J& c
% X8 m. D# M( f. T4 P- H 4 c. Y) ]* S E7 d2 X6 f

29. 此篇为「基础篇」,让您知道「按钮」的互动观念,接下来的「按钮」教学,将越来越「进阶」。不会很难,只要脑筋转地过来,会感觉「按钮」很有趣且好用!只要是互动式动画,一般都会使用到「按钮」,所以要用心的学喔.....


作者: OA帅哥    时间: 2004-9-19 12:10
标题: 如何制作互动式按钮(2)

1. 延续「 互动式按钮(1)」,此课将为按钮加上「超链接」以及「目的窗口」的动作!

- y5 P# S( R( ^/ i# o/ D. K
' T/ g9 e" W% w, |- y9 T) `: ^4 P- u : v! W: J4 v" t! w, C

2. 应用「互动式按钮(1)」做好的按钮,在场景按钮处,按鼠标右键,选择「內容」选项。

9 F' x7 T3 F- [: z/ i7 Z7 i# @

( ^8 D( w1 c5 J
) Z. | N- U6 I* D: ? / p$ v; w7 Y* f& o4 g0 l) y% R4 Z! j

3. 会弹出符号的属性设定窗口,请点「动作」属性设定。

1 @% e3 z: L' S- P$ W1 P6 i2 }; t

1 A2 E* _" X) [2 M' N# W
7 L; i/ w+ `5 ?1 }- L( m & V+ |1 E+ J1 i6 j; T

4. 接着在右边处,可以看到一个类似「+」的按钮,按下去会弹出菜单,请选择「鼠标事件中」。

8 c- s$ ^1 ^6 X" o8 p3 |; n6 w/ q

m3 k' E7 O$ Y% v
1 l8 u7 k# n5 {$ M8 H5. 在动作的项目中,增加了「鼠标 ()」以及「鼠标結束」两项,请点击右边鼠标事件的参数,可以依自己的喜好来设定,「按下」的意思是「当按钮按下时,马上执行动作」,「放开 」的意思是「当按钮按下时,不执行动作,直到按钮被放开后,才去执行动作」,至于下面几个事件参数,将在往后跟大家介绍。 # B# A& @- R" {+ s, [! f P

! C/ b/ a6 K1 ^0 @- K, @
6 w2 P S ^8 H7 T& S7 z ' @2 F4 p- q n0 |$ F3 h5 r

6. 设定完鼠标事件后,接下来就是「超链接」以及「目的窗口」的设定了!在动作「鼠标 (放开)」的下面增加一个「超链接」的动作,方法很简单,按「+」按钮,请选择「取得 URL」。

0 a. ^* R9 k9 h% y& z

* O( Q8 {% g& _& I8 o( c1 I" G
+ W/ A3 ], d3 }0 _$ Z- h1 \# D( w2 X. Y 4 D% D% M& S+ r6 u8 E 7. 在动作的项目中,是不是在「鼠标 (放开)」的下面新增加一个「取得 URL」的动作呢?!至于参数设定,URL 当然就是输入「网址」啦!可以应用 HTML 语法 , 如「http://」、「ftp://」、「*.htm」等等的超链接语法,很多人都问要如何加超链接 E-Mail,只要输入「mailt电子邮件地址」超链接语法即可!语法与 HTML 一样!! 2 ?9 n x+ @! x& s+ l

. I2 U% t% a6 e7 Z* c
% g% ~( `, h) }9 z* h6 l2 {9 v W # }: B: [$ N" F* m- |8. 「目的窗口」也是众多网友的疑惑,在此說明一下。「目的窗口」其实相当于 HTML 语法中的「Target」语法,可以应用 HTML 语法,如「_blank」或「new」两者一样,都是「另外开启新窗口」、「_top」则是「在现有的窗口中开启」等等的目的窗口语法。也有相当多的网友问,使用了分割窗口 ( Frame ) 后,要如何指定网页显示的窗口呢?!方法很简单,不过有个前提,就是您的分割窗口(Frame) 要指定 Name,这样才能指定目的窗口。 & U+ j9 @+ i9 l5 i/ c+ C

举例來说:分割窗口主要文件的 Frame 语法中要有 Name 参数!

' C6 J6 {- \6 O5 F" W a4 I* P) E

<frame src="left.htm" name="left">: t* F- B+ r6 h% N# W! w <frame src="right.htm" name="right">

( c# x7 k0 S! V& Q- q- Q

假设您的按钮 .swf 放在右边窗口中,想指定网页显示在右边窗口,那「目的窗口」就要填入右边 Frame 窗口的 Name,也就是「right」.

" X; c0 m M' T

4 o) o& ?2 k7 k5 ?
6 Y6 Z2 G' P2 \8 F 9 h: w/ b' _: }% [

9. 按下「确定」按钮完成设定。

5 M- l! j8 l$ e: B

# t7 Q% X4 A( N; K2 k' F
. ]0 ]2 D: w$ @5 H, h e$ N) U' J0 H ) y4 |7 T# B5 s- v( o3 m

10. 完工啦!可以输出作品了!

" V; `3 X# ?) e& D5 `
& ~ `- h" Z4 P2 K" G& Y , c" y% t x4 E1 r# v/ K

11. 附带一提,在 Flash 3 软件单独的 .swf 文件,无法测试「超链接」等等的动作!要输出 .swf 文件,在用 Aftershock 产生 .htm 文件,最后用浏览器开启 .htm 文件,才能测试「超链接」动作是否正确!


作者: OA帅哥    时间: 2004-9-19 12:10
标题: 如何制作互动式按钮(3)

1. 接着「互动式按钮 (2)」,本节交赤按钮加上「动画」效果!

% _* F( N, H7 K
3 J# |$ Q. B: x: J; C# j6 K6 X# i2 G% i6 }- z. Z+ T" t- W

2. 应用「互动式按钮 (2)」做好的按钮,并建立一个「电影片段」( Movie Clips ) 的符号,按主菜单「插入」的「建立符号」选项。

& S3 d0 ]" h" M5 U8 u; ~' c; A

5 v( D% z0 @- ?" r# ^
* E& K* X+ a2 _" m2 j ) O+ C+ g- Z4 K d0 }

3. 符号的内容设定,请选「电影片段」选项,并按下「确定」。

8 r5 z0 R& n& K" D* T; H( K2 _: I; e) q

( J7 x5 N0 ]; j2 l# M/ i
( C u0 R0 G- J X- z P * A) f* o, I! i( n/ O$ y! z

4. 接着应用「如何产生 Motion 变化」,来当作我们的「电影片段」,您也可以自己做不一样的电影片段...以下是文字 Motion 缩放变化。

" L! t) r: F+ H* Y+ p* A

3 e& O7 O' _. ~. h" ^
3 d+ Y( ]# A) P, n: [3 E% h4 A0 E: ~6 X: `8 r/ u

5. 时间轴影格间的变化。

) z- [0 P e$ |

( U! p7 {. N2 H
" H% t/ z! O7 o: E# d 4 C! [/ ?* }, v0 K

6. 在按钮的「图层 1」下面「插入图层」,准备用来放置「电影片段」。

3 s5 q9 F1 L2 o1 I4 c

: d# b: H, K1 N+ J# h3 h" k8 S) {: K
1 a/ l2 r# x8 W% j % h$ k1 n8 D1 L; @. Y7 Y) [8 s/ r

7. 图层的名称随便取一个,在这里我们取「动画」好了,方便大家学习!因为我们是想在按钮「Over」滑过时,产生动画的效果,所以时间轴移至「滑过」影格位置,您也可以将它改成按钮「Down」按下时,产生动画的效果,那时间轴就移至「按下」影格位置。

/ Y$ ?9 y8 P% W P/ ^- ]

; ^& V4 y3 k& C* l1 a
. H9 ]' f7 S0 l0 v5 U M / a$ A4 h0 D. r, u1 n9 U

8. 接下来就是把刚刚制作好的「电影片段」应用上來啦!按主菜单「窗口」的「图库」选项。

T" D2 Q8 O$ W7 k

/ S( X! x2 A/ Y) e# k1 h
: F5 d$ g [: x: N6 `' g6 l$ e7 k+ _

9. 选择好我们的符号 2电影片段」,并用鼠标拖曳至编辑画面中

- \" Q& x, C/ d: }7 W Q

" w! O- Z# t8 C" r
7 W7 K" t& u$ s" |* [ ' ~5 z( r+ z: v6 A/ X4 e, r

10. 按钮动画图层的「滑过」影格,是不是从原來的「空白影格」变成「蓝色影格」了呢?!

, A) B H# ]; K4 U

% X4 W3 m2 e* u+ ?
# Z' @; g. {0 ^& _ , t2 L0 u* h x$ L) O' V

11. 按钮「滑过」的画面,在这里无法真正看到按钮「滑过」所产生的动画效果,需透过主菜单「控制」的「测试电影」选项,浏览结果。

0 L6 U" `' n9 ], o

, x; M+ x& B& N2 c
% _- }7 Q; _7 n2 Q3 D j1 ]: q% ?3 M4 L4 L

12. 附带一提,若您按钮的「按下」影格没有加上「空白影格」的话,那按钮的动作就会怪怪的,变成鼠标一靠近「电影片段文字时,就会产生动画效果!会误当作是按钮的一部分,所以在按钮的「按下」影格加上「空白影格」,使按钮的「滑过」影格之「电影片段」没有延续下去,这样按钮「滑过」时才会产生动画!

4 f0 N! Y. k( T9 _0 @" h9 v

3 ~6 I9 S& B' J, X# L/ K* v G
+ B) U1 Z" y9 B; k) r9 o; r, W! ]6 r

13. 完工啦!可以输出作品啦!


作者: ╃無名草╃    时间: 2004-9-19 12:21

这个帖真的很好

加分!


作者: ilikenba    时间: 2004-9-19 17:15
学习!
作者: Syusuke    时间: 2004-9-21 21:43

FLASH 5的!!

现在的初二幻城MX了~~

MX性能比5号很多◎◎

色彩真的很棒◎◎


作者: ╃無名草╃    时间: 2004-9-26 10:50
以下是引用Syusuke在2004-9-21 21:43:08的发言:; h1 n. A3 @4 t0 ]- B4 r; F' P: X! g: G 8 W. {6 x! L8 ]+ b7 Z" u: z* T) y

FLASH 5的!!

7 b% ]( K/ G$ _* }" F8 X- N5 a( Z

现在的初二幻城MX了~~

! x9 q( z1 u6 k$ I/ ^

MX性能比5号很多◎◎

9 f3 \: |7 {+ `1 s! o; A- {" d

色彩真的很棒◎◎

4 n# b$ i2 d2 ]& [

谁能弄mx的教程?


作者: Syusuke    时间: 2004-9-30 23:44

这个,你想学的话~~~~

偶就会~~

但是教程还是去买书来的快


作者: lynn324    时间: 2004-12-6 16:40

是个好东西。


作者: sam53    时间: 2004-12-24 04:15
good




欢迎光临 数学建模社区-数学中国 (http://www.madio.net/) Powered by Discuz! X2.5