解像度に依存しないGWTアプリケーションをコーディングするには？

Question

アプリケーションの解像度を独立させる最も良い方法は、http://www.sencha.com/helpcenter/index.jsp?topic=/com.extjs.gxt.help/html/reference/layouts/fitlayout.htmlに記載されているような適切なレイアウトを使用することです。しかし、例で使用されるように、それはパネル寸法が良く、我々は以下のようにブラウザウィンドウで見ることができるものを超えているようです：

コードは以下の通りです、IndexPageは、幅/高さのある複合体であります以下のようにコンポーネントをレンダリングします。

public class Gallery implements EntryPoint { 
public void onModuleLoad() { 

    Viewport v = new Viewport(); 
    v.setLayout(new FitLayout()); 

    v.add(new IndexPage(), new FitData(5)); 

    RootPanel.get().add(v); 

    } 
} 

この問題にアプローチするにはどうすればよいでしょうか？

Answer 1

インデックスページ自体が大きすぎてビューポートに収まりません。だから何をすべきか？オーバーフロー/非表示またはスクロールしかできません。デフォルトではオーバーフローしますが、setScrollModeを使用して変更できます。

代わりに、IndexPageを小さくすることです。どうやって？通常、ページ内のどこかにスクロールを追加することができます（たとえば、左パネルと右パネルを個別にスクロールできるようにするなど）。魔法の自動検出はありません。スクロールバーをどこに配置するか（またはコンテンツをオーバーフローさせる）、手動でScrollContainersを設定する必要があります。次に、これらの要素に100％の高さを与えることができます（親コンテナ内のFitLayoutを使用して）空の領域を埋めることができます。

Answer 2

一つの解決策は非常に簡単です...あなたは、ウィジェットの外ScrollPanelをラップすることができます：

public class Gallery implements EntryPoint { 
public void onModuleLoad() { 

Viewport v = new Viewport(); 
v.setLayout(new FitLayout()); 

ScrollPanel sp = new ScrollPanel(); 
sp.setHeight("100%"); 
sp.setWidget(new IndexPage()); 

v.add(sp, new FitData(5)); 

RootPanel.get().add(v); 

} 

だから、あなたはスクロールバーを得るでしょう。