MadButterfly Programming Model
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

MadButterfly Programming Model

on

  • 1,881 views

介紹 MadButterfly 的 programming Model

介紹 MadButterfly 的 programming Model

Statistics

Views

Total Views
1,881
Views on SlideShare
1,856
Embed Views
25

Actions

Likes
2
Downloads
34
Comments
0

1 Embed 25

http://infuture.pixnet.net 25

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-NonCommercial LicenseCC Attribution-NonCommercial License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

MadButterfly Programming Model Presentation Transcript

  • 1. MadButterfly 的架構 Thinker <thinker@branda.to> 1 of 27
  • 2. What is? 一種開發模式 一種 GUI framework 一套開發工具 2 of 27
  • 3. Embedded 主要目標是提供 Embedded System 一套 GUI 工具 但,我不能阻止我們 WEB Desktop 因為 Weblize 是趨勢 3 of 27
  • 4. WEB 化 MadButterfly 是 WEB 化的靈感 但 WEB browser 是大象,是鯨魚 4 of 27
  • 5. 5 of 27
  • 6. SVG 弱水三千,只取一瓢。 Scalable Vector Graphics W3C standard XML Scalable 6 of 27
  • 7. 繪圖 為何選 SVG 所有 GUI 都是一種圖形的呈現 7 of 27
  • 8. Programming Model 8 of 27
  • 9. 外觀 把 GUI 的外貌畫出來 9 of 27
  • 10. 行為 透過 MadSwatter 定義 UI 的行為 行為 --> 動畫 儲存在 SVG 檔案裡的 metadata 10 of 27
  • 11. Drop down list 11 of 27
  • 12. Button 12 of 27
  • 13. svg2code 將「外觀」和「行為」轉換成程式碼 13 of 27
  • 14. Host App link svg2code.py 產生的 code MadButterfly library 14 of 27
  • 15. MadBuilder 以 Firefox 為執行環境 以 Javascript 為主 整合 Inkscape MadSwatter editor build system 15 of 27
  • 16. Inkscape 16 of 27
  • 17. MadSwatter 動畫編輯工具 完全以 Javascript + SVG + HTML 完成的軟體 17 of 27
  • 18. MadButterfly base on C cairo 提供和 SVG 對映的 object tree 類似 DOM 容易操作/控制 18 of 27
  • 19. 主要架構 19 of 27
  • 20. redraw manager Determine Where to redraw Who to redraw When to redraw 20 of 27
  • 21. 21 of 27
  • 22. coord_t It knows as group in SVG collect a set of shape objects and sub-groups. 22 of 27
  • 23. Observer Pattern subject observer 23 of 27
  • 24. 24 of 27
  • 25. Tiny MadButterfly is an tiny/concious engine to manage graphics, draw graphics, and redraw graphics It is target to small and embedded device. with fixed screen size. 25 of 27
  • 26. 急 Javascript programmers UI designer C programmers Documentation 26 of 27
  • 27. 最後 http://www.assembla.com/spaces/MadButterfly http://www.assembla.com/spaces/MadSwatter 27 of 27