[分享] 打造窗之恋音乐动画

新建一个空白的Flash文档，把背景设置为黑色。  @+ E3 F8 R7 L
* N2 Q1 C$ |3 q4 D  U$ H. S

: ~% |. z1 Y' z8 e. l6 f& E/ `
: r  |0 b% [( y8 Z

- I8 _4 x' @2 G5 u( }8 f  l0 D在场景中把图层1改为窗框，然后在这一层中绘制一个矩形边框。3 S- L$ S; |* _2 L. G# v

# _2 A( u+ d3 Q- p
2 M) H, K) C0 @# f

# g% }  n  c8 ^6 q
" t( a4 ?: O6 Y因为这里要把窗填充成一个木制颜色的窗，所以要先导入一张木纹图片。选择文件——导入——导入到库，导入一张事先准备好的图片。3 ?" V5 n* f4 \( g! `* D

6 S$ ]( {/ y' t( y4 S. f* u& @; J" i: Q" y


9 x4 Y- t1 ^! |6 y7 p, R& L, ?
5 ^: {" H( V; l# G/ J& B) G& _9 x( G导入后按Shift+F9打开混色器，把填充的类型选择为“位图”，然后在选择刚才导入的图片填充。
" T, `  q5 d2 |8 w/ s
6 B* ]7 b! A6 H! V! t/ F6 Y1 ]7 h7 R. h* [: r7 m$ P3 f$ v4 ~2 e


8 y  g3 Z5 s2 Z' r3 F1 |
& W9 j' n" C6 G. k+ j新建一个图层为“窗”，把这个图层放到“窗框”下面。然后在这一层中绘制如图的窗。用刚才的方法把它填充成木色。
  a5 t- {( S& y% f8 g
% ~6 X0 A1 {8 `& T3 [3 F7 I% t% R$ x+ R  \8 F0 b! L

8 }* p, @7 ?/ r% K# u7 [4 j
! d2 m, g1 g- I5 t! v/ h" D
中间的玻璃用透明度为30%的灰色填充。$ N7 x* m+ w8 m3 U9 }5 }1 Y" B

4 U0 I0 Y4 L' _3 u& C1 U9 R  `* Z, o( T: n0 Y: Z6 n

% j4 V5 g2 w3 g. d* `  y! R/ w
6 b; s& O( n* \% ?; N& q
窗画好了，下面开始来画窗帘了。按Ctrl+F8新建一个名为“窗帘”的影片剪辑。% m$ T/ ?% L3 W% b" @

& C% `7 ?6 k3 W; @' E" R% z) |, R. u# N: m7 R


2 {1 o8 ^8 {4 W! d0 r0 Q
( [4 L# e7 |& e6 i在影片剪辑中绘制如图的窗帘布（当然，你也可以按照你自己的意思来画），填充色我选择了透明度为30%的白色。+ M* A% n. @( Y. w6 _4 M& T' R/ L

3 a3 Z; a2 h9 W7 f
# o* S) A( _8 O$ t7 r1 \: F$ m/ u6 B

) v3 g+ a2 `; f" _
7 a; ]! d# v- u# z. x在图层1第50帧插入关键帧，在这一帧中用选择工具把窗帘布的形状改变下，如图。5 N0 m+ m/ P$ Q# h. h! J
) A2 V$ u4 c8 M3 O
1 S) X' i3 `& O# H) |* c


! V. ?0 J4 C, c& T# D! c$ c, w
0 y  b& P7 o: ?7 i( H改好形状后，在第1帧右击选择复制帧复制第1帧，然后在100帧右击粘贴帧。（这是为了使窗帘布来回飘动）最后，分别在第1帧和第50帧插入形状补间动画。
% l+ z( o% y6 z. N5 `! |  R4 h- {9 K/ Y, k% `! Q) L, u
" b& }" z# I' M' ]- r+ c


4 c( ^2 O' G, c, N( X8 W: l( v/ L0 F
注：形状补间动画有时并不能按着自己想的那样来，就像我这个窗帘吧，刚开始时它也老不按的的想法来，而且加了标识记号也没用，怎么办呢，还是有办法解决的：首先，在第50帧插入帧后别急着改变它的形状，先在第1帧插入形状补间动画，然后再点第50帧，这里别一下改太大的变化，就一点一点改，改一点就点下前面的帧看下变化的过程是否看，不好看就按Ctrl+Z撒消，重新再改。只要你要耐心，慢慢一点一点弄，最后一点能弄出一个飘得很好看的窗帘的。 + `/ S) v( Q2 U; p# S% X2 B0 d
8 u# p9 \; J' F/ y& H7 C, K2 s
新建一个图层2，给窗帘绘制多一个叠影，方法和前面绘制窗帘是一样的，我就不多说了。7 ^- }, b5 ~0 y; |: P3 L

1 \7 |. A# \% |& s8 s% Y$ [, k, x5 j
" H. G3 H* M4 H) E, |  f$ H
& [4 e5 s/ K% Q; a9 m: a
$ G/ @0 H) s% d0 s, t
新建一个名为“窗帘1”的影片剪辑，按Ctrl+L打开库，把刚才做好的窗帘动画拖到场景中，然后在第29帧插入帧。
+ D( `* F4 K# M( \/ `/ i  m9 {+ _! t7 H! Z
: c2 ^) ]! D% J; U% g/ K  [" Q


! A, {  A0 ]- m! }4 F" V0 s1 |9 q% h1 s, E! B% X9 w4 v
8 v; G' ^' C* ~; `


3 T5 z0 z7 _3 m' d% i, u/ [5 c- i* y) ?# f5 P
新建一个图层2，再拖入一个“窗帘”的影片剪辑，然后选择修改——变形——水平翻转把它换下方向，同样在第29帧插入帧。
0 e$ g4 [! \. T; I' p0 k# w8 e! w2 y

+ O, Q* x3 ^0 ?! o

. W. @" D1 o! v3 q
9 L$ ~0 x) {" k( z' n+ }新建一个图层3，这次插入两个“窗帘”的影片剪辑，同样把其中一个的方向改变下，下用变形工具调整下这两个图形的大小。只要让它看起来有层次感就行了。最后在第30帧插入帧。* P% g0 U2 R5 C. S5 f

* v- e" q0 K$ Z4 n1 b7 V$ }) E& S0 k: q- h

0 V$ K3 h" R- m1 v1 z/ e  U

( Z4 V# N0 J& F0 O; ^再新建一个图层4，在图层4第30帧插入关键帧。这次不拖元件了，点下图层1，然后把图层1场景中的元件按Ctrl+C复制，再点下图层4第30帧按Ctrl+Shift+V把它粘贴到原来的位置，同样的，再点下图层2，把图层2的图形也复制过来粘贴到原来的位置。最后，按F9打开动作面板，输入stop();
9 U9 ~( r2 e+ C2 }2 W. N2 H) f$ G
" z2 ~$ W2 }* O3 g
: }: ]6 Y2 g! o& G& H* [
, a+ R" x! H: E

2 v; u. P9 M2 p$ i; w, O; f最后，分别点下图层1和图层2中的元件，按Ctrl+B打散。有些人一定会奇怪为什么要这样做，其实我这么做的目的只是为了等下窗帘飘动的时候有层次感，不会同时飘起来，至于把两个元件放在不同的层，只是为了打散后颜色不会变。- t* e5 t# e0 A5 E
4 z3 S1 v, x$ m: e. R1 }
下面返回到场景中，新建一个图层为“窗帘”，打开库，把刚做好的“窗帘1”元件拖放到场景中，拖两个，一个用水平翻转改变下方向，分别把这两个元件摆放好。如图。（可以适当的用变形工具再调整下）6 q' W, E/ @% g3 R" o: Z
; R0 S" U. v3 M( t  G

. P( _2 E- y1 E  T- Y

  M$ D" [9 _0 D* C, S/ J( }
/ Q; D& E4 F/ u0 K4 v0 V: P这窗做得差不多了，不过背景不好看，咱给它换下背景吧。& G7 r" `  Z& [  x6 |; `/ N3 z
新建一个图层为背景，（把它放到窗图层下面）然后画一个和场景一样大小的填充的矩形，然后把填充色设置为无，再画一个小矩形（这个矩形是无填充色的），把它的大小设置和窗一样大，画好后，在场景外点下，取消选择，然后再双击场景中的小矩形，把它选起来后删掉，这样，背景矩形就画好了，（我这里又导入了一张图片来填充，方法跟前面画窗时填充一样的。）
, u+ M/ C% A2 K1 E! D- q# p5 p! |
! n8 v" \1 N8 L4 }9 z! j; U% Q( o) ?1 R% J+ G2 A; k


2 ~5 H( I: v  l8 A
; ~9 M4 i0 s" v" v. @, t6 E8 D) ^画好背景后，感觉是不是好多了，可是再看下场景中，发现窗帘上面多出的地方实在不好看，怎么办？用选择工具在背景层里选出窗上边的图形，然后复制，再新建一个“背景上”的图层，在这一层中把它粘贴到原来的位置，这样就行了。" _& T8 L0 J" D. K7 H1 P! D
$ o4 C5 Q& s) E' r
$ i0 }1 f+ [0 l5 i5 x& ^7 ]/ ?


6 H! K/ L7 P4 U5 u. z. \3 ]
! ?" \$ \+ u) Q1 o8 V9 c新建一个图层“窗上”，绘制一个矩形条，把它填充为和窗一样的颜色，再把它放置在窗上面，然后再用线条工具在它下面画一条灰色的线条，以增加它的层次感。
% B7 t/ L! D, Z$ I4 j. ~3 r$ T+ k1 s) h
$ I9 }" B: d" t# s$ e4 u


# Y- Q# \6 y  A1 Y4 ~7 s! \6 G+ i- n- _: X
到此，窗和窗帘已经全部完工了，下面就是要给窗后面加点东东，使它看起来更好看点。在最下面新建一个“背景图”的图层，在这个图层中导入一张事先准备好的图片做背景，（导入图片后用变形工具调整下大小）。0 I, M) v6 O% i

  J; L, Z! _- E) |6 O! |( B, l/ P& `( Y3 F* l! w


5 p( ?" h7 ^7 Q# D
  C' Y8 }9 b% G, I8 q7 i# B# q" R本来到这里就已经差不多了，不过因为我比较无聊，所以决定再加点小动画进去。# A5 C0 c% T# P/ a: M8 l
新建一个名为“1”的影片剪辑，选择文件——导入——导入到舞台，导入一张事先准备好的蝴蝶。导入蝴蝶后，在第5帧和第10帧插入关键帧，然后点下第5帧，把这一帧里，选择变形工具，然后按住Shift不放，把蝴蝶往中间缩小一半。最后分别在第一帧和第5帧右击，选择创建补间动画。
. o9 x- g- C: b+ x2 N/ E% S7 Q6 r+ `' E9 s1 Q
$ ^1 A+ H, Q5 z+ @  {, [. f; u

! [& G/ ]+ O. z6 K! D7 ?- D! {
% R4 _. W+ F4 S7 j
这样，蝴蝶就会飞了，不过就原地飞，下面就来让它按我们的要求飞吧。
2 C* u& q9 `2 R$ s- \2 {2 A, t; o/ ?- c; r) F9 {
再新建一个名为“蝴蝶”的影片剪辑，打开库，把刚做好的元件“1”拖到舞台中来，再为图层1添加运动引导层，在引导层的第1帧里随意画出一条线来（这条线就是你要让蝴蝶飞的路径，所以你要它怎么飞就怎么画。）
2 k' x# C5 D! j* X
. `1 D4 x! `! x' A) t( E: b5 [8 l+ Q+ ]/ ~0 _! E. u; t

3 J' K, D% N. R1 D7 f, Z

, _6 N- v0 l" P5 U4 |画好引导线后，在引导层第300帧插入帧，再在图层1第300帧插入关键帧，点击图层1第1帧，在这一帧把蝴蝶放在引导层的一端，也就是要开始飞的一端，再点下第300帧，把它放在另一头。
/ \$ R6 h4 }  N/ S, k5 q, Q
1 ~2 t. r* p6 E: I
9 o. m2 a7 G/ z, |* m8 r0 s$ \

3 w9 u" p; D: C: S7 m  u4 ^$ g. K; Q8 }: y
点击第1帧右击创建补间动画，再在补间动画的属性中把调整到路径勾上，这样一只沿着指定路径飞舞的蝴蝶就做好了。最后，在图层1第340帧插入帧。  c( k! x; m, }& M" n

: F. N2 T/ U9 I' ^, N
$ R" Z3 u6 c1 x  I+ B
$ Z! E1 U1 V3 W: E) T9 ^3 D
1 B7 o3 A: v, z3 n% g# _  P! W
以同样的方法再做一只不同路径飞舞的蝴蝶。; p: B$ o! n2 |) z9 J+ n

* ^0 L4 _$ c, U6 [; K新建一个名为“蝴蝶飞飞”的影片剪辑，在这里要把刚做好的两个蝴蝶飞舞的元件放进来，而且要让它们在不同时间段开始飞出来。在图层1第10帧插入关键帧，打开库，把蝴蝶元件拖到场景中来，在第120帧插入帧。再新建一个图层2，在第50帧插入关键帧，同样再拖入一个蝴蝶元件进来，这次可以拖一个不同路径的进来。同样在第120帧插入帧。再新建一个图层3，在第120帧插入关键帧，再插入一个蝴蝶元件进来，这次随便你要哪个，不过拖进场景后可以把它改变下方向。最后点击120帧（哪个图层都行），然后按F9打开动作面板，输入stop();(三只蝴蝶的位置要适当调整下)注：如果觉得蝴蝶的颜色不喜欢，和场景里的图片不适合的话，可以点击下想改变颜色的蝴蝶，打开属性面板，选择颜色—色调，然后调整好自己要的颜色，再改变下透明度就行了。+ M- Q1 F& o8 Z% _0 _
) R' ]" P# a# N2 h5 P" M% Y9 i
- S; O* M/ h, ]* t# q, O' s0 c

. t4 V" i( V! r. c5 M. C  ?, c

* h  ]4 A' Q& C+ `返回场，在背景图层上面新建一个图层为“蝴蝶”，然后把刚做好的蝴蝶飞飞元件拖到场景中。可以用做蝴蝶的方法再做一个枫叶飘落的小动画，再放置到场景中，因为方法一样，在这就不多说了。
. T" T1 r/ ?" L
2 R3 j7 ~, y6 y& E4 d
3 J5 j  }2 G, A9 j) a' f  O2 J5 b
" ?- V0 d# z& [4 m$ }

6 o$ r4 o8 c! E% j到此，全部动画都做完了，不过，好看的动画怎么能没有好听的音乐做伴呢，在场景中再新建一个图层为音乐，然后选择文件—导入—导入到库，导入一首事先准备好的音乐，点击音乐图层，然后在属性面板中选择刚导入的音乐。5 G) t0 `- S: t" U5 f
, ]" y+ a- i1 U4 O% N3 o4 y! x

/ v; f, G! X# L$ j( E; i* \( w

, e- G! }* C4 t. k* t
* h3 @" B3 ~- e5 m2 I" |好了，测试下吧~^0^
  f5 U, N$ _3 n) q& o
& u- v0 a& Y* D/ a因为加了音乐的源文件太大,发不上来,所以把音乐去掉了,发个没有音乐的源文件上来,音乐文件也比较大,所以就不发上来了。素材图片也顺便打包上来...
8 ?0 s& g9 h; c8 y7 I& k, p, V% L
; S3 m! Y2 J( m, r+ C5 f, \4 _