dojo - BorderContainer で構造を試す (道場)

Question

写真のようなBorderContainerが欲しいのですが、ContentPaneを上に2つ、下に1つにしたいのですが、リージョンでそれができないので、どうすればいいのかわかりません。地域。

ありがとうございました

Answer 1

ウィンドウのサイズを変更するときにペインをどのようにスケーリングするかによって少し異なります。下部ペインにすべての余分な高さを適用しますか? 上部の 2 つのペインの幅を 50/50 のままにしますか?

スペースの分割を幅と高さの両方で 50/50 のままにしたいと仮定すると、次のようにすることができます。

<div data-dojo-type="dijit/layout/BorderContainer">

    <div data-dojo-type="dijit/layout/ContentPane" 
         data-dojo-props="region: 'leading'" 
         style="width: 50%">leading</div>

    <div data-dojo-type="dijit/layout/ContentPane" 
         data-dojo-props="region: 'center'">center</div>

    <div data-dojo-type="dijit/layout/ContentPane" 
         data-dojo-props="region: 'bottom'" 
         style="height: 50%">bottom</div>
</div>

通常、ウィンドウのサイズを変更すると、中央の領域がすべての余分なスペースを取得しますが、先頭/上部/末尾/下部領域に相対的な幅/高さを設定して、それらが常に画面のそのシェアを使用するようにすることができます。