0

ContentPanel を作成して非表示にします。

final ContentPanel infoPanel = new ContentPanel(); 
final TabPanel infoTabPanel = new TabPanel();
...
//Adding TabItems with some forms
infoPanel.add(infoTabPanel);
infoPanel.hide();
add(infoPanel);

次に、一部のイベント リスナーで、この非表示のパネルを表示しようとします。

infoPanel.show();
infoPanel.layout();

ただし、このパネルはデータなしで表示されます。タブのデータをクリックした場合にのみ表示されます。

では、このパネルを正しく非表示/表示する方法は?

編集:

GXT 2.2.4 を使用しています。
FormPanel を含み、ContentPanel を非表示にする TabPanel で ContentPanel を作成しています。

次に、イベントリスナーでこの非表示のパネルを表示しようとしましたが、フォームなしで表示されます。タブフォームをクリックした場合にのみ表示されます。

コードは次のとおりです。

protected void onRender(Element parent, int pos) {
    super.onRender(parent, pos);
    final ContentPanel infoPanel = new ContentPanel();
    infoPanel.setAutoHeight(true);
    final TabPanel infoTabPanel = new TabPanel();
    infoTabPanel.setAutoHeight(true);

    final FormPanel testForm = new FormPanel();

    FieldSet fieldSet = new FieldSet();
    fieldSet.setHeading("Information");

    FormLayout fLayout = new FormLayout();
    fieldSet.setLayout(fLayout);

    LabelField field1 = new LabelField();
    LabelField field2 = new LabelField();

    field1.setFieldLabel("Field1:");
    field1.setName("field1");

    fieldSet.add(field1);

    field2.setFieldLabel("Field2:");
    field2.setName("field2");
    fieldSet.add(field2);
    testForm.add(fieldSet);

    TabItem formTab = new TabItem("Form Tab");
    formTab.add(testForm);
    infoTabPanel.add(formTab);

    TabItem longText = new TabItem("Long Text");
    longText.addStyleName("pad-text");
    longText.addText("Long Text" + "<br>" + "Long TextLong Text");
    infoTabPanel.add(longText);

    infoPanel.add(infoTabPanel);
    infoPanel.hide();

    Button buttonShow = new Button("show");
    buttonShow.addSelectionListener(new SelectionListener<ButtonEvent>() {
        @Override
        public void componentSelected(ButtonEvent ce) {
            infoPanel.show();
        }
    });

    Button buttonHide = new Button("hide");
    buttonHide.addSelectionListener(new SelectionListener<ButtonEvent>() {
        @Override
        public void componentSelected(ButtonEvent ce) {
            infoPanel.hide();
        }
    });

    add(infoPanel);
    add(buttonShow);
    add(buttonHide);

}
4

2 に答える 2

0

どの GXT バージョンをお持ちですか? GXT 3.x で問題を再現できません。あなたが求めていることを正確に行う小さなコード例を書きました。

public void onModuleLoad() {

    final ContentPanel infoPanel = new ContentPanel();
    final TabPanel infoTabPanel = new TabPanel();

    infoTabPanel.add(new TextButton("moo"), "moo");
    infoTabPanel.add(new TextButton("boo"), "boo");
    infoPanel.add(infoTabPanel);
    infoPanel.hide();

    VerticalLayoutContainer vlc = new VerticalLayoutContainer();
    vlc.setPixelSize(300, 250);

    TextButton buttonShow = new TextButton("show");
    buttonShow.addSelectHandler(new SelectHandler() {

        @Override
        public void onSelect(SelectEvent event) {
            infoPanel.show();
        }
    });

    TextButton buttonHide = new TextButton("hide");
    buttonHide.addSelectHandler(new SelectHandler() {

        @Override
        public void onSelect(SelectEvent event) {
            infoPanel.hide();
        }
    });

    vlc.add(infoPanel, new VerticalLayoutData(1, 1));
    vlc.add(buttonShow);
    vlc.add(buttonHide);
    RootPanel.get().add(vlc);
}
于 2013-01-30T16:33:13.833 に答える
0

なるほど、分かりました。

タブをクリックすると表示されるので、リスナーでプログラムでタブを選択してみませんか?

infoTabPanel.setSelection(formTab);

http://dev.sencha.com/deploy/gxt-2.2.5/docs/api/com/extjs/gxt/ui/client/widget/TabPanel.html#setSelection(com.extjs.gxt.ui.client. widget.TabItem)

---------以下は機能しませんでした------------

だから試してみてくださいinfoPanel.repaint();

于 2013-01-31T11:01:58.523 に答える