Laya FairyGui系列三 Controller

控制器（Controller）

控制器是FGUI的一个核心的功能，使程序员在写UI时可以节省大量控制UI的代码。可以在FGUI编辑器中做到所见即所得。
比如我们在开发游戏中为了实现更好的按钮点击效果经常会给按钮设置鼠标按下，鼠标离开，鼠标进入等状态，每个状态又会对一个着一个不同颜色的图片，大多数引擎是在不同状态时切换不同的图片，FGUI时在不同的状态切换不同的控制器。

控制器控制的属性

控制器可以控制位置，大小，颜色，外观，文本，图标，动画等属性，包含了组件的大多数属性。同时还可以和其他组件关联，比如按钮，列表，下拉框等。

控制器的创建

每个组件可以同时创建多个控制器，每个控制器可以同时控制多种属性，

Controller_01.png

新建控制器的页面

Controller_02.png

通过控制器控制组件的属性，
选中舞台上的某个组件，可以在左边属性栏中看到“属性控制的面板”，显示控制下拉列表中显示无则显示属性未关联到任何控制器上，点击后面+号可以选择不同的属性来进行关联。

Controller_03.png

Controller_04.png

控制器的使用

• 获取控制器对象

const testContro = testCom.getController('c1');

• 监听控制器页签的切换

testContro.on(fairygui.Events.STATE_CHANGED, this, (e:fairygui.Controller)=>{
            console.log(e.selectedIndex);
})

• 设置控制器的页签

//通过页签索引设置
testContro.setSelectedIndex(1);
//通过页签名称设置
testContro.setSelectedPage('test_0');