使用 Dojo 开发基于 iPad 的 Web 应用程序.docVIP

使用 Dojo 开发基于 iPad 的 Web 应用程序 在 iPad 上开发 Web 应用 随着 iPad 风靡全球，越来越多的 Web 应用开始转向 iPad。Google 公司为 iPad 做了专用版的 Gmail 邮箱界面。由于 iPad 拥有比手机更大的屏幕和 1024 × 768 的分辨率，google 采用了类似于 iPad 内置 Mail 邮件客户端的左右双栏式界面设计，这带给用户全新的界面体验。网易公司也推出了 iPad 版网易邮箱，不仅界面清爽，而且支持邮件附件在线预览。 开发前的准备 在开发 iPad 的 Web 应用之前，我们最好有一台 iPad 可以随时对网页进行测试。我们还可以在 Mac 中使用 iPhone Simulator ，在Hardware?Device中选择?iPad即切换到 iPad 模拟平台。在模拟平台中看到的网页和在 iPad 上基本是一样的。我们也可以在电脑上通过更改用户代理（User Agent）的方法模拟 iPad 行为，注意这只是模拟 iPad 发送 HTTP 请求，使服务器以为你是在用 iPad 访问，从而帮你转向到 iPad 版的页面（如果提供了的话），你在电脑上看到的页面和在 iPad 上还是有区别的。打开必威体育精装版版本的 Safari，在?开发?用户代理中选择?Mobile Safari 3.2 – iPad。 如果没有这一项，就在?其它中输入： Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10  当 iPad Safari 发布新版本时，字符串中的版本号可能会有所变化，所以任何代码检查用户代理字符串不应该依赖于版本号。 一般来说，我们首先在电脑上将功能测试通过，然后再在 iPad 上调整页面外观与用户体验。毕竟在 iPad 上调试不如在电脑上方便。打开 Safari 的调试功能：偏好设置?高级，勾上?在菜单栏中显示“开发”菜单，如图 1 所示。 图 1. iPad 上 Safari 的设置：? 然后在“开发”菜单里选择?显示 Web 检查器打开调试窗口。“元素”标签用于检查 HTML 和 CSS，在页面中想要检查的元素上右击，选择“检查元素”，调试窗口会自动跳到该元素对应的 HTML。“脚本”标签用于调试 JavaScript，通过单击行号设置断点，如图 2 所示。“控制台”标签不但可以显示记录的日志，而且还可以在命令行中输入 JavaScript 代码，代码可以立即被执行。 图 2. JavaScript 调试? 使用 Web 标准进行开发 iPad 的 Mobile Safari 不支持插件，所以一个设计原则就是只使用基于 Web 标准的技术，而不要使用插件技术，这可以使页面在 iPad 上和在其它平台上的显示保持一致。基于 Webkit 引擎的 Safari 浏览器支持以下 Web 标准： HTML 4.01 和部分 HTML5 XHTML 1.0 CSS 2.1 和部分 CSS3 ECMAScript 3 (JavaScript) DOM Level 2 AJAX 技术 , 包括 XMLHttpRequest 关于使用 Web 标准开发 iPad Web 应用的细节，可以参考苹果开发者（Apple Developer）网站，具体见?参考资源。 选择 Dojo 简化开发 由于 iPad 具有比一般移动设备更强大的处理性能，我们完全可以使用 JavaScript 库来简化前台页面开发，增强用户体验。Dojo 是一种流行的开源 JavaScript 工具包，为基于 Web 应用的 JavaScript 快速开发而设计，它已经被广泛地使用在 Web 开发中。Dojo 提供了丰富的 Widget，让你更容易地为 Web 页面添加动态能力，提升 Web 应用程序的可用性和交互能力，同时提高了程序员的开发效率。你可以在 IBM 中国 developer Works 的 Dojo 技术专题中找到很多 Dojo 的学习资料。 Dojo 不是专门为 iPad 设计的，有些控件在 iPad 上的用户体验不能令人满意，这就需要我们进行一些扩展和改进，有时这会遇到一些麻烦。本文就是这样的一些实践总结，但也只包含了 Dojo 控件中的一小部分。我们更期待 Dojo 在以后的版本中会针对移动设备进行优化。 在正式开始之前，我先说明一个最佳实践：尽量少用 Dojo 控件。一些原生 HTML 控件在 iPad 中会被重新渲染，即使不加任何