0

GWTを使用してプログラムで重要なUIを正常に構築した後、UiBinderを使用して同じUIを再作成しようとしています。私はこれまでいかなる種類の宣言型UIシステムも使用したことがなく、進歩を遂げており、そのようなアプローチの利点を確認できますが、DecoratorPanelでStackLayoutPanelを正しくラップすることができません。

StackNavigator.java

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Widget;

public class StackNavigator extends Composite {

    private static StackNavigatorUiBinder uiBinder = GWT.create(StackNavigatorUiBinder.class);

    interface StackNavigatorUiBinder extends UiBinder<Widget, StackNavigator> {}

    public StackNavigator() {
        initWidget(uiBinder.createAndBindUi(this));
    }

}

StackNavigator.ui.xml

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui" xmlns:bandmates="urn:import:org.redboffin.bandmates.client">

    <ui:style>  
        .gwt-DecoratorPanel {
            width: 200px;
            height: 200px;
        }
        .gwt-DecoratorPanel .middleCenter {
            height: 100%;
            width: 100%;
        }
    </ui:style>

    <g:DecoratorPanel>
        <g:StackLayoutPanel unit='PX'>
            <g:stack>
                <g:header size='20'>Item One</g:header>
                <g:Label>TODO : Item One List Widget</g:Label>
            </g:stack>
            <g:stack>
                <g:header size='20'>Item Two</g:header>
                <g:Label>TODO : Item Two List Widget</g:Label>
            </g:stack>
             <g:stack>
                <g:header size='20'>Item Three</g:header>
                <g:Label>TODO : Item Three List Widget</g:Label>
            </g:stack>
        </g:StackLayoutPanel> 
    </g:DecoratorPanel>

</ui:UiBinder>

DecoratorPanelにラップされていない場合、StackLayoutPanelは期待どおりに表示および機能します。DecoratorPanelでラップされている場合、StackLayoutPanelは表示されません。その代わりに小さな青い円があります。これは、DecoratorPanelのコーナーグラフィックがしっかりと束ねられていると思います。これが、GWT APIで提案されているように、DecoratorPanelで幅と高さを設定し、中央の領域を100％に設定しようとした理由です。

それは私が期待することをしないので、私はここで何かを誤解しているに違いありません。誰か助けてもらえますか？

ありがとうございました ：-）

4

2 に答える 2

4

LayoutPanelは、ProvidesResizeを提供するもの、本質的にはある種の別のLayoutPanelに含まれていない場合、うまく機能しません。DecoratorPanelはLayoutPanelではなく、LayoutPanelを含むことを意図したものではありません。

この問題は、UiBinderがなくても発生します。これは、宣言方法の問題ではありません。

于 2010-01-06T22:47:16.183 に答える
2

そのサブクラスの実装であるこのDecoratorLayoutPanelクラスを試してください。したがって、フレームワークと互換性があり（とは異なり）、正しくラップする必要があります。DecoratorPanelLayoutPanelLayoutPanelDecoratorPanelStackLayoutPanel

（免責事項：コードは自由に寄付され、ライセンスの制限はありません。非営利のブログである私のブログhttp://hkwebentrepreneurs.comでホストされています。）

アップデート：

説明として、このクラスは、9つのウィジェットをそれ自体に追加し、それらを3x3グリッドに配置することにより、DecoratorLayoutPanelGWTを模倣します。DecoratorPanel最も外側の8つのウィジェットはDecoratorPanel、の丸みを帯びた角を使用してCSSスタイルであり、デフォルトのサイズは5pxです。1つの中央ウィジェットは拡張可能であり、LayoutPanelコンテンツを保持するために使用されます。

利点は、のと同じ丸みを帯びた角の効果が得られると同時に、子としてDecoratorPanel任意のものを追加でき、LayoutPanelそれに合わせて自動的にサイズが変更されることです。

于 2012-01-01T17:50:35.760 に答える