Animate CC 動畫制作實例教程 課件匯 項目1-5 初識animate cc 2017 -文本工具的使用

1Animatecc2017二維動畫案例教程項目一初識Animatecc20171啟動軟件、界面組成、文檔設(shè)置方法2新建、編輯、保存文檔方法3標尺、網(wǎng)格的使用目錄CONTENTS啟動軟件、界面組成、文檔設(shè)置方法31、雙擊桌面圖標啟動Animatecc2017，開始頁打開最近的項目：可以打開最近曾經(jīng)編輯過的文件。新建：可以創(chuàng)建包括HTML5Canvas文件，WebGL,ActionScrip3.0等各種文件。模板：可以應(yīng)用Animatecc2017自帶的模板方便地創(chuàng)建特定的項目。簡介和學(xué)習(xí)：通過該欄目列表可以打開相應(yīng)的學(xué)習(xí)界面進行學(xué)習(xí)。啟動軟件、界面組成、文檔設(shè)置方法42、Animatecc2017界面啟動軟件、界面組成、文檔設(shè)置方法52、Animatecc2017界面時間軸是一個顯示圖層和幀的面板，其用于控制和組織文檔內(nèi)容在一定時間內(nèi)播放的幀數(shù)，同時可以控制影片的播放和停止啟動軟件、界面組成、文檔設(shè)置方法62、Animatecc2017界面舞臺是放置動畫內(nèi)容的矩形區(qū)域，默認是白色背景，在舞臺上可以放置矢量圖形、文本、按鈕、導(dǎo)入的位圖或視頻等啟動軟件、界面組成、文檔設(shè)置方法73、文檔設(shè)置對話框選擇【修改】|【文檔】命令，打開【文檔設(shè)置對話框】，根據(jù)需要設(shè)置舞臺的尺寸大小、顏色、幀頻等信息啟動軟件、界面組成、文檔設(shè)置方法84、網(wǎng)格的顯示與編輯網(wǎng)格是一個輔助對象，可以在舞臺上顯示網(wǎng)格，幫助制作者精確地繪畫和安排對象。執(zhí)行【視圖】|【網(wǎng)格】|【顯示網(wǎng)格】命令，然后即可顯示默認設(shè)置的網(wǎng)格啟動軟件、界面組成、文檔設(shè)置方法94、網(wǎng)格的顯示與編輯顏色：設(shè)置網(wǎng)格的顏色。顯示網(wǎng)格：設(shè)置網(wǎng)格線為顯示狀態(tài)。在對象上方顯示：設(shè)置網(wǎng)格線顯示所有對象上方，否則網(wǎng)格線將顯示所有對象下方。貼緊至網(wǎng)格：可強制對象貼緊距離最近的網(wǎng)格線。水平間距：定義網(wǎng)格線之間的水平距離，默認單位為像素。垂直間距：定義網(wǎng)格線之間的垂直距離，默認單位為像素。貼緊精確度：一般，為默認值，即以一般狀態(tài)接近網(wǎng)格線。

必須接近,強制移動對象時必須接近網(wǎng)格線。

可以遠離，允許用戶在移動對象時遠離網(wǎng)格線。

總是貼緊，強制移動對象時必須貼緊網(wǎng)格線。啟動軟件、界面組成、文檔設(shè)置方法105、標尺與輔助線Animatecc2017提供標尺工具，幫助用戶精確地定位對象的位置。執(zhí)行【視圖】|【標尺】命令，即可顯示或隱藏標尺工具貼緊至網(wǎng)格：可強制對象貼緊距離最近的網(wǎng)格線。顯示或隱藏輔助線：選擇【視圖】|【輔助線】|【顯示輔助線】命令。移動輔助線：將鼠標指針移動到輔助線上，按住左鍵拖動即可。刪除輔助線：將鼠標指針移動到輔助線上，按住左鍵拖出編輯區(qū)即可。清除輔助線：選擇【視圖】|【輔助線】|【清除輔助線】命令，該命令會清除文檔中所有輔助線。文件的操作11文件的新建、編輯與保存案例1制作太陽升起來當(dāng)創(chuàng)建好文檔后，按ctrl+enter組合鍵直接生成.swf文件或執(zhí)行“文件”|”導(dǎo)出”|”導(dǎo)出影片”命令也可以導(dǎo)出.swf、.avi、.mov等常見視頻格式。當(dāng)執(zhí)行“文件”|“發(fā)布設(shè)置”命令，打開“發(fā)布設(shè)置”，打開“發(fā)布設(shè)置”對話框，發(fā)布命令一次可發(fā)布成多種格式的文檔，發(fā)布后的文檔都保存在源文件所在目錄下。課堂小創(chuàng)意12創(chuàng)作繁星閃爍的夜空13課堂小結(jié)1、啟動Animatecc方法，界面組成、文檔屬性設(shè)置2、文件的新建、編輯、保存操作3、標尺、網(wǎng)格線的使用14Animatecc2017二維動畫案例教程項目四圖形的變換（二）1變形2合并繪制和對象繪制目錄CONTENTS3對象的基本操作1、變形16【變形】面板：通過設(shè)置【變形】面板中的各項參數(shù)可以精確地進行縮放、旋轉(zhuǎn)、傾斜和翻轉(zhuǎn)等操作?？s放對象：打開【變形】面板，快捷鍵Ctrl+T，設(shè)置【縮放高度】和【縮放寬度】參數(shù)，默認為按等比例縮放對象，單擊【約束】按鈕，則不按比例縮放對象。旋轉(zhuǎn)對象：旋轉(zhuǎn)對象會使對象圍繞其變形中心點旋轉(zhuǎn)，可以拖動變形中心點位置。傾斜和翻轉(zhuǎn)對象：傾斜對象可以通過沿一個或兩個軸傾斜對象來使之變形，也可以沿垂直或水平軸翻轉(zhuǎn)對象，而不改變其在舞臺上的相對位置。重置選區(qū)和變形：可實現(xiàn)復(fù)制對象操作。2、合并繪制和對象繪制17兩種繪圖模式：Animate中繪制圖形，主要有兩種方式：合并繪制圖形和對象繪制圖形（1）合并繪制圖形：在這種模式上繪制的圖形，筆觸和填充作為獨立的部分存在，可以單獨選擇筆觸和填充進行變形修改。在Animate中的同一圖層上，重疊進行繪制圖形時，所繪制的圖形對象將會自動合并如圖4-1合并繪制。圖4-1合并繪制2、合并繪制和對象繪制18（2）對象繪制模式：在對象繪制模式下，可以將多個圖形繪制成獨立的對象，這些對象在疊加時不會自動合并，而且可以對每個圖形對象單獨地進行處理如圖4-2對象繪制。使用這種繪圖方式，需要在啟用繪圖工具之后，在工具箱的選區(qū)中單擊【對象繪制】按鈕，對于繪制的圖形來講，Animate會在該圖形周圍添加矩形邊框。提醒：當(dāng)使用鉛筆、鋼筆、線條、畫筆、橢圓、矩形和多角星形工具，才能啟用【對象繪制】功能。當(dāng)【對象繪制】功能被激活時，按J鍵可以在【合并繪制】與【對象繪制】功能之間切換。圖4-2對象繪制3、對象的基本操作--合并--聯(lián)合19（1）聯(lián)合：聯(lián)合是將選擇的對象合并為一個對象，在對象繪制模式下，繪制重疊放置的圓形和五角星，選擇這2個圖形，選擇【修改】|【合并對象】|【聯(lián)合】命令，則選擇的圖形變?yōu)橐粋€圖形對象如圖4-3聯(lián)合。圖4-3聯(lián)合3、對象的基本操作--合并--聯(lián)合20【聯(lián)合】命令也可以實現(xiàn)將合并繪制的圖形轉(zhuǎn)化為對象繪制方式下的圖形對象。方法是選擇合并繪制創(chuàng)建的形如下面的圓形，執(zhí)行【聯(lián)合】命令即可，轉(zhuǎn)換后的形狀被視為基于矢量的繪制對象如圖4-4轉(zhuǎn)換圖形對象。圖4-4轉(zhuǎn)換圖形對象3、對象的基本操作--合并--交集21（2）交集：當(dāng)兩圖形有重疊時，交集是把兩個圖形的重疊部分留下，而其余的部分被裁剪掉，此時留下的是位于上層圖形。如選擇疊放在舞臺上五角星和圓形，選擇【修改】|【合并對象】|【交集】命令，此時重疊部分五角星保留下來，五角星之外的其他部分被裁剪掉如圖4-5交集。圖4-5交集3、對象的基本操作--合并--打孔22（3）打孔：當(dāng)兩圖形有重疊時，打孔是使用位于上層的圖形去裁剪下層的圖形，此時留下的是下層的圖形。選擇疊放在舞臺上的五角星和圓形，選擇【修改】|【合并對象】|【打孔】命令，此時上層的五角星消失，下層圓被保留，且圓與五角星重疊部分被裁剪掉如圖4-6打孔。圖4-6打孔3、對象的基本操作--合并--裁剪23（4）裁剪：裁剪與交集正好相反，當(dāng)兩圖形有重疊時，裁剪是使用上層圖形去裁剪下層圖形，多余圖形被裁剪掉，而留下的是下層圖形，選擇疊放在舞臺上的五角星和圓形，選擇【修改】|【合并對象】|【裁剪】命令，此時圓形與五角星重疊部分被保留，得到一個與圓形相同顏色的五角星如圖4-7裁剪。圖4-7裁剪3、對象的基本操作--組合24（1）組合對象：將多個元素組合為一個對象后，可以像操作一個對象一樣操作這個組。要進行圖形的組合，首先選擇需要組合的對象，這些對象可以是圖形、文本或其他的對象，選擇【修改】|【組合】命令或按Ctrl+G鍵即可將選擇對象組合為一個對象如圖4-8對象的組合。圖4-8對象的組合3、對象的基本操作--組合25（2）取消組合：選擇組合后的對象，選擇【修改】|【取消組合】命令或按Ctrl+Shift+G命令，即可取消對象的組合，將這些對象變?yōu)榻M合前的狀態(tài)。（3）編輯組中的對象：選擇要編輯的組，執(zhí)行【編輯】|【編輯所選項目】命令，或者利用【選擇】工具，雙擊該組進入該對象的編輯狀態(tài)即可單獨編輯組中的對象。提醒：在此操作過程中，頁面上不屬于該組的部分將變暗，表明不屬于該組的元素目前是不可訪問的。3、對象的基本操作--分離26在Animate中可以使用【分離】命令將組、圖形、文本、實例和導(dǎo)入的位圖分離成單獨的元件，通過對元件的修改來對這些對象進行各種編輯操作。同時，對于導(dǎo)入的圖形分離能夠減小它們的大小。選擇需要分離的組、位圖或元件，執(zhí)行【修改】|【分離】命令，快捷鍵Ctrl+B。如下圖將組分離成形狀，需要按兩次Ctrl+B命令如圖4-9對象的分離。圖4-9對象的分離3、對象的基本操作--分離27提醒：分離對象會對對象產(chǎn)生以下影響：切斷元件實例到庫中元件的鏈接；將位圖轉(zhuǎn)換成填充；當(dāng)分離文本時一次分離會將文本分離成含有單個文字的文本，再分離時將單個文字分離成形狀。分離與取消組合的區(qū)別，分離命令不僅會分離組對象，當(dāng)按下多次分離命令后，會將圖像、實例及文本分離成形狀。取消組合只能夠分開所組合后的各種對象。課堂小練習(xí)2898k29課堂小結(jié)變形合并繪制和對象繪制對象的基本操作30Animatecc2017二維動畫案例教程項目四

圖形的變換（一）

1選擇工具2部分選擇工具目錄CONTENTS3任意變形工具4對齊工具5排列工具目錄CONTENTS6貼緊項目四

圖形的變換（一）

33Animatecc2017利用編輯工具，可以對創(chuàng)作的圖形進行變形、縮放、旋轉(zhuǎn)、對齊等操作，編輯工具包括【選擇工具】、【部分選取工具】、【任意變形工具】、【對齊】命令、【排列】命令等，通過本項目的學(xué)習(xí)達到以下目標：熟悉選擇對象的工具熟練掌握移動、復(fù)制、排列對齊等操作；掌握修改、變形對象的操作方法熟悉貼緊對象的操作方法1、選擇工具34【選擇工具】除了用來選擇對象，還可以拖動對象進行移動操作，還可以調(diào)整線段的形狀如圖4-1調(diào)整線段的形狀。選擇【選擇工具】后，在【工具箱】面板底部有【貼緊至對象】、【平滑】、【伸直】三個選項。【貼緊至對象】：選擇該按鈕，在進行繪圖、移動、旋轉(zhuǎn)和調(diào)整操作時將和對象自動對齊。【平滑】：可以對直線和端點進行平滑處理?！旧熘薄浚嚎梢詫χ本€和端點進行伸直處理。提示：按住Shift鍵，依次單擊所選對象，可以選中多個對象。在形狀上利用選擇工具雙擊可以同時選中輪廓和內(nèi)部填充。如圖4-1調(diào)整線段的形狀2、部分選擇工具35【部分選擇工具】：使用該工具后，在對象的輪廓線上將出現(xiàn)多個控制點或稱為錨點，通過修改一個或多個控制點來修改整個對象的形狀如圖4-2利用錨點調(diào)整形狀。移動控制點：利用【部分選擇工具】選中一個控制點，光標出現(xiàn)一個空白方塊，拖動控制點，可以改變圖形輪廓。圖4-2利用錨點調(diào)整形狀2、部分選擇工具36改變控制點曲度：選擇某個控制點后，按住Alt鍵，將出現(xiàn)此點調(diào)節(jié)曲度的控制柄，拖動控制柄實現(xiàn)對該控制點的曲度調(diào)節(jié)如圖4-3調(diào)節(jié)曲度。圖4-3調(diào)節(jié)曲度2、部分選擇工具37移動對象：使用【部分選擇工具】，當(dāng)光標顯示黑色實心方塊時，按下鼠標左鍵拖動即可將實現(xiàn)移動對象操作如圖4-4移動對象。圖4-4移動對象3、任意變形工具38【任意變形工具】：將對象進行任意變形，實現(xiàn)移動、旋轉(zhuǎn)、縮放、傾斜和扭曲等多個變形操作。也可以使用【變形】面板或執(zhí)行【修改】|【變形】命令實現(xiàn)相關(guān)操作。選中【任意變形工具】面板中會顯示【貼緊至對象】、【旋轉(zhuǎn)和傾斜】、【縮放】、【扭曲】和【封套】，選中對象，在對象四周顯示8個控制點，中心位置顯示1個中心點如圖4-5任意變形控點。旋轉(zhuǎn)圖形：以中心位置為軸心旋轉(zhuǎn)對象傾斜圖形：可以沿水平和垂直方向傾斜對象縮放圖形：可以在水平和垂直方向縮放，或在垂直和水平方向上同時縮放。扭曲圖形：可以拖動邊框上的控制點來扭曲對象，當(dāng)按住Shift鍵當(dāng)光標變?yōu)閷D形進行錐化處理。封套圖形：可以對圖形對象進行任意形狀的修改?！拘D(zhuǎn)與傾斜】和【縮放】按鈕可應(yīng)用于舞臺中的所有對象，【扭曲】和【封套】只適用于形狀對象或者分離后的圖像。3、任意變形工具39繞中心點旋轉(zhuǎn)圖形中心點位置拖動四角上控制點可實現(xiàn)等比例縮放拖動控制點可實現(xiàn)寬或高方向縮放實現(xiàn)傾斜變形拖動錨點改變封套形狀拖動控制點可扭曲圖形圖4-5任意變形控點4、對齊40【對齊】面板如圖4-6對齊面板對齊：包括【左對齊】、【水平中齊】、【右對齊】、【上對齊】、【垂直中齊】和【底對齊】，主要用來將對象水平、垂直、向上、向下、向左、向右進行對齊。圖4-6對齊面板4、對齊41分布：包括【頂部分布】、【垂直居中分布】、【底部分布】、【左側(cè)分布】、【水平居中分布】和【右側(cè)分布】可以將所選對象按照中心間距或邊緣間距相等的方式分布。間隔：【垂直平均間隔】和【水平平均間隔】用于調(diào)整對象間的距離。匹配大?。骸酒ヅ鋵挾取俊ⅰ酒ヅ涓叨取亢汀酒ヅ鋵捄透摺靠梢哉{(diào)整所選對象的大小，使所有對象水平或垂直尺寸與所選最大對象的尺寸一致。相對于舞臺：使所選對象與舞臺對齊。5、排列42排列對象：在同一圖層中，繪制的圖形會根據(jù)創(chuàng)建的順序?qū)盈B對象，可以使用【修改】|【排列】命令對多個圖形對象進行上下排列，使用【修改】|【對齊】命令對圖形進行橫向排列如圖5-15排列對象。排列對象：選中對象后選擇【修改】|【排列】下的【上移一層】、【下移一層】、【移至底層】、【移至頂層】命令。將圓形移至頂層，選擇圓形選擇【修改】|【排列】|【移至頂層】命令。提醒：在使用【排列】命令時，操作對象是繪制對象或元件，對形狀對象不適用。圖4-7排列對象6、貼緊43貼緊圖形：要使圖形對象彼此自動對齊，可以使用貼緊功能。貼緊對象提供了5種方式，【貼緊至對象】、【貼緊至像素】、【貼緊至網(wǎng)格】、【貼緊至輔助線】和【貼緊對齊】。貼緊至對象：可以使對象沿著其他對象的邊緣，直接與它們對齊的對象貼緊。選擇該命令后，當(dāng)拖動圖形對象時，指針下會出現(xiàn)黑色小環(huán)，當(dāng)對象處于另一對象的貼緊距離內(nèi)時，該小環(huán)會變大，放開鼠標即可和另一個對象邊緣貼緊，如圖4-8貼緊至對象。圖4-8貼緊至對象6、貼緊44貼緊至像素：可以在舞臺上將圖形對象直接與單獨的像素或像素線條貼緊。顯示網(wǎng)格，設(shè)置網(wǎng)格尺寸1X1像素，在舞臺上隨意繪制矩形圖形時，矩形的邊緣緊貼至網(wǎng)格線如圖4-9圖4-9貼緊至像素6、貼緊45貼緊至像素：可以在舞臺上將圖形對象直接與單獨的像素或像素線條貼緊。顯示網(wǎng)格，設(shè)置網(wǎng)格尺寸1X1像素，在舞臺上隨意繪制矩形圖形時，矩形的邊緣緊貼至網(wǎng)格線如圖4-9圖4-9貼緊至像素6、貼緊46貼緊至網(wǎng)格：使圖形對象邊緣和網(wǎng)格邊緣貼緊。貼緊至輔助線：可以使圖形對象中心和輔助線貼緊。當(dāng)拖動圖形對象時，指針下出現(xiàn)黑色小環(huán)，當(dāng)圖形中的小環(huán)接近輔助線時，小環(huán)會變大，放開鼠標即可和輔助線貼緊。貼緊對齊：可以按照指定的貼緊對齊容差對齊，即按照對象和其他對象之間或?qū)ο笈c舞臺邊緣的預(yù)設(shè)邊界對齊對象。課堂小練習(xí)47螃蟹

48課堂小結(jié)【選擇工具】、【部分選取工具】、【任意變形工具】、【對齊】、【排列】、【貼緊】49Animatecc2017二維動畫案例教程項目五

文本工具的使用1文本類型2靜態(tài)文本目錄CONTENTS3文本屬性51使用【文本工具】可以創(chuàng)建多種類型的文本，在Animatecc2017中，文本類型分為靜態(tài)文本、動態(tài)文本和輸入文本3種。（1）靜態(tài)文本：顯示不會動態(tài)更改字符的文本，它在影片制作過程中常用來作為說明性的文字。靜態(tài)文本包括可擴展文本塊和固定文本塊。固定文本塊是指當(dāng)輸入的文字達到文本框的寬度后，將自動進行換行?？蓴U展文本塊是指文本框的寬度無限，會隨著文字的輸入來擴展文本框的寬度。（2）動態(tài)文本：顯示動態(tài)更新的文本，可以隨著影片的播放自動更新數(shù)據(jù)。（3）輸入文本：指用戶輸入的任何文本或可以編輯的動態(tài)文本。該文本對象在影片播放過程中用于在用戶和動畫之間產(chǎn)生互動，例如在表單中輸入用戶姓名等信息。1、文本類型52一些動畫中經(jīng)?？吹嚼梦淖种谱鞯奶匦赢嫞珹nimatecc2017利用文本工具可以創(chuàng)建3種類型的文本對象。2、靜態(tài)文本53選擇【文本工具】當(dāng)光標變?yōu)橛蚁陆菐形狀時，在舞臺中單擊即可創(chuàng)建一個可擴展的靜態(tài)水平文本框，其輸入?yún)^(qū)域可隨需要自動橫向延長，文本框右上角標志為空心圓形。如果選擇【文本工具】在舞臺中拖動，則可以創(chuàng)建一個具有固定寬度的靜態(tài)水平文本框，文本框右上角具有方形手柄標識，其輸入?yún)^(qū)域?qū)挾仁枪潭ǖ?，?dāng)輸入文本超出寬度時將自動換行。3、文本屬性54用戶可以通過【文本工具】的屬性面板對文本的字體和段落屬性進行設(shè)置。（1）設(shè)置字符屬性：在【屬性】面板的【字符】選項組中，