palmwebos开发webos_notes_gbk_

最後更新日期:28/07/2009目录目录.............................................................................................................................................1写在最前.....................................................................................................................................2第1天:HelloWorld....................................................................................................................3第2天:会记名字的HelloWorld.............................................................................................11第3天:预定时间的HelloWorld.............................................................................................18备忘...........................................................................................................................................24Eclipse内打中文除错指南...................................................................................................................................25NovcomNotRunning更正内容...................................................................................................................................26Listener正确的设置方法有用连结...................................................................................................................................27官方文档讨论区收藏除错相关版权声明...................................................................................................................................28最後更新日期:28/07/2009写在最前这个学习的笔记是个人学习WebOS的一些经验分享,不是什么正式的教学,不过有兴趣的朋友亦可以当教学使用,亦不是一些专业的书籍,不过大家都可以当作WebOS学习的参考.这笔记会给所有爱WebOS,想学WebOS的人免费参考及阅读,不过所有内容都是有版权保护的,如需要转载,请必须写明出处,即是我的Blog:Prÿ-Dict:如果有兴趣交流,或给意见的话,可以有以下联络方式:E-mail/Facebook:[e-mail]:另外,我希望我的学习笔记可以帮到更多学习WebOS程式的人,所以我会不断更新最多的资料,不过因为写这笔记的准备不足,所以还得大家见谅,有很多基本上的概念都是欠奉的.大家可能要等等,或者自己先上网找资料.最後更新日期:28/07/2009第1天:HelloWorld因为这是一本学习笔记,所以我不会有一些很有系统的安排,只是随心而写,而多数第一个学习的程式,第一个往往都是HelloWorld,那我就先做一个HelloWorld.这是我最初的想法:这是一个程式,给我输入名字,便按一个键,再叫出一个Dialog向我说一句Hello.(有关如何设定WebOS的开发环境,我会最后先写,现先假定所有东西都准备好了)•步骤1:开启EclipseFileNewMojoApplication•步骤2:输入以下资料之后按”Finish”最後更新日期:28/07/2009•步骤3:EclipseWindowsOpenPerspectiveOthers选择webOSOK在ProjectExplorer中看到HelloWorld的骨架已经做好:最後更新日期:28/07/2009•步骤4:在ProjectExplorer中的HelloWorldFolder右手键NewMojoScene•步骤5:输入以下资料,做一个新的Scene,名为SayHello最後更新日期:28/07/2009当完成了之后,看看ProjectExplorer发现Eclipse已帮助做了一堆档案,分别是say-hello-assistant.jssay-hello的文件夹,say-hello-scene.html如果有细心留意,在sources.json入面都会多了一个东西:{scenes:say-hello,source:app\/assistants\/say-hello-assistant.js}我们做了一个Scene,是用来sayHello用的.say-hello-assistant.js是用来放置一些程式设置的东西.say-hello-scene.html是这个scene的UI铺排用的.•步骤6:先开了PalmSimulator再试试一切东西都是正式运作,在ProjectExplorer中的Hel-loWorldFolder右手键RunAsMojoApplication在WebOS的Emulator,应该可以看到:最後更新日期:28/07/2009•步骤7:因为在WebOS上,每一块画面,都叫做Scene,就像网页的一页,由於第一个是index,而第一个assistant会是stage-assistant,而第一个叫的method会StageAssistant.prototype.-setup(),我们不想看到第一页的index,除了将他修改之外,我们可以尝试转去第二个Scene,而这我们的例子所做,我们做到的第一个Scene会是say-hello,那我们就改写这个method,呼叫controller来将say-hello的scene变成我们现在的scene,将stage-assistant.js的method改成如下:StageAssistant.prototype.setup=function(){this.controller.pushScene(say-hello);}•步骤8:现在要设定UI,而UI的做法是HTML+CSS,非常简单,先将say-hello-scene.html改成以下的SourceCodedivid=yourNamex-mojo-element=TextField/divdiv/divdivid=submitx-mojo-element=Button/div最後更新日期:28/07/2009你会看到很多叫做x-mojo-element的东西,这是说明这会是什么的webOSwidget会在这里,你可以发现我分了三大部份,3个divtag,其中一个是Textfield,供输入名字用,id叫做your-Name,还有一个button,id叫做submit.id是非常重要的,不可以重叠,而且要易记,易明,因为你后面很多机会会用到.•步骤9:看say-hello-assistant.js的时间,你会发现这已替你做好很多功夫,有setup,activate,deac-tivate和cleanup这四个method已做好,不过如何决定那一个尼,暂不详细讨论,先搞清楚第一个会载入的.进入Scene时,会第一时间呼叫setup,而widget的setup,和listener的设置都是这里处理的.那我们改一改原先的setupmethod变成如下:最後更新日期:28/07/2009SayHelloAssistant.prototype.setup=function(){varattributes={//设定一个attributeshintText:$L('YourName...'),/*如果没有输入文字,就有一个提示的字样给你看要打什么东西*/};this.model={value:,//原本Textfield的字disabled:false//可以修改};/*将idyourName的widget套用attributes和model的内容都放进去,*设定为一个mojotextfield*/this.controller.setupWidget(yourName,attributes,this.model);/*这句和之前很似,不过这句是一句写完,*找一个id为submit的widget套用this.attributes,*而this.attributes内是空的,即使所有用预设的,而在model上,*则将button的Label变成submit**/this.controller.setupWidget(submit,this.attributes={},this.model={buttonLabel:submit});/*呼叫controllerlistenid为submit的widget,*而listen的动作是tap,*当listen到有关的动作是,呼叫sayHello**/this.controller.listen(submit,Mojo.Event.tap,this.sayHello.bind(this));}•步骤10:因为我们答应了Listener当submit键按的时间,便会叫sayHellomethod.所以,我们要做一个sayHello的method来应付使用者的按键:SayHelloAssistant.prototype.sayHello=function(){/*弹出一个errorDialog,上面写Hello,之后将id为yourName的mojowidgetvalue拿出来,并写在Hello之后.*/Mojo.Controller.errorDialog(Hello+this.controller.get(yourName).mojo.-getValue());};•步骤11:当我们再run一次的时间,便发现这个程式已经运作,不过有一些问题1.当yourName没有输入时,submi