10分钟带你玩转“hello world”!你可以通过在线编辑板块建立一个自己的“hello world!”项目然后跟着这个教程开始吧。

1)显示”hello world!”;

<canvas>  
   <text fontsize="18">hello world!</text> 
</canvas>  
恩,就这么简单,赶紧到在线开发环境里面建立一个自己的项目试验一把吧!

接着咱们再深入一点吧!
<?xml version="1.0" encoding="utf-8"?>
<canvas >	
  <view width="240" height="320" id="v1">
	<text name="1b" x="13" y="100" fgcolor="#ffffff"  fontsize="18" text="hello world" />
  </view>
</canvas>
这段代码中,<?xml version="1.0" encoding="utf-8"?>表示文档按utf-8格式保存,这样显示的中文才不会乱码哦!<canvas>是根节点;程序以<canvas>开始,以</canvas>结束.canvas下面包含了一个view视图,view视图下包含了一个text标签,它是用来显示文字的。
View中的width和heigth属性用来设置视图的大小,id属性是全局对象标记,可以通过id属性来直接访问到该标签。而要访问名称属性的标签时,需要通过路径来访问,如v1.lb. Text中的x,y属性用来决定文字显示的位置,字体大小可以通过fontsize属性来改变。显示的内容由text属性来设置,或者直接放在<text> Hello World!</text>来显示。

2)我们可以通过键盘来对Hello World进行一些操作!

在lzx文件中如果要能够接受到键盘事件,需要定义一个onkeydown的handler事件,如在上面的应用中加入如下代码,如:
<handler name="onkeydown"  args="key" reference="LzKeys" ><![CDATA[
    switch(key){
        case 38:  //up
            up(-1);
            break;
        case 40:  //down
            up(1);
            break;
        case 13:
             if(v1.getAttribute("bgcolor") == 0xffffff){
                 v1.setAttribute("bgcolor", gray);
                 v1.lb.setAttribute("fgcolor",red);
             }else{
                 v1.setAttribute("bgcolor", 0xffffff);
		 v1.lb.setAttribute("fgcolor",red);
             }
             break;
        case 33:
        case 4108:   //left button  
           v1.lb.addtoclips_anm.doStart();
           break;              
    }
 ]]></handler>
 
当我们按键时,就可以触发onkeydown事件。

1.如按enter键时我们可以通过getAttribute()和setAttribute()得到标签的属性和更改属性的值。getAttribute()函数的参数为你所需要得到值某个属性。setAttribute()函数有两个参数,第一个是要个某个属性设置值,第二个参数为具体的值。如:通过v1.setAttribute("bgcolor", gray);把view视图的背景颜色设置成灰色。

2.按上、下键时,可以调用在script中的函数,并传个它一个参数,函数的功能是通过setAttribute属性来设置text的y值。

3)另外我们可以给text标签加入一些动画效果,如:

<text name="lb" x="13" y="100" fontsize="18"  text="Hello World!" >
    <animatorgroup name="addtoclips_anm" duration="1000"  process="simultaneous" start="false" >
           <animator attribute="opacity" from="0" to="1" />
           <animator attribute="fontsize" from="1" to="18" />
    </animatorgroup>    
</text>
动画属性的一些具体含义可以参考lzx文档中的动画部分。该动画主要实现的是让Hello World!的字体从1-18号,透明度从0-1,让这两个动画同时执行。初始的状态我们通过start属性设置成false,通过doStart()启动该动画,如按F3键时或手机上的左功能键时v1.lb.addtoclips_anm.doStart()来执行。