ccui.layout 横 竖方向布局,简单实现

来源:互联网 发布:服装图设计软件 编辑:程序博客网 时间:2024/06/03 21:38
var LayoutView = cc.Layer.extend({    ctor : function(){        this._super();        var colorList = [cc.color(255, 255, 255), cc.color(255, 0, 0), cc.color(0, 255, 0), cc.color(0, 0, 255), cc.color(255, 255, 0), cc.color(255, 255, 255), cc.color(255, 0, 0), cc.color(0, 255, 0), cc.color(0, 0, 255), cc.color(255, 255, 0)];        var lo = new ccui.Layout();        lo.setLayoutType(ccui.Layout.LINEAR_VERTICAL);  // ccui.Layout.LINEAR_HORIZONTAL        lo.setContentSize(cc.size(500, 400));        this.addChild(lo);        this.btn1 = ccui.Button();        this.btn1.setTouchEnabled(true);        this.btn1.loadTextures(res.CloseNormal_png, res.CloseSelected_png, "");        lo.addChild(this.btn1);        this.btn2 = ccui.Button();        this.btn2.setTouchEnabled(true);        this.btn2.loadTextures(res.CloseSelected_png, res.CloseNormal_png, "");        this.btn2.addTouchEventListener(function(){            this.btn2.removeFromParent(true);        }, this);        lo.addChild(this.btn2);        this.btn3 = ccui.Button();        this.btn3.setTouchEnabled(true);        this.btn3.loadTextures(res.CloseNormal_png, res.CloseSelected_png, "");        this.btn3.addTouchEventListener(function(){//          this.btn3.setVisible(false);        }, this)        lo.addChild(this.btn3);        this.setLayoutParameter();        return true;    },    close : function(){    },    setLayoutParameter : function(){        var lp1 = new ccui.LinearLayoutParameter();        this.btn1.setLayoutParameter(lp1);        lp1.setGravity(ccui.LinearLayoutParameter.CENTER_HORIZONTAL); // ccui.LinearLayoutParameter.CENTER_VERTICAL        lp1.setMargin(new ccui.Margin(0, 5, 0, 10));        var lp2 = new ccui.LinearLayoutParameter();        this.btn2.setLayoutParameter(lp2);        lp2.setGravity(ccui.LinearLayoutParameter.CENTER_HORIZONTAL);// ccui.LinearLayoutParameter.CENTER_VERTICAL        lp2.setMargin(new ccui.Margin(0, 5, 0, 10));        var lp3 = new ccui.LinearLayoutParameter();        this.btn3.setLayoutParameter(lp3);        lp3.setGravity(ccui.LinearLayoutParameter.CENTER_HORIZONTAL);// ccui.LinearLayoutParameter.CENTER_VERTICAL        lp3.setMargin(new ccui.Margin(0, 5, 0, 10));    }});

在竖直方向上布局,点击第二个之后,会删除第二个按钮,且其余的按钮会自动对齐

原创粉丝点击