精通Grails: Grails与移动Web - 编程入门网

图 9 展示了新页面在 iPhone 仿真器中的显示效果：

图 9. 为 iPhone 定制的列表页面

精通Grails: Grails与移动Web(9)

图 10 展示了此时 ready.mobi 验证器所提供的信息：

图 10. 通过验证的列表页面

这就好多了！而且针对验证器的必要更改是很少的。回顾 “精通 Grails: 用 Groovy 服务器页面 （GSP）改变视图”，可以通过输入 grails install-templates 来相应地更改默认模板。

为 iPhone 开发页面

iPhone 可能就是三种类型的设备中最容易支持的设备。它页面的开发与普通的 Web 页面开发完全相 同。iPhone 上的 Safari 浏览器与桌面浏览器的代码库完全相同，因此，用户在两者中所看到的东西是 一样的。但是您可以去掉一些显示提示，因为通过 iPhone 查看网站时它们会影响外观和感觉。

例如，一个 iPhone 的屏幕尺寸为 320x480，但有趣的是，浏览器设置的网页的默认宽度为 980 像素 。这使文本在手机的景色模式下不能读取，并且在肖像模式下会变得很小。但是不用担心，使用一个简单 的只有 iPhone 才能识别的 meta 标记，就可以将网页校正到 “正确的尺寸” 了：viewport 标记允许 为移动 Safari 浏览器添加提示。清单 9 中的代码就在很大程度上提高了在 iPhone 上查看的网页的可 读性。（不幸的是，基于 Firefox 的 iPhone ****器无法识别这个 meta 标记。只有在真正的 iPhone 上才可以看到它的实际运行）。

清单 9. 为 iPhone 设置 viewport

<meta　name="viewport"　content="initial-scale=1.0" 　/>

inital-scale 的范围为 0 到 10，且支持分数值。也可以输入显式的 width 和 height 值，上限为 10,000 像素（如清单 10 所示）：

清单 10. 为 viewport 设置 width 和 height

<meta　name="viewport"　 content="width=600;height=400"　/>

iPhone 上的超链接

说到超链接，iPhone ****了一些特殊的性能。如果使用 tel: 前缀代替 http://，单击链接就可以拨 出一个电话号码，如清单 11 所示：

清单 11. iPhone 上可用于拨号的链接

<p> telephone　number: <a　href="tel:303-555-1212">303-555-1212</a> </p>

如果使用传统的 mailto: 前缀的话，单击链接就会运行邮件应用程序，如清单 12 所示：

清单 12. 邮件链接

<p> mail: <a　href="mailto:scott@aboutgroovy.com">Scott　Davis</a> </p>

精通Grails: Grails与移动Web(10)

如果您为 Google Map ****一个链接，单击链接就会运行本地 Google Maps 应用程序，而不是将其转 交到 Safari 中，如清单 13 所示：

清单 13. Google Map 链接

<p> local　google　maps: <a　href="http://maps.google.com/maps? q=denver+international+airport">DEN</a> </p>

输入一个起点和终点，单击链接，它就会为用户****驾驶方向，如清单 14 所示：

清单 14. Google Map 驾驶方向

<p> driving　directions: <a　href="http://maps.google.com/maps?daddr= 　　 denver+airport&saddr=coors+field+denver,+co">Directions</a> </p>

移动

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!