玩转h5之layaide设计fd编程

什么是layaide？传送门：http://layabox.com/

fd配置，参考：https://ldc.layabox.com/doc/?nav=ch-as-1-0-2

源码：

package 
{
	import laya.display.Text;
	import laya.events.Event;
	import laya.net.Loader;
	import laya.utils.Handler;
	//import view.TestView;
	import ui.test.myViewUI;
	/**
	 * ...
	 * @author amyflash.com
	 * 
	 * 利用layaide创作界面，导入到fd进行界面开发的步骤：
	 * 1. 设计创作：layaide新建好页面，并发布
	 * 2. 拷贝视图as文件：layaide项目的目录中，拷贝src/ui目录到fd项目的src目录
	 * 3. 拷贝设计资源文件:layaide项目的目录中，拷贝bin/h5/res目录到fd项目的bin目录
	 * 4. 文档类import对应页面的ui的as文件,如果涉及到点击事件等操作，需要import laya.events.Event; 不然会报错
	 * 5. 宏编译
	 * 6. 将bin/h5目录拷贝到服务器的根目录，http访问，检查结果
	 */
	public class HelloLayabox 
	{
		
		public function HelloLayabox() 
		{
			   //创建舞台
		   Laya.init(600, 300);//舞台默认背景色是黑色的
		/*   var txt:Text = new Text();
		   txt.text = "Hello Layabox";
		   //设置文本颜色
		   txt.color = '#FF0000';
		   //设置文本字体大小，单位是像素
		   txt.fontSize = 66;
		   //设置字体描边
		   txt.stroke = 5;  //描边为5像素
		   txt.strokeColor = '#FFFFFF';
		   //设置为粗体
		   txt.bold = true;
		   //设置文本的显示起点位置X,Y
		   txt.pos(60, 100);
		   //设置舞台背景色
		   Laya.stage.bgColor = '#23238E';
		   //将文本内容添加到舞台
		   Laya.stage.addChild(txt);*/
		   
		  
			//加载引擎需要的资源
			Laya.loader.load([{url: "res/atlas/comp.json", type: Loader.ATLAS}], Handler.create(this, onLoaded));

		}
		
		private var testView:myViewUI;
		private function onLoaded():void {
			//实例UI界面
			testView = new myViewUI();
			Laya.stage.addChild(testView);
			
			testView.btn1.on(Event.CLICK, this, onBtnClick);
			
		}
		
		private function onBtnClick(e:Event):void {
			//手动控制组件属性
			testView.label1.text = "hello cool girl!";
			trace(123);
		}
		
	}

}