要求
知識儲備 軟件需求 範例
flash的基礎知識 Flash Professional CS5 (下載測試版) motion.jsfl
用戶等級
初級
多樣的JavaScript APIs已經加入進Flash Professional CS5了，可以讓你應用到以下的工作範疇：
* 創建和移除時間軸動畫對象
* 獲取和設置時間軸動畫XML
* 使用那些之前版本並不支持的針對時間軸動畫對象的JSFL命令和屬性。
正因爲有了這些改變，創建操作動畫對象、動畫數據或是不同文檔間的動畫重用等的命令或工具變得更容易。針對新的動畫對象的新增API列表如下，這些對象是Frame對象的一部分（有一些是Timeline對象的一部分）：
* convertMotionObjectTo2D() 更多
* convertMotionObjectTo3D() 更多
* createMotionObject() 更多
* getMotionObjectXML() 更多
* hasMotionPath() 更多
* is3DMotionObject() 更多
* isMotionObject() 更多
* removeMotionObject() 更多
* selectMotionPath(select) 更多
* setMotionObjectDuration(duration, stretch) 更多
* setMotionObjectXML(xml, endAtCurrentLocation) 更多
* tweenInstanceName() 更多
使用動畫對象的API
下面就是一個簡單的範例，創建了一個新的文檔，層，矩形和該層上的動畫對象。在新的JSFL文檔裏添加下面的代碼並運行腳本(你也可以在針對這篇文章的源文件裏得到這段代碼):
-
//Create a new document, FPS set to 24. fl.createDocument("timeline"); fl.getDocumentDOM().frameRate = 24; var doc = fl.getDocumentDOM(); var my_tl = doc.getTimeline(); //used for creating a rectangle: left, right, top, bottom. var l = 0; var r = 10; var t
= 0 var b = 10; //Function to draw the rectangle this.drawRect = function() { document.addNewRectangle({left:l, top:t, right:r, bottom:b}, 0); document.setSelectionRect({left:l, top:t, right:r, bottom:b}); //offset next square by following for multiple examples
l+=30; r+=30; }; //Get the current frame this.getCurrentFrame = function(){ var layer = my_tl.layers[my_tl.currentLayer]; var frame = layer.frames[my_tl.currentFrame]; return frame; } // Add layer my_tl.addNewLayer("Create a tween"); //Create and select the
rectangle drawRect(); //Get the frame for this layer var theFrame = getCurrentFrame(); //Create a motion object if(theFrame && !theFrame.isMotionObject()){ my_tl.createMotionObject(); }
複製代碼
如果是要了解如何設置動畫XML數據，可以在上面的代碼後添加這段代碼，然後再次運行腳本：
-
//Add another layer my_tl.addNewLayer("Set Motion XML"); //Create and select the rectangle drawRect(); //Get frame for this layer var theFrame = getCurrentFrame(); //Create a motion object from selection if(theFrame && !theFrame.isMotionObject()){ my_tl.createMotionObject();
} //Set motionXML to "bounce-smoosh" preset motion XML var motionXML = ('<AnimationCore TimeScale="24000" Version="1" duration="75000"><TimeMap strength="0" type="Quadratic"/> <TimeMap strength="4" type="BounceIn"/><metadata><names> <name langID="en_US" value="bounce-smoosh"/></names>
<Settings orientToPath="0" xformPtXOffsetPct="0.5" xformPtYOffsetPct="0.995652" xformPtZOffsetPixels="0"/> </metadata><PropertyContainer id="headContainer"><PropertyContainer id="Basic_Motion"><Property enabled="1" id="Motion_X" ignoreTimeMap="0" readonly="0"
visible="1"><Keyframe anchor="0,0" next="0,0" previous="0,0" roving="0" timevalue="0"/><Keyframe anchor="0,0" next="0,0" previous="0,0" roving="0" timevalue="74000"/> </Property><Property TimeMapIndex="1" enabled="1" id="Motion_Y" ignoreTimeMap="0" readonly="0"
visible="1"><Keyframe anchor="0,0" next="0,0" previous="0,0" roving="0" timevalue="0"/><Keyframe anchor="0,273" next="0,273" previous="0,273" roving="0" timevalue="74000"/></Property><Property enabled="1" id="Rotation_Z" ignoreTimeMap="0" readonly="0" visible="1"><Keyframe
anchor="0,0" next="0,0" previous="0,0" roving="0" timevalue="0"/></Property> </PropertyContainer><PropertyContainer id="Transformation"> <Property enabled="1" id="Skew_X" ignoreTimeMap="0" readonly="0" visible="1"><Keyframe anchor="0,0" next="0,0" previous="0,0"
roving="0" timevalue="0"/></Property><Property enabled="1" id="Skew_Y" ignoreTimeMap="0" readonly="0" visible="1"><Keyframe anchor="0,0" next="0,0" previous="0,0" roving="0" timevalue="0"/></Property> <Property enabled="1" id="Scale_X" ignoreTimeMap="0" readonly="0"
visible="1"><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="0"/><Keyframe anchor="0,100.21" next="0,100.21" previous="0,100.21" roving="0" timevalue="35000"/><Keyframe anchor="0,191.254" next="2000,191.254" previous="-2000,191.254"
roving="0" timevalue="37000"/><Keyframe anchor="0,100.21" next="0,100.21" previous="0,100.21" roving="0" timevalue="39000"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="54000"/><Keyframe anchor="0,171.056" next="2000,171.056"
previous="-2000,171.056" roving="0" timevalue="56000"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="58000"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="66000"/><Keyframe anchor="0,150" next="1000,149.97"
previous="-1000,149.735" roving="0" timevalue="67000"/> <Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="68000"/></Property><Property enabled="1" id="Scale_Y" ignoreTimeMap="0" readonly="0" visible="1"><Keyframe anchor="0,100" next="0,100"
previous="0,100" roving="0" timevalue="0"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="35000"/> <Keyframe anchor="0,60" next="2000,60" previous="-2000,60" roving="0" timevalue="37000"/><Keyframe anchor="0,100" next="0,100"
previous="0,100" roving="0" timevalue="39000"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="54000"/><Keyframe anchor="0,75.2218" next="2000,75.2727" previous="-2000,75.1418" roving="0" timevalue="56000"/> <Keyframe anchor="0,100"
next="0,100" previous="0,100" roving="0" timevalue="58000"/><Keyframe anchor="0,100" next="0,100" previous="0,100" roving="0" timevalue="66000"/><Keyframe anchor="0,80" next="1000,80" previous="-1000,80" roving="0" timevalue="67000"/><Keyframe anchor="0,100"
next="0,100" previous="0,100" roving="0" timevalue="68000"/></Property> </PropertyContainer><PropertyContainer id="Colors"/><PropertyContainer id="Filters"/></PropertyContainer></AnimationCore>'); //set motion XML, set applyTweenToCurrentPosition to false
if(theFrame.isMotionObject()){ theFrame.setMotionObjectXML(motionXML.toString(), false); };
複製代碼
你可能已經發現第三方開發者已經開始利用這些API，來製作面板和其他工具，來使得創建動畫更爲容易併成爲你工作中的有力臂助。
從這裏起步
閱讀其他有關flash裏的動畫學習手冊部分。 |
