论坛怎么实现html5,这样的panel请问如何实现比较好？

实现步骤：

1、定义一个Item,界面分两层(可用两个Sprite进行划分)

class Item extends ui.itemUI {

private state = 0;

constructor() {

super();

//点击最先出来的按钮，会显示下一层界面,同时隐藏自己

this.btnFirst.on(Laya.Event.CLICK, this, this.change, [0]);

//点击上面一层的按钮，会隐藏该层，同时显示上一层

this.btnChange.on(Laya.Event.CLICK, this, this.change, [1]);

//初始时默认上面一层不可见

this.layoutSecond.visible = false;

}

//点击切换状态

private change(state: number, e: Laya.Event) {

e.stopPropagation();

this.state = state;

this.layoutSecond.visible = (state === 0);

this.btnFirst.visible = (state !== 0);

}

}

2.定义一个界面，界面上放一个Panel(因为要滑动)

class TextUI extends ui.TestUI {

constructor() {

super();

//设置可滚动

this.container.vScrollBarSkin = '';

this.init();

}

private init() {

for (var i = 0; i < 10; i++) {

var item = new Item();

item.pos(0, i * (item.height + 1));

this.container.addChild(item);

}

}

}

3,加载资源，完成后再加载界面

import WebGL = Laya.WebGL;

// 程序入口

class GameMain {

constructor() {

Laya.init(500, 1000, WebGL);

Laya.stage.scaleMode = Laya.Stage.SCALE_FIXED_WIDTH;

var resPath = ['res/atlas/comp.atlas'];

Laya.loader.load(resPath, new Laya.Handler(this, function () {

var textUi = new TextUI();

Laya.stage.addChild(textUi);

}), null, Laya.Loader.ATLAS);

}

}

new GameMain();