1

サンプルレイアウト

DataGridレイアウトの 1 つでa を使用しています。を使用して結果がない場合に表示する静的テキストを正常に指定しましたsetEmptyTableWidget(Widget)。通常、次のようなものを渡しますnew HTML("No results")

しかし... ビュー ポート (つまり、ブラウザー ウィンドウの現在の表示幅) に収まらない列が多い場合、すべての列ヘッダーが表示されず、それらを表示する (右に) スクロールすることもできません。

IS データがあるときにスクロールをサポートするレイアウトがあります。ただし、データがない場合、水平スクロールバーは表示されません。この問題から抜け出す方法がわかりません。

ヒントや提案は大歓迎です。

これが私のレイアウトです...(以下の のメソッド実装で呼び出す場所がわかりますsetEmptyTableWidget) 。PagingDataTableDatGrid#initGrid(DataGridConfiguration)

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
         xmlns:gwt="urn:import:com.google.gwt.user.client.ui"
         xmlns:com="urn:import:org.spp.im.mui.gwt.client.module.common.widget.grid">

<ui:with field="res" type="org.spp.im.mui.gwt.client.resources.UiResources" />
<ui:with field="msg" type="org.spp.im.mui.gwt.shared.i18n.UiMessages" />

<!-- Layout -->
<gwt:DockLayoutPanel width="100%" height="100%" styleName="{res.style.container}" unit="PX">
    <gwt:north size="25">
        <gwt:HorizontalPanel width="100%">
            <!-- Buttons -->
            <gwt:cell horizontalAlignment="ALIGN_RIGHT">
                <com:GridButtonBar ui:field="bar" />
            </gwt:cell>
        </gwt:HorizontalPanel>
    </gwt:north>
    <gwt:center>
        <!-- Grid -->
        <com:ReadOnlyGrid ui:field="grid" width="100%" />
    </gwt:center>
    <gwt:south size="25">
        <gwt:HorizontalPanel width="100%">
            <!-- Pagination controls -->
            <gwt:cell horizontalAlignment="ALIGN_LEFT">
                    <com:CustomPager ui:field="pager" width="225px" />
            </gwt:cell>
        </gwt:HorizontalPanel>
    </gwt:south>
</gwt:DockLayoutPanel>

</ui:UiBinder>

ReadOnlyGridカスタム実装です...

public class ReadOnlyGrid extends PagingDataTableDataGrid<DataRow> {

private Set<Column<DataRow, ?>> columns = new HashSet<Column<DataRow, ?>>();

// preferred constructor in most cases
public ReadOnlyGrid() {
    super();
}

public ReadOnlyGrid(final DataGridConfiguration config) {
    super(config);
}

@Override
protected Set<Column<DataRow, ?>> allColumns() {
    return columns;
}

@Override
// first column always has default ascending sort order
public void initTableColumns(final DataGrid<DataRow> dataGrid, final DataTable table,
        final ListHandler<DataRow> sortHandler) {
    Column<DataRow, String> column;

    final int totalColumns = table.getColumnCount();
    String columnName = null;
    ColumnHints columnHints = null;
    for (int col = 0; col < totalColumns; col++) {
        final int c = col;
        columnName = table.getColumnName(c);
        columnHints = table.getColumnHints(columnName);
        if (columnHints.isVisible()) {
            column = new Column<DataRow, String>(new DataTableCell()) {

                @Override
                public String getValue(final DataRow row) {
                    String result = "";
                    if (row != null) {
                        result = row.get(c);
                    }
                    return result;
                }

            };
            column.setSortable(true);
            sortHandler.setComparator(column, new Comparator<DataRow>() {
                @Override
                public int compare(final DataRow r1, final DataRow r2) {
                    final String one = r1.get(c);
                    final String two = r2.get(c);

                    if (one == null ^ two == null) {
                        return one == null ? -1 : 1;
                    }

                    if (one == null && two == null) {
                        return 0;
                    }

                    return one.compareToIgnoreCase(two);
                }
            });
            final String header = columnHints.getColumnHeader() == null ? columnName : columnHints.getColumnHeader();
            // create the column header
            // header should have the same alignment as the column data
            dataGrid.addColumn(column, createHeader(header, columnHints.getColumnAlignment()));
            // keep track of columns added
            allColumns().add(column);

            // Set the column width
            dataGrid.setColumnWidth(column, columnHints.getColumnWidth(), Unit.PX);

            // Set the column alignment
            if (columnHints.getColumnAlignment() != null) {
                column.setHorizontalAlignment(columnHints.getColumnAlignment());
            }
            else {
                column.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_RIGHT);//default
            }

            if (c == 0) {
                dataGrid.getColumnSortList().push(column);
            }
        }

    }

}

@Override
protected void initTableRows(final DataTable table) {
    setDataList(table.allRows());
}

private SafeHtml createHeader(final String columnHeaderHtml, HasHorizontalAlignment.HorizontalAlignmentConstant columnHeaderAlignment) {
    columnHeaderAlignment = columnHeaderAlignment == null ? HasHorizontalAlignment.ALIGN_RIGHT : columnHeaderAlignment;
    final String ch = replaceCrWithBr(columnHeaderHtml);
    final SafeHtmlBuilder sb = new SafeHtmlBuilder();
    sb.appendHtmlConstant("<div align=\"" + columnHeaderAlignment.getTextAlignString() + "\">")
    .appendHtmlConstant(ch).appendHtmlConstant("</div>");
    final SafeHtml header = sb.toSafeHtml();
    return header;
}

private String replaceCrWithBr(final String value) {
    String result = value;
    if (value.contains(App.INSTANCE.carriage_return())) {
        result = value.replace(App.INSTANCE.carriage_return(), App.INSTANCE.separator());
    }
    return result;
}

}

そしてPagingDataTableDataGrid...

public abstract class PagingDataTableDataGrid<T extends DataRow> extends Composite {

private DataGrid<T> dataGrid;
private ListDataProvider<T> dataProvider;
private ResizeLayoutPanel wrapper;

// default, use in UiBinder template when you just want to @UiField inject a subclass
public PagingDataTableDataGrid() {
    this(new DefaultDataGridConfiguration());
}

// alternate, use in UiBinder template when you want to create an instance
// yourself, user to inject w/ @UiField(provided=true)
public PagingDataTableDataGrid(final DataGridConfiguration config) {
    wrapper = new ResizeLayoutPanel();
    wrapper.setWidth("100%");
    wrapper.setStyleName(UiResources.INSTANCE.style().gridWrapper());
    initWidget(wrapper);
    initGrid(config);
}

private void initGrid(final DataGridConfiguration config) {
    dataGrid = new DataGrid<T>(config.getPageSize(), config.getResources());
    final HTML noResults = new HTML(UiMessages.INSTANCE.no_results());
    dataGrid.setEmptyTableWidget(noResults);
    wrapper.clear();
    wrapper.add(dataGrid);
}

public void setInput(final DataTable table) {
    resetTableColumns();
    dataProvider = new ListDataProvider<T>();
    dataProvider.setList(new ArrayList<T>());
    final ListHandler<T> sortHandler = new ListHandler<T>(dataProvider.getList());
    dataGrid.addColumnSortHandler(sortHandler);
    initTableColumns(dataGrid, table, sortHandler);
    initTableRows(table);
    dataProvider.addDataDisplay(dataGrid);

    // trigger sort client-side
    ColumnSortEvent.fire(dataGrid, dataGrid.getColumnSortList());

    GridUtil.setStyles(this.dataGrid);
}

protected abstract Set<Column<T, ?>> allColumns();

// see
// http://stackoverflow.com/questions/3772480/remove-all-columns-from-a-celltable
// concrete classes are forced to maintain a handle on all columns added
private void resetTableColumns() {
    for (final Column<T, ?> column : allColumns()) {
        dataGrid.removeColumn(column);
    }
    allColumns().clear();
}

/**
 * Add columns to this grid
 * 
 * @param dataGrid
 *            a GWT DataGrid implementation
 * @param table
 *            the model data
 * @param sortHandler
 *            a GWT ListHandler implementation
 */
protected abstract void initTableColumns(DataGrid<T> dataGrid, DataTable table, ListHandler<T> sortHandler);

/**
 * Add rows to this grid
 * @param table the model data
 */
protected abstract void initTableRows(DataTable table);

protected void setDataList(final List<T> dataList) {
    final List<T> list = dataProvider.getList();
    list.addAll(dataList);
    dataProvider.refresh();
}

public DataGrid<T> getDataGrid() {
    return dataGrid;
}

}
4

2 に答える 2

1

したがって、「ハック」として、の幅にめちゃくちゃ大きなピクセル値を使用することで、必要な動作を得ることができましたWidget

例えば、

Label noResults = new Label("No results");
noResults.setWidth("20000px");

これには、ラベルのテキストを列ヘッダーの下の中央に配置するのではなく、左端までプッシュする効果があります。しかし、私はそれで生きることができます、b/c列ヘッダーはスクロール可能です。

于 2013-03-11T00:37:28.180 に答える
0

コードに問題はありません。これは、gwtによって設計されたとおりです。データがないのになぜスクロールが表示されるのですか。datagridを操作するときにも同様の疑問がありましたが、データがないときにスクロールを提供することは意味がありません。

于 2013-03-06T04:54:32.977 に答える