当前位置: 代码迷 >> Web前端 >> Ext的Anchor格局
  详细解决方案

Ext的Anchor格局

热度:61   发布时间:2012-10-23 12:12:21.0
Ext的Anchor布局

Anchor布局的例子:

    //Anchor Layout要点:"1.容器内的组件要么指定宽度,要么在anchor中同时指定高/宽,2.anchor值通常只能为负值(指非百分比值),正值没有意义,3.anchor必须为字符串值"
     Ext.onReady(function() {
        var panel1 = new Ext.Panel({
             title: "panel1",
             height: 100,
             anchor: '-50',
             html: "高度等于100,宽度=容器宽度-50"
         });

        var panel2 = new Ext.Panel({
             title: "panel2",
             height: 100,
             anchor: '50%',
             html: "高度等于100,宽度=容器宽度的50%"

         });

        var panel3 = new Ext.Panel({
             title: "panel3",
             anchor: '-10, -250',
             html: "宽度=容器宽度-10,高度=容器高度-250"

         });

        var win = new Ext.Window({
             title: "Anchor Layout",
             height: 400,
             width: 400,
             plain: true,                    
             layout: 'anchor',
             items: [panel1, panel2,panel3]            
         });

         win.show();

     });

?