Laya学习笔记-使用ScrollBar滚动文本

一、场景搭建

1.在Laya->工程->Scenes->新建->页面/场景 新建一个场景命名为“Main”

2.设置新建的场景属性

3.创建一个Text类型的UI组件

4.在右边Text的属性栏中设置Text的宽高及位置

5.设置Text的文本内容、字体大小、字体颜色、自动换行、垂直间距、文本超出文本域行为

6.在“层级”面版->Scene->创建UI组件->VScrollBar 

7.设置VScrollBar的高度及位置

二、代码实现

1.新建一个脚本命名为 “ScrollBarCrtl.js”，代码实现如下

export default class ScrollBarCrtl extends Laya.Script {

    constructor() {
        super();
        /** @prop {name:txt, tips:"提示文本", type:Node, default:null}*/
        this.txt=null;
        /** @prop {name:scrollbar, tips:"提示文本", type:Node, default:null}*/
        this.scrollbar=null;

    }

    onAwake() {

    }

    onUpdate(){

        this.txt.scrollY=this.scrollbar.value*this.txt.maxScrollY;
    }
}

2. 将“ScrollBarCrtl.js”代码挂载在Scene中

3.将我们上面新建的 Text 和 VScrollBar 指定到“ScrollBarCrtl.js”脚本属性中，大功告成！