【51CTO译文】这份简短的教程将带你经历你的第一个惠普webOS应用程序。本教程将向你介绍如何创建一个简单的计数器，计算按钮的点击量，而不是单纯的显示“Hello, World!”。本教程结束后，你应该会熟悉stages、scenes、assistants以及其他一些重要的概念。

一、开始之前

本教程帮助你开发一个简单的webOS应用程序以验证你的开发工具是否可以正常运作。本教程假定你已经熟悉HTML和JavaScript。如果你是刚刚开始学习HTML和JavaScript，我们收集了一些Web开发的相关链接，希望会对你有所帮助。

在开始你的第一个webOS应用程序的之前，请先安装惠普webOS的SDK。webOS的SDK安装了几个命令行工具，用于创建，封装，安装和调试的应用程序，安装包还会告诉你如何下载甲骨文的VirtualBox，它是一个虚拟机环境。为SDK安装虚拟机文件是因为需要在你的桌面上模拟webOS的环境。

自己熟悉模拟器，并确保你知道如何开始用模拟器启动应用程序（你可以通过点击webOS主界面右下角的箭头图标来启动模拟器）。模拟器运行起来很像真正的Palm设备，但需要用你的计算机键盘进行输入，用你的鼠标控制动作，用“Esc”键模拟“返回”键。

你可以使用惠普命令行工具开发一个应用程序，或者使用你喜欢的文本编辑器和Web开发工具。 使用Eclipse的webOS插件简化调试、封装、安装、运行webOS的应用程序的过程。欲了解更多信息，请看Eclipse官网。

二、应用程序目录

webOS的应用程序目录具有特定的结构。这些指南会告诉你如何使用webOS的SDK的命令行工具来设置应用程序目录结构，以及创建一个应用程序所需文件的初始设置。

（注：如果你使用的是有webOS SDK插件的Eclipse，选择“文件”>“新建”>“Mojo应用”。然后输入“HelloWorld”作为项目的名称和标题，并在其他选项接受默认值。点击“完成”即可创建应用程序框架。）

1.设置应用程序的目录结构

（1）打开一个命令提示符窗口，新建一个开发应用程序工作区目录（例如，app_dir）。

（2）在工作区目录，键入以下内容（注意双引号里面的单引号）：

palm-generate -p "{title:'Hello World', id:com.mystuff.hello, version:'1.0.0'}" HelloWorld

2.来看一下新的HelloWorld文件夹的内容：

（1）应用程序文件夹：包含构成应用程序的assistants、models和views文件。在本教程的后面，你将会把文件添加到这个目录。

（2）图像文件夹：包含应用程序使用的所有图像。

（3）样式表文件夹：包含应用程序的层叠样式表文件。

（4）appinfo.json：应用程序的信息文件。

（5）icon.png：应用程序在模拟器或设备上显示的图标。

（6）index.html：应用程序打开时的主页面文件。

（7）sources.json：每个scene的源文件列表。

如需更多有关应用程序目录结构的信息，请参见应用程序结构。

三、应用信息

appinfo.json文件提供SDK框架封装和运行应用程序的信息。来看一下appinfo.json的内容：

{
 "id": "com.mystuff.hello",
 "version": "1.0.0",
 "vendor": "My Company",
 "type": "web",
 "main": "index.html",
 "title": "Hello World",
 "icon": "icon.png"
 }

留意ID和供应商参数，当你在它们各自的设备上创建签名的应用程序时，这将会对你有所帮助。

四、设置Stage

Stage是一个建立在应用程序用户界面上的平台。Stage通常对应于一个单独的选项卡，或应用程序窗口。最简单的应用程序只有一个Stage，包含在index.html文件中。应用程序会允许用户同时执行多个操作，这就可能需要多个Stage。例如，电子邮件应用程序可能会在Stage上显示一个收件箱，但第二步操作会创建新的电子邮件。通知和后台应用程序没有Stage。

2.来看一下index.html的内容：

 
 
 
 
 
 
     
 
    
 
         type="text/javascript" x-mojo-version="1"> 
 
      
 
     
 
 
 
 

请注意，index.html是一个标准的HTML页面，