4

GXT（GWT-Ext）RadioGroupまたはCheckBoxGroupの要素を、単一の列（Orientation.VERTICAL）または単一の行（Orientation.HORIZONTAL）以外のレイアウトでレンダリングする方法を探しています。ExtJS 3.0では、RadioGroupsとCheckBoxGroupsが複数の列に簡単にレンダリングされることがわかります。ただし、GXTでは構成にアクセスできないようです。ここに欠けているものはありますか？「単純な」解決策がない場合、RadioGroupまたはCheckBoxGroupのカスタムレンダラーを作成する方法はありますか？

4

5 に答える 5

1

com.extjs.gxt.ui.client.widget.form.CheckBoxGroupAPIページcom.extjs.gxt.ui.client.widget.form.MultiFieldで言うことを継承します

1つの行または列に複数のフィールドを表示するフィールド。

したがって、「単純な」ソリューションに関しては、運が悪いと思います。チェックボックスを使用すると、複数のCheckboxGroupsとhbox / vboxまたは列のレイアウトで偽造できると思いますが、Radioをグループ化する方が意味があるため（相互に排他的であるという点で）、複数のRadioGroupでは機能しないと思います。

于 2010-01-09T20:38:45.807 に答える
1

GridCellRendererグリッドの各列に実装でき、各列はラジオグループの選択に対応します。これは GXT で機能します。

public class MyRenderer implements GridCellRenderer {
    public Radio render(ModelData model, String columnChoice, ColumnData config,
            int rowIndex, int colIndex, ListStore store, Grid grid) {

        Something something = ((Something) model).getSomething();
        Radio radio = new Radio();
        // we want one radioGroup per row:
        radio.setName("radioButton" + rowIndex);
        // set value depending on some property in the model corresponding to a
        // column
        if (something != null && something.getChoice().equals(columnChoice)) {
            radio.setValue(true);
        }
        return radio;
    }
}
于 2010-01-23T23:36:34.307 に答える
0

これは、クラスのコンストラクターの簡単な例であり、MultiField< CheckBox > クラスを拡張する必要があります。 

public MyClass (String[] items, int columnsNumber) {
    setOrientation(Style.Orientation.HORIZONTAL);
    setSpacing(0);

    if (items != null) {
        final CheckBoxGroup[] columns = createColumns(columnsNumber);
        int i = 0;
        for (String item : items) {
            CheckBox check = new CheckBox();
            check.setBoxLabel(item);
            columns[i++ % columnsNumber].add(check);
            CLogger.info("Checkbox added for: " + item);
        }
        for (CheckBoxGroup column : columns) {
            add(column);
        }
    }
}

private CheckBoxGroup[] createColumns(int columnsNumber) {
    CheckBoxGroup[] columns = new CheckBoxGroup[columnsNumber];
    for (int i = 0; i < columns.length; i++) {
        columns[i] = new CheckBoxGroup();
        columns[i].setOrientation(Style.Orientation.VERTICAL);
        columns[i].setSpacing(0);
    }
    return columns;
}

それはあなたがしたいですか？

于 2011-10-18T08:27:45.367 に答える
0

その質問は2歳であることは知っていますが、解決策を見つけました:-)。ポイントは、RadioButton ではなく Radio をパネルに追加することです。いくつかの例:

    final RadioGroup outputType = new RadioGroup("outputType");

    Radio pdf = new Radio();
    Radio docx = new Radio();
    Radio rtf = new Radio();
    Radio ods = new Radio();

    outputType.add(pdf);
    outputType.add(docx);
    outputType.add(rtf);
    outputType.add(ods);

    //this goes
    panel.add(pdf);
    panel.add(docx);
    panel.add(rtf);
    panel.add(ods);

    //instead of this
    panel.add(outputType);

誰にでも役立つことを願っています:)

于 2011-02-10T21:13:49.767 に答える
0

あなたが探しているアイテムの最終的な分布を知らなければ、これがうまくいくかどうかわかりません。ただし、次のことを考えたことはありますか? 大きな RadioGroup または CheckBoxGroup を作成し、必要に応じて個々のラジオ ボタン/チェックボックスを非表示にして、必要なパターンを取得しますか?

複数の列を探している場合、たとえば 3 つの列にそれぞれ 4 つのボタンがある場合は、4 つのボタンの 3 つのグループを並べて使用します。次に、グループごとに OnClick() または OnSelect() イベントを記述し (存在すると仮定)、3 つのグループを 1 つのグループとして管理します。一度に 1 つのラジオボタンのみを選択する必要があるため、これはチェックボックスの場合は簡単ですが、ラジオボタンの場合は少し複雑になります。

 R-1  R-2  R-3
+---++---++---+
| o || o || o |
| o || o || o |
| o || o || o |
| o || o || o |
+---++---++---+

// psudocode

form.onLoad()
{
   r1.selected = none;
   r2.selected = none;
   r3.selected = none;
   selection = none;
}

r1.OnClick()
{
   selection = r1.selected;
   r2.selected = none;
   r3.selected = none;
}

r2.OnClick()
{
   r1.selected = none;
   selection = r2.selected;
   r3.selected = none;
}

r3.OnClick()
{
   r1.selected = none;
   r2.selected = none;
   selection = r3.selected;
}
于 2010-01-14T23:13:19.870 に答える