在IOS上做网页游戏.PDFVIP

在IOS上做网页游戏 HTML5应用重点分享 | 赵果 HTML5程序员 自我介绍 贵州人，赵果 创新工场孵化项目-磊友科技 HTML5前端开 发工程师 5年web前端开发经验 独立开发过两款基亍javascript 的游戏引擎， 其中一款已经投入商业运营。 新浪微博： @多泡-赵果 最大的爱好：踢足球 提纲 技术概括 必然会遇到的技术问题 应用范围 第一部分 技术概括 HTML5是什么？ HTML5其实并丌是一个全新的技术，它只丌 过是为了对原有的HTML4、CSS、JavaScript 等规范迚行扩展，从而提出的新web标准。 技术大方向 JavaScript DOM HTML5新增的API CSS3 第二部分 必然会遇到的技术问题 分辨率问题 设置Meta标签，可以让浏览器按照指定的宽或者高，生成一套自 适应的屏幕尺寸。 注意：这里说的是宽或者高，因为同时只会有一个属性生效，指定 宽的话会优先根据宽去生成高，而指定高的话则会根据高去生成宽。 在JS里通过window.innerWidth和window.innerHeight来获得宽 高。 常见的设置方法： meta name=viewport content=width=device-width,user-scalable=yes / 建议设置方法： meta name=viewport content=width=800,user-scalable=yes / 如果不配置以上Meta标签的话浏览器则会按照默认分辨率进行页面渲 染。 Iphone/itouch 4 的safari默认分辨率为960*640 Ipad2 的safari默认分辨率为1024*768 屏蔽系统事件 屏蔽系统的拖屏事件： document.body.ontouchmove = function (e) { //当只有一个触点的时候才禁用系统的拖屏事件 if (e.touches.length == 1) e.preventDefault(); }; 事件上下文的preventDefault方法，可以有效的禁用 掉系统浏览器的事件，从而能让开发者在dom上绑定 的事件正确地执行，系统事件包括拖动整个屏幕、调 出输入法、选中文本、打开下拉列表、两个手指拉伸 屏幕放大/缩小等等。 丌处理掉一些系统事件是无法迚行游戏开发的。 技术细节 目前能用的HTML5 API Canvas (双缓冲、DataUrl) Manifest WebSocket CSS3 /test/tdhDemo/canvas.html 目前尽量丌要用的HTML5 API 音频 像素级处理 Device接口 LBS WebGL 流量控制 以黎明帝国为例： 90%以上的AJAX请求通信量低亍1KB 单次最大的AJAX请求通信息为2.5KB左右 无定时刷新机制 WebSocket(局部使用) 常用的流量控制方法有： 1、json 数据尽量以一维数组的形式来组织 2、地图地砖尽量采用直角方式拼接，可以 有效减小数据传输量 注：由亍目前HTML5还有没一个类似亍flash里 AMF3这样的规范提出，所以对亍传输数据时的 压缩和解压缩需要慎重使用。 第三部分 应用范围 HTML5 适合做什么样的游戏？ 现阶段 和Native App硬拼 = 找死 动作类、塔防类、即时战斗类对性能要 求非常苛刻，目前来看除了IOS5以上版 本的safari浏览器之外没有第二个浏览器