cocos学习-scrollview

创建完scrollview后，可以看到节点树结构如下：

根节点下有两个组件：

        Sprite:定制scrollview背景色

        ScrollView:

Horizontal：是否开启水平滚动        

Vertical：是否开启垂直滚动

Inertia：是否开启滚动惯性

Brake：滚动惯性，0为没有惯性，1为一直滚动下去、

Elastic：滚动到达底部时候会不会超出边界，实现回弹

Bounce Duration：回弹返回的时间

Scroll Event：滚动事件

孩子节点：scrollBar是滚动条

孩子节点：view是可视化范围

                view下的mask：超过这个范围就不显示

                view下的content：每项数据的定制

content上面加一个layout可以方面编辑内容

尝试在scrollview上添加东西：

制作一个prefab

脚本挂载到scrollview上：

    @property(cc.Prefab)
    item: cc.Prefab ;
    start () {
        var content = this.node.getComponent(cc.ScrollView).content;
        //var content = this.node.getChildrenByName('content');
        for(let i =0;i<10;i++){
            let tmp = cc.instantiate(this.item);
            tmp.setParent(content);
            //content.addChild(tmp);
        }
    }

效果：

一些scrollview方法及使用：

        this.node.getComponent(cc.ScrollView).scrollTo(cc.v2(0,0.5), 1);
//在一秒内在垂直方向上滚动50%
        this.node.getComponent(cc.ScrollView).scrollToBottomRight(1);
//在一秒内滚动到视图右下角
        this.node.getComponent(cc.ScrollView).scrollToBottom(5);
//在五秒内滚动到底部
        this.node.getComponent(cc.ScrollView).scrollToTop(5);
//在5秒内滚动到顶部
        this.node.getComponent(cc.ScrollView).stopAutoScroll;
//停止滚动