制作背景

为了参加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密钥不在讨论范围内...)
根据需要另集成了Spritehand.PhysicsHelper.Metro物理引擎。

相关技术传送门

核心原理


XAML与C#代码通信

网上有个Win8Metro的框架,G.Controls其中Interactive部分就可以把WPF中的Behavior、EventTrigger带回来。

至于JS与C#通信那就简单了,WebView本身就有事件支持。

服务端为Asp.Net MVC/WebApi,图片直接Base64存数据库。

(代码没有重构过,比较乱,就不发布了。)

其他


总体开发流程


外壳程序状态机流程图


其中一个游戏的部分状态机流程图


程序逻辑编辑器界面


程序逻辑编辑器界面


HTML5支持WebSocket可以连接UppBox,自写的JS状态机引擎在调试模式下可以把与C#代码交互过程全部传输出来,还可以传输指令,方便调试。


XAML+JS协议文档,大部分命令都支持写在XAML自动触发或JS发送


配套的App测试平台...没什么用的机会了...

Win8 Metro动态加载内容框架的更多相关文章

  1. Scrapy 框架 使用 selenium 爬取动态加载内容

    使用 selenium 爬取动态加载内容 开启中间件 DOWNLOADER_MIDDLEWARES = { 'wangyiPro.middlewares.WangyiproDownloaderMidd ...

  2. 在ASP.NET中动态加载内容(用户控件和模板)

    在ASP.NET中动态加载内容(用户控件和模板) 要点: 1. 使用Page.ParseControl 2. 使用base.LoadControl 第一部分:加载模板 下 面是一个模板“<tab ...

  3. bootstrap模态框modal使用remote动态加载内容,第二次加载显示相同内容解决办法

    bootstrap的modal中,使用remote可以动态加载页面到modal-body中,并弹窗显示 如果提供的是 URL,将利用 jQuery 的 load 方法从此 URL 地址加载要展示的内容 ...

  4. python+selenium+PhantomJS爬取网页动态加载内容

    一般我们使用python的第三方库requests及框架scrapy来爬取网上的资源,但是设计javascript渲染的页面却不能抓取,此时,我们使用web自动化测试化工具Selenium+无界面浏览 ...

  5. bootstrap modal动态加载内容

    $("#test .modal-body").load('test_url?id=' + id,function(){ $("#followStep1").mo ...

  6. layui upload 在JS动态加载内容后, 点击按钮无反应

    /** * 根据用户选择的不同规格选项 * 返回 不同的输入框选项 */ function ajaxGetSpecInput2(spec_arr) { var goods_id = $('#goods ...

  7. APK动态加载框架(DL)解析

    转载请注明出处:http://blog.csdn.net/singwhatiwanna/article/details/39937639 (来自singwhatiwanna的csdn博客) 前言 好久 ...

  8. Android动态加载框架汇总

    几种动态加载的比较 1.Tinker 用途:热修复 GitHub地址:https://github.com/Tencent/tinker/ 使用:http://www.jianshu.com/p/f6 ...

  9. 动态加载框架DL分析

    动态加载框架DL分析 插件化开发,主要解决三个问题1.动态加载未安装的apk,dex,jar等文件2.activity生命周期的问题,还有service3.Android的资源调用的问题 简单说一下怎 ...

随机推荐

  1. VS2015 编译 Qwt6.1.3

    VS2015 + Qt5.7 编译 Qwt6.1.3 1. 将 qwtconfig.pri 中的 C:\Qwt 改为  D:/ProgramFiles/C_Library/Qwt/Qwt , 我的Qw ...

  2. Swift -运算符和循环结构

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 13.0px Menlo; color: #4dbf56 } p.p2 { margin: 0.0px 0. ...

  3. 识别网络应用所使用的协议Amap

    识别网络应用所使用的协议Amap   Amap是Kali Linux自带的一款信息收集工具.工作时,它首先向服务器的端口发送内置的触发包(tirgger),然后获取响应.通过分析响应包数据,来识别该端 ...

  4. 让不支持h5新标签的浏览器支持新标签

    把这段js加到页面的头部就可以了,创建想让浏览器支持的标签即可 //条件判断是否支持 h5 if(window.applicationCache){ alert("支持h5") } ...

  5. log4j 配置INFO 和DEBUG 分布输出至两个文件

    博客地址: http://blog.csdn.net/wangchsh2008/article/details/8812857

  6. jQuery数据缓存方案详解:$.data()的使用

    我们经常使用隐藏控件或者是js全局变量来临时存储数据,全局变量容易导致命名污染,隐藏控件导致经常读写dom浪费性能.jQuery提供了自己的数据缓存方案,能够达到和隐藏控件.全局变量相同的效果,但是j ...

  7. 关于WORD文档的读取乱码问题

    一直以来都是用File类操作txt文档,今天想尝试能不能打开word文档,无奈,尝试了UTF8,Unicode,Default....等编码方式,打开文件都是乱码,电脑甚至发出警报声. 以下只取一种编 ...

  8. JNI使用问题记录

    此文章包含Android JNI学习过程中的遇到的各种错误记录和学习总结. 1.错误:java.lang.UnsatisfiedLinkError: Native method not found: ...

  9. 初识linux

    1.版本 稳定版本:偶数版如2.6.X 发展中的版本:奇数版如2.5.X linux distribution包含:linux kernel + free software + documentati ...

  10. Docker中images无法使用apt-get update解决方案

    问题描述:使用apt-get update一直fail 原因:DNS设置错误 解决办法: nm-tool #查看DNS后面的数(IPv4),将后面的数copy下来 sudo nano /etc/def ...