1. 爱易网页
  2. JavaSript
  3. Extjs4.0常见的几种格局详解

Extjs4.0常见的几种格局详解

日期：2014-05-16　 浏览次数：20347 次

Extjs4.0常见的几种布局详解



Ext.onReady(function() {

/**
* 1.auto布局使用（默认布局）
*/
var panel1 = Ext.create('Ext.panel.Panel', {
title : 'panel1',
html : 'panel1ddd',
height : 80,
width : 100
});
var panel2 = Ext.create('Ext.panel.Panel', {
title : 'panel2',
html : 'panel2ffff',
height : 80,
width : 100
});
var panel3 = Ext.create('Ext.panel.Panel', {
title : 'panel3',
html : 'panel3yyyy',
height : 80,
width : 100
});
var panel4 = Ext.create('Ext.panel.Panel', {
title : 'panel4',
html : 'panel4GGG',
height : 80,
width : 100
});
var auto = Ext.create('Ext.window.Window', {
title : 'auto Layout',
width : 100,
height : 420,
layout : 'auto',
defaults : {
bodyStyle : 'padding:15px'
},
items : [panel1, panel2, panel3, panel4]
});
auto.show();


/**
* 2 anchor布局（按百分比显示）
*/
var panel5 = Ext.create('Ext.panel.Panel', {
title : 'panel5',
html : '100% 30%',
anchor : '100% 30%'
});
var panel6 = Ext.create('Ext.panel.Panel', {
title : 'panel6',
html : '100% 25%',
anchor : '1000% 25%'
});


var panel7 = Ext.create('Ext.panel.Panel', {
title : 'panel7',
html : '100% 15%',
anchor : '100% 15%'
});


var panel8 = Ext.create('Ext.panel.Panel', {
title : 'panel8',
html : '100% 30%',
ancho

相关资料更多>

  1. 问上定义变量的一种形式
  2. 自己写的的滚动条，动辄就超出外框几像素
  3. js 遮挡层+拖拽
  4. 用javascript兑现显示隐藏左侧菜单
  5. 点击一个按钮，触发iframe里的一个上传按钮的onclick事件弹出选择文件对话框解决办法
  6. js获取页面元素到页面座标
  7. js惯用各种组件集合
  8. 在dom中子节点有没有属性表示自己的索引号的呢解决方法
  9. 怎么解决争夺焦点引起的死锁