友情提示:每做完一個操作后遵岩,都記得Ctrl+S隨手保存哦~
項目開始前侨赡,放上最終效果圖給大家看一下
1.創(chuàng)建animation
我們先來做一個頭像閃爍的動畫
依次選中HeadFrame→Timeline→Add the Animation component
這時會發(fā)現(xiàn)右側(cè)多一個Animation出來于个。我們再點擊Create a new Clip file.
在彈出的窗口選擇咱們之前創(chuàng)建的Animation文件夾泉褐,點擊‘打開’降允。
然后取個名字禁荸,完事點保存嘹锁。咱們是HeadFrame的動畫葫录,所以我取得名字叫做HeadFrameAnimation.
2.制作一個改變透明度變化的動畫
這時候咱們就可以開始編輯咱們的動畫了。
點擊Timeline下的鉛筆圖標(biāo)领猾,就可以進入編輯模式米同。
點擊加號,然后選擇opacity摔竿。這樣我們可以通過透明度的變化面粮,來達到閃爍的效果。
可以看到出現(xiàn)了一個opacity继低。鼠標(biāo)移動到opacity那一欄的時候熬苍,會出現(xiàn)3個小橫線,然后點擊這個3橫線,選擇Insert keyframe柴底,就可以K下第一幀婿脸。
可以看到,出現(xiàn)了一個藍色的小方塊柄驻。這就是咱們的第一幀狐树,代表在0:00這個時刻,透明度是255凿歼,也就是完全不透明褪迟。
現(xiàn)在呢,咱們把鼠標(biāo)移動到那條紅線答憔,然后點住不放味赃,拖到0.05的位置,然后把Opacity改為100
再把0:10時刻的透明度改為255
3.動畫的播放
這個WrapMode選為Loop虐拓,動畫就可以一直循環(huán)播放了心俗。
點擊下面這個小三角,就可以預(yù)覽播放了蓉驹。
但是現(xiàn)在我們在瀏覽器預(yù)覽城榛,還是不會閃爍,這是咋回事呢态兴?
莫慌狠持,把咱們創(chuàng)建的那個HeadFrameAnimation拖到右邊的DefaultClip那里松手,再把PlayOnLoad那里勾選瞻润,就OK啦喘垂!
現(xiàn)在我們再在瀏覽器預(yù)覽一下,就可以看到我們親手做的第一個動畫啦绍撞!
4.退出動畫編輯模式
動畫編輯好之后正勒,要Ctrl+S或者點擊Save保存一下,然后點擊那個鉛筆傻铣,才能退出編輯模式哦章贞,要不然你是沒法編輯其它組件了~
5.再添加一些其它動畫
除了制作改變Opacity的動畫,我們還可以制作顏色非洲、位置鸭限、以及角度等動畫。
比如我們現(xiàn)在給Label2做一個顏色和大小同時變化的動畫:
首先我們要添加會變化的屬性:color以及scale
然后鼠標(biāo)移動到color和scale欄两踏,分別K第一幀
紅線拉到0:05時刻败京,K第二幀
紅線拉到0:10時刻,K第三幀
注意注意:最后一幀的內(nèi)容缆瓣,一定要和第一幀相同喧枷。為啥呢虹统,因為咱們這個是loop弓坞,循環(huán)播放的隧甚。咱們放了最后一幀就要放第一幀了,所以為了不讓咱們動畫露餡渡冻,就得讓最后一幀和第一幀相同戚扳。
6.最終的預(yù)覽
把Label2Animation拖到DefaultClip,勾選PlayOnLoad族吻,就可以預(yù)覽了咱們的炫酷的動畫了帽借!
大家可以嘗試用剛剛學(xué)的知識,做一些自己喜歡的動畫超歌。
如果你做好了自己的名片砍艾,歡迎加入游戲開發(fā)群:247260198, 我們可以幫你把作品放到服務(wù)器上巍举,然后給你一個鏈接脆荷,你就可以把作品分享給你的朋友看啦!
思考下:
1.彈幕效果如何實現(xiàn)懊悯?
2.在屏幕內(nèi)彈來彈去的效果如何實現(xiàn)蜓谋?
3.星星bling-bling一閃一閃的效果如何實現(xiàn)?
最后放上自己做的炭分、不接受反駁的桃焕、自以為酷帥炸天的圖? ~ ^_^~