在Enyo框架下编写webOS的“hello world！”
继上篇讲解了webOS SDK的安装及取得Enyo 1.0的代码后，这节讲如何写一个Enyo的hello wrold。上一节我们把Enyo的框架代码放在了H:\enyo目录下，目录结构如下图：
http://images.51cto.com/files/uploadimg/20110701/1109470.png目录1.0必须有，且不能改名，否则会引起框架中自带的示例因为路径错误，找不到框架源码而无法运行。目录下的framework是框架的源码。support提供一些开发方面的支持，包括文档，示例等。
所有示例的运行，不需要webOS SDK的支持，直接用webkit内核的浏览器在PC上就能看到效果，所以请先准备好chrome浏览器。SDK3.0目前也不支持Enyo程序，即使把程序打包安装到模拟器中，也没办法正常运行。以后教程中的示例效果除特别说明，都是PC上在chrome浏览器中看到的效果。
下面讲解Enyo的hello world
Enyo框架带的示例中就有hello world中的样例代码，地址为support目录下的examples\HelloWorld，目录结构如下：
http://images.51cto.com/files/uploadimg/20110701/1109471.png用chrome打开index.html可以看到浏览器中打出Hello World!，如下图：
http://images.51cto.com/files/uploadimg/20110701/1109472.png下面进入代码讲解。
打开index.html
[*]<html>
[*]<head>
[*]<title>enyo HelloWorld</title>
[*]//这里引入框架的JS，可以看到路径里有1.0，所以前面提到复制的时候不能少了1.0
[*]<script src=&quot;../../../../1.0/framework/enyo.js&quot; type=&quot;text/javascript&quot;></script>
[*]</head>
[*]<body>
[*]<script type=&quot;text/javascript&quot;>
[*]new enyo.Canon.HelloWorld().renderInto(document.body);
[*]</script>
[*]</body>
[*]</html>
body中的代码是程序启动时执行的代码。newenyo.Canon.HelloWorld()，创建了一个enyo.Canon.HelloWorld的对象。renderInto(document.body)则是指把前面创建的对象渲染到body中。那enyo.Canon.HelloWorld对象是哪里定义的呢?在HelloWorld.js中。如下：
[*]enyo.kind({
[*]
[*]name: &quot;enyo.Canon.HelloWorld&quot;,
[*]
[*]kind: enyo.Control,
[*]
[*]content: &quot;Hello World!&quot;
[*]
[*]});
这些代码的意思是指，创建一个继承自enyo.Control的类enyo.Canon.HelloWorld，并且这个类的一个属性content是HelloWorld!。
渲染的时候控件的content就会写入html的body标签中。
HelloWorld项目下的其它几个文件作用如下：
HelloWorld.css：定义样式，为空的话，所有的样式都是使用webos内置的样式。
appinfo.json：包含装载和启动程序所必需的一些信息。最主要的属性是ID,webos内所有的程序的ID都是独一无二的，不能重复。
经过这个教程，大家应该对webos的开发有个感性认识，接下来的文章，会介绍enyo开发的基础。
【编辑推荐】
[*]webOS发布新的应用程序开发框架Enyo
[*]在Enyo框架下安装webOS 3.0 SDK教程
页:
[1]