|
|
復(fù)制代碼 代碼如下:
Ext.onReady(function(){
new Ext.Panel({
renderTo:"hello",
width:400,
height:200,
layout:"column",
items:[{columnWidth:.5,
title:"面板1"},
{columnWidth:.5,
title:"面板2"}]
});
});
上面的代碼我們創(chuàng)建了一個(gè)面板Panel，Panle是一個(gè)容器組件，我們使用layout指定該面板使用Column布局。該面板的子元素是兩個(gè)面板，這兩個(gè)面板都包含了一個(gè)與列布局相關(guān)的配置參數(shù)屬性columnWidth，他們的值都是0.5，也就是每一個(gè)面板占一半的寬度。執(zhí)行上面的程序生成如下圖所示的結(jié)果：
Ext中的一些容器組件都已經(jīng)指定所使用的布局，比如TabPanel使用card布局、FormPanel使用form布局，GridPanel中的表格使用column布局等，我們?cè)谑褂眠@些組件的時(shí)候，不能給這些容器組件再指定另外的布局。
ExtJS2.0一共包含十種布局，常用的布局有border、column、fit、form、card、tabel等布局，下面我們分別對(duì)這幾種布局作簡(jiǎn)單的介紹。
JavaScript技術(shù)：ExtJS 2.0 實(shí)用簡(jiǎn)明教程之布局概述，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
