scrollview组件

cocos2d-js ccui.scrollview组件

cc.newScrollView = cc.Node.extend({
    children : [],      // 用于储存子节点
    listener : [],
    ctor : function(args){
        this._super();

        this.size     = args.size;
        this.isBounce = args.isBounce || true;
        this.cellSize = args.cellSize;
        this.distance = args.distance || 0;

        this.x = 0;
        this.y = 0;
        this.width  = this.size.width;
        this.height = this.size.height;
        this._init();
    },

    // 初始化ScrollView
    _init : function(){
        this.scrollView = new ccui.ScrollView();
        this.scrollView.setDirection(this._getDirection());
        this.scrollView.setTouchEnabled(true);
        this.scrollView.setBounceEnabled(this.isBounce);
        this.scrollView.setSize(this.size);
        this.scrollView.setAnchorPoint(cc.p(0, 0));
        this.addChild(this.scrollView);
        this.scrollView.setInnerContainerSize(this.cellSize);

        this.scrollView.x = 0;
        this.scrollView.y = 0;
    },

    // 设置scrollView显示内容
    setContent : function(obj, i){
        this.children.push(obj);
        this.scrollView.addChild(obj);
        this.testIsIllegal();
    },

    // 返回scrollview的所有子节点
    getContent : function(){
        return this.children;
    },

    // 设置scrollView的锚点（cc.p）
    setScrollViewAnchor : function(point){
        this.scrollView.setAnchorPoint(point);
    },

    // 获取scrollView的锚点
    getScrollViewAnchor : function(){
        return cc.p(this.scrollView.anchorX, this.scrollView.anchorY);
    },

    // 设置scrollView的位置（cc.p）
    setScrollViewPosition : function(pos){
        this.scrollView.x = pos.x;
        this.scrollView.y = pos.y;
    },

    // 获取scrollView的位置
    getScrollViewPosition : function(){
        return this.scrollView.getPositionPercent();
    },

    // 根据传入参数设置scrollView当前滑动方向
    _setDirection : function(){
        if(this.distance == 0){
            return ccui.ScrollView.DIR_HORIZONTAL;
        }
        else if(this.distance == 1){
            return ccui.ScrollView.DIR_VERTICAL;
        }
        else if(this.distance == 2){
            return ccui.ScrollView.DIR_BOTN;
        }
        else if(this.distance == 3){
            return ccui.ScrollView.DIR_NONE;
        }
        else {
            cc.warn("【ScrollView】未设置当前可滑动方向,当前默认为不可滑动!");
            return ccui.ScrollView.DIR_NONE;
        }
    },

    _getDirection : function(){
        return this._setDirection();
    },

    // 判断滚动区域在滚动方向上的长度是否等于子节点的总长度
    testIsIllegal : function(){
        if(this.distance == 0){
            var childWidth = 0;
            for(var i = 0; i < this.children.length; i++){
                childWidth += this.children[i].width;
            }
            if(childWidth <= this.cellSize.width){
                cc.log("【scrollView】创建成功")
            }
            else {
                cc.log("【scrollView】创建失败，由于子节点总宽度大于滚动区域宽度，不允许创建");
                this.scrollView.removeFromParent(true);
            }
        }
        if(this.distance == 1){
            var childHeight = 0;
            for(var i = 0; i < this.children.length; i++){
                childHeight += this.children[i].height;
            }
            if(childHeight <= this.cellSize.height){
                cc.log("【scrollView】创建成功")
            }
            else {
                cc.log("【scrollView】创建失败，由于子节点总宽度大于滚动区域宽度，不允许创建");
                this.scrollView.removeFromParent(true);
            }
        }
    },

    // 重新设置，使滚动区域等于所有子节点的在滚动方向上的长度
    RecontentSize : function(){
        if(this.distance == 0){
            var childWidth = 0;
            for(var i = 0; i < this.children.length; i++){
                childWidth += this.children[i].width;
            }
            this.scrollView.setInnerContainerSize(childWidth);
        }
        if(this.distance == 1){
            var childHeight = 0;
            for(var i = 0; i < this.children.length; i++){
                childHeight += this.children[i].height;
            }
            this.scrollView.setInnerContainerSize(childHeight);
        }
    }
});

/*
 * 新建scrollView的入口
 * @param size    ：表示可视区域的大小
 * @param cellsize：表示滚动区域大小
 * @param isBounce：表示是否开启回弹
 * @param distance：表示滚动区域可拖动方向 （0：水平拖动，1：竖直拖动，2：水平/竖直均可拖动，3：不允许拖动）
 */
cc.newScrollView.create = function(args){
    return new newScrollView(args);
}

• 其中包含的子节点“建议”不能为cc.layer类型