制作背景

为了参加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. UWP学习记录6-设计和UI之控件和模式3

    UWP学习记录6-设计和UI之控件和模式3 1.按钮 按钮,响应用户输入和引发 Click 事件的控件. 使用<Button>就能创建一个按钮控件了.按钮是 ContentControl, ...

  2. HDU 5795 A Simple Nim 打表求SG函数的规律

    A Simple Nim Problem Description   Two players take turns picking candies from n heaps,the player wh ...

  3. webpack初试

    前言: 知道这完儿,没用过.关于webpack有很多介绍了,就不多说了.放几个链接,方便新手理解.这是给纯没用过的人了解的.这里只是简单介绍一下webpack的基本用法.大多内容都是来自webpack ...

  4. 3.View绘制分析笔记之onLayout

    上一篇文章我们了解了View的onMeasure,那么今天我们继续来学习Android View绘制三部曲的第二步,onLayout,布局. ViewRootImpl#performLayout pr ...

  5. python 学习第五天，python模块

    一,Python的模块导入 1,在写python的模块导入之前,先来讲一些Python中的概念性的问题 (1)模块:用来从逻辑上组织Python代码(变量,函数,类,逻辑:实现一个功能),本质是.py ...

  6. google开发者工具调试技巧

    http://blog.sina.com.cn/s/blog_60a4fcef0102v3vt.html

  7. mysql乐观锁总结和实践

    乐观锁介绍: 乐观锁( Optimistic Locking ) 相对悲观锁而言,乐观锁假设认为数据一般情况下不会造成冲突,所以在数据进行提交更新的时候,才会正式对数据的冲突与否进行检测,如果发现冲突 ...

  8. Windows - 性能监控之磁盘剩余空间大小警报

    开始 -> 运行 -> 键入命令 perfmon.msc 数据收集器(Data Collector Sets) -> 用户自定义(User Defined)

  9. Puppet自动化部署-安装及配置（3）

    本文介绍Puppet Master及Agent相关的安装及配置. 一. 官网下载Puppet安装YUM源 [root@puppet-master ~]# rpm -ivh https://yum.pu ...

  10. Oracle的tnsnames.ora配置(PLSQL Developer)

    首先打开tnsnames.ora的存放目录,一般为D:\app\Administrator\product\11.2.0\client_1\network\admin,就看安装具体位置了. 步骤阅读 ...