天天看點

Win8 Metro動态加載内容架構

為了參加imaginecup 2013

世界公民類比賽,我們設計制作了一個可動态擴充的幼教類app。這個app需要能動态加載内容,内容包括帶動畫可互動的電子書,動畫,視訊,遊戲。

2012年10月第一次:因為svg性能問題,将svg換為cocos2d-x jsbind,可惜cocos2d-x

jsbind不完善,最後換為cocos2d-x html5。11月第二次:cocos2d-x

html5性能問題,破産。12月第三次:取消html5,轉為使用xaml+js模式。

(微軟的winrt明顯就是閹割的wpf,查過動态加載相關的類庫,隻允許加載安裝時已包含的dll。)

用xaml來做前台頁面,性能比html的高很多,而且制作十分友善,微軟擅長做ide嘛,blend配合adobe的ai出矢量界面、動畫十分迅速,我們的美工上手也快。

用js來做背景邏輯也是很友善的,為了程式流程友善管理後來用狀态機做了個程式制作工具。

由于xaml和js本質上都是文本,是以加密非常容易,win8metro做aes加密很容易,可以很好的保護代碼。(額...反編譯c#代碼擷取aes密鑰不在讨論範圍内...)

根據需要另內建了實體引擎。

相關技術傳送門+

+ uppbox - 基于websocket的跨界應用通信架構(待寫)

Win8 Metro動态加載内容架構

xaml與c#代碼通信

網上有個win8metro的架構,其中interactive部分就可以把wpf中的behavior、eventtrigger帶回來。

至于js與c#通信那就簡單了,webview本身就有事件支援。

服務端為asp.net mvc/webapi,圖檔直接base64存資料庫。

(代碼沒有重構過,比較亂,就不釋出了。)

Win8 Metro動态加載内容架構

總體開發流程

Win8 Metro動态加載内容架構

外殼程式狀态機流程圖

Win8 Metro動态加載内容架構

其中一個遊戲的部分狀态機流程圖

Win8 Metro動态加載内容架構

程式邏輯編輯器界面

Win8 Metro動态加載内容架構
Win8 Metro動态加載内容架構

html5支援websocket可以連接配接uppbox,自寫的js狀态機引擎在調試模式下可以把與c#代碼互動過程全部傳輸出來,還可以傳輸指令,友善調試。

Win8 Metro動态加載内容架構

xaml+js協定文檔,大部分指令都支援寫在xaml自動觸發或js發送

Win8 Metro動态加載内容架構

配套的app測試平台...沒什麼用的機會了...