资源描述：
《extjs中layout地12种布局风格》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。
1、实用标准文案ExtJS中layout的12种布局风格extjs的容器组件都可以设置它的显示风格，它的有效值有absolute,accordion,anchor,border,card,column,fit,formandtable.一共9种。另外几种见：http://www.sencha.com/deploy/dev/examples/layout-browser/layout-browser.html里面有详细的例子。·absolute·顾名思义，在容器内部，根据指定的坐标定位显示·accordion·这个是最容易记的，手风琴效果Java代码1.Ext.onReady(functi
2、on(){ 2.var panel=new Ext.Panel(//Ext.formPanel就是Panel中用了form布局 3. { 4. renderTo:'paneldiv', 5. title:'容器组件', 6. layout:'accordion', 7. width:500, 8. height:200, 9. layoutConfig:{animate:false}, 10. items:[ 11. {title:'元素1',
3、html:''}, 12. {title:'元素2',html:''}, 13. {title:'元素3',html:''}, 14. {title:'元素4',html:''} 15. ] 16. } 17. ); 18.}); ·anchor·这个效果具体还不知道有什么用，就是知道注意一下1.容器内的组件要么指定宽度，要么在anchor中同时指定高/宽，2.anchor值通常只能为负值(指非百分比值)，正值没有意义，3.anchor必须为字符串值Java代码文档实用标准文案1.Ext.onRe
4、ady(function() { 2. var panel1 = new Ext.Panel({ 3. title: "panel1", 4. height: 100, 5. anchor: '-50', 6. html: "高度等于100，宽度=容器宽度-50" 7. }); 8. 9. var panel2 = new Ext.Panel({ 10. title: "panel2", 11.
5、 height: 100, 12. anchor: '50%', 13. html: "高度等于100,宽度=容器宽度的50%" 14. 15. }); 16. 17. var panel3 = new Ext.Panel({ 18. title: "panel3", 19. anchor: '-10, -250', 20. html: "宽度=容器宽度-10,高度=容器宽度-250" 21. 22. });
6、 23. 24. var win = new Ext.Window({ 25. title: "Anchor Layout", 26. height: 400, 27. width: 400, 28. plain: true, 29. layout: 'anchor', 30. items: [panel1, panel2,panel3] 31.
7、}); 32. win.show(); 33. }); ·border·将容器分为五个区域:east,south,west,north,centerJava代码1. Ext.onReady(function() { 文档实用标准文案1. 2. var button = Ext.get('show-btn'); 3. var win; 4. 5. butt
