|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2009-11-11
最后修改：2009-11-25
人心不足蛇吞象，做网站做到一大半时看到了人人网的手机版广告，上去看了一下，也想在goal98 team manager上弄个手机版玩玩。这样球队管理员可以第一时间把球队帐户明细显示给成员们，大家清清楚楚嘛～～～
搜索了一下关于给手机浏览器做网页的经验之谈。决定页面采取xhtml mobile profile的格式。这样普通电脑浏览器也可以浏览。grails默认的sitemesh layout是main，我增加一个专门给手机版用的mobile layout。
页面头应该是这样的：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
由于本人比较懒，很多地方都没有完全遵照规范，如果把http://team.goal98.com/m/login/auth页面拿去http://validator.w3.org/验证的话，错误一大堆。不过还是能正常显示啦。
由于是给手机用的layout，css也是专用的，本人无耻地从renren扒了些css来。鄙视我吧。如果设计得好的话，同一界面的不同版本应该这样做
普通浏览器版：
<head> <meta name='layout' content='main'/> <title><g:message code="login.title" default="Team Manager Login"/></title> </head> <body> <g:render template="/login/auth"/> </body>
手机浏览器版：
<head> <meta name='layout' content='mobile'/> <title><g:message code="login.title" default="Team Manager Login"/></title> </head> <body> <g:render template="/login/auth"/> </body>
/login/_auth.gsp里面的页面元素应该能在两套css下都能显示正常。不过本人没做到这么干净，好多地方为了在手机界面减少显示元素还是用了不同的界面，没有都公用template。
做手机版重要的一步是把用户引导到手机版上。人人网的做法是直接用了不同的域，http://m.renren.com/。 我用了个比较垃圾的做法，就是在登录界面url用http://team.goal98.com/m/login/auth加一个m。在urlmapping中 加了个规则：
"/m/$controller/$action?/$id?" {
mobile = true
constraints {
// apply constraints here
}
}
等于是加了个mobile的parameter在请求里，然后在一个filter里把session打上标记。
def filters = {
all(controller:'*', action:'*') {
before = {
if(params.mobile){
session.mobile = true
}
}
after = {
}
afterView = {
}
}
}
之后跟手机版页面有关的controller显示页面时回去判断这个标记
if(session.mobile)
view = "m-"+"$view"
render view: view, model: [postUrl: postUrl]
总之非常之垃圾。希望能得到大家的建议。 至于手机版的页面设计，就是遵循少图片，小容量的原则。内容都给我float到一边去。看起来就稍微美了。
声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2009-11-12
后来想了想。也许可以把domain model和service controller等提取成一个plugin,然后写两个主grails项目分别引用这个插件。两套grails项目中用不同的view分别显示普通版和手机版。发布时就发布两个应用。这样在controller里就不去要去判断了。不只这样有没有问题，准备试试。
|
| 返回顶楼 | |
浏览 2301 次
