1. 用JSFL玩Flash IDE 2012/05/22 EIA

2. EIA 洪毓翔
https://www.facebook.com/angelliya00

3. Agenda
- 簡介
- Demo、安裝、快速鍵
- 撰寫
- Tips
- 發佈
- 開發經驗

4. JSFL：
Flash JavaScript 應用程式程式設計介面
(JavaScript API)

5. Demo 幾個我喜歡用的JSFL

6. SwapAll

7. NamingInstances

8. SnapToPixel

9. 執行命令、快速鍵

10. 安裝-1

11. 安裝-2
- 英文版Flash 安裝在非英文語系的系統中，安裝後沒有出現
- 不同版本Flash 安裝同一個XMP
Enable
(Flash IDE) Help > Manage Extensions

12. 撰寫
JSFL

13. JSFL 架構 DOM 結構摘要

14. Ex: 選擇影格
fl.getDocumentDOM().getTimeline().layers
[0].frames[0];
結構大約是這樣

15. flash 物件 (fl)
fl.closeAll()
fl.addEventListener()
fl.saveAll()
...

16. Document 物件
document.close()
document.publish()
document.save()
//
document.selectAll()
document.selectNone()
...

17. Layer 物件
layer.frameCount
layer.frames
layer.layerType 導引線、遮罩
...

18. Frame 物件
frame.actionScript
frame.duration
...
for(var f in layer.frames){
if (f==layer.frames[f].startFrame){
keyframes.push({
frame:layer.frames[f],
index:f
});
}
}

19. Tips

20. 1. 步驟記錄 / History

21. 2. Git kaede / jsfllib
https://github.com/kaede/jsfllib
JSFLではじめるFlash制作自動化入門 [単行本]

22. 3. 安裝的MXP
安裝路徑可由fl.configURI 取得

23. 第一個 Hello World
fl.trace("Hello World!!!");
fl.outputPanel.trace("Hello World!!!");
alert("Hello World!!!");

24. Flash IDE裡看得到的各種視窗

25. Alert()、confirm()、prompt()
alert("Hello World!!!");
confirm("Hello World ?");
prompt("Hello _____ ?","World");

26. document.xmlPanel()

27. fl.swfPanels

28. Pakage MXP Extension

29. Pakage MXP Extension
.xmi
<macromedia-extension
name=""
version="0.2.3"
requires-restart="true"
type="suite">
<author name="EIA" />
<products>
<product name="Flash" version="7" />
</products>
<description>
<![CDATA[]]>
</description>
<ui-access>
<![CDATA[]]>
</ui-access>
<files>
<file source="FrameRate_Transform.jsfl" destination="$flash/Commands" />
</files>
</macromedia-extension>

30. file
<files>
<file source="callSample.jsfl" destination="$flash/Javascript" />
<file source="05_01.swf" destination="$flash/WindowSWF" />
</files>
$flash (fl.configURI)
/Users/apple/Library/Application Support/Adobe/Flash
CS5.5/en_US/Configuration/

31. JSFL <-> SWFPanel
if(fl.swfPanels[x].name == panelName){
fl.swfPanels[x].call("callMySWF",arg);
break;
}
*: swfPanel
MMExecute("
fl.runScript(fl.configURI+'Javascript/code.jsfl');
");
*: fl.runScript();

32. 開發心得

33. 1. FrameRate_Transform
不小心做錯影格數，或是Resize需求時

34. ex: FPS 30<->18
Frame
Timeline

35. fl.getDocumentDOM().exitEditMode();
modifyTimelineFrameDuration();
var itemNum = fl.getDocumentDOM().library.items.length;
for(var i = 0;i<itemNum;i++){
var libraryItem = fl.getDocumentDOM().library.items[i];
if(libraryItem.itemType=="movie clip"){
fl.getDocumentDOM().library.selectItem(libraryItem.name);
fl.getDocumentDOM().library.editItem();
}
modifyTimelineFrameDuration();
}

36. 2. BitmapQuailtyManager
調整點陣圖K數用的

37. 有沒有一個面板可以方便調整圖片的品質?

38. 做出來了，但是...

39. 3. E_ColorPicker
檢色器

41. function jsflSetFillColor($color){
var rect = fl.getDocumentDOM().getSelectionRect();
if(rect != 0){
document.setSelectionRect(rect);
fl.getDocumentDOM().setFillColor($color);
}
}
function jsflStrokeColor($color){
fl.getDocumentDOM().setStrokeColor($color);
}

42. 心得

43. Links
擴充 Adobe Flash CS4 Professional
http://help.adobe.com/zh_TW/Flash/10.0_ExtendingFlash/
DOM 結構摘要
http://help.adobe.com/zh_TW/Flash/10.0_ExtendingFlash/WS359E0FA7-1DA9-4c9b-
8AE3-CFED6B6B11CE.html
Git- kaede / jsfllib
https://github.com/kaede/jsfllib

44. Thanks
photoshop 又是另一個故事了