DataGrid / CellTable样式问题 -- 覆盖行样式

Question

DataGrid / CellTable样式问题 -- 覆盖行样式

5

我正在努力为我的GWT 2.4 DataGrid添加样式，但每一步都遇到了阻碍。我已经为我的DataGrid添加了以下行样式：

dataTable.setRowStyles(new RowStyles<IntegrityItem>() {
  @Override
  public String getStyleNames(IntegrityItem row, int rowIndex) {
      if (row.getSomeValue() >= 100) {
        return MyResources.INSTANCE.mystyles().alertRow();
      } else {
        return "";
      }
  }
});

样式alertRow只是这个样子：

.alertEntry {
    font-weight: bold;
    color: #00ff00;
    background-color: #ff0000;
}

更多信息：我已经制作了DataGrid.css的本地副本，并从所有样式中删除了所有“background”元素，然后我使用它来构建ClientBundle：

public interface MyDataGridResources extends DataGrid.Resources {

  public static final FmeaDataGridResources INSTANCE = GWT.create(MyDataGridResources.class);

  @Override
  @Source({"../resources/styling/mydatagridstyles.css"})
  Style dataGridStyle();

}

我在我的DataGrid构造函数中使用了这个(MyDataGridResources.INSTANCE)。

当我尝试它时，符合条件的行包含绿色(#00ff00)文本，但背景颜色仍然是白色或灰色，具体取决于它是偶数行还是奇数行。为什么背景颜色会被忽略呢？首先，它从哪里获取这些颜色？！我已经完全从css文件中删除了背景颜色信息。

- Steve J

2个回答

3

请参见http://code.google.com/p/google-web-toolkit/issues/detail?id=6144#c3（这不是一个错误！）

简而言之，扩展DataGrid.Style（目的只是要有一个新类型，你不需要添加任何东西），并让你的dataGridStyle被覆盖方法返回你自己的子类型，而不是DataGrid.Style（由于返回类型协变，它会起作用）。

- Thomas Broyer

返回...类型...协变性...嗯...是时候打开Java参考了。但它起作用了！谢谢！ - Steve J

请参见 http://en.wikipedia.org/wiki/Covariance_and_contravariance_(computer_science)#Java ;-) - Thomas Broyer

自己的子类型是基本的。我忘了它，然后随机地对 datagrid 进行样式设置，让我感到很疯狂。感谢您的建议和票据参考。 - Fedy2

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Will · Accepted Answer

您可以创建一个自定义的CSS文件，并通过定义新的样式资源将其提供给DataGrid。这可以通过创建一个扩展了DataGrid.Resources的类型来完成，该类型知道您的CSS文件。然后将其传递给Datagrid的构造函数。

为了提供一个相当完整的示例，首先要创建一个新类型用于DataGrid样式。（像这样定义一个新类型只是为了在GWT中唯一标识您的样式）。

public interface MyStyle extends DataGrid.Style {
}

然后，定义一个接口，覆盖DataGrid.Resources中的dataGridStyle()方法存根。dataGridStyle方法应该返回之前定义的MyStyle。

请注意@Source注释中给出的两个元素 - 您可以在您提供的第二个文件中（此处为“ DataGridOverride.css”）覆盖默认CSS（DataGrid.css）中的任何类名。

public interface DataGridResource extends DataGrid.Resources {

  @Source({ DataGrid.Style.DEFAULT_CSS, "DataGridOverride.css" })
  MyStyle dataGridStyle();
};

构建您新样式的数据网格所需的所有步骤如下：

DataGridResource resource = GWT.create(DataGridResource.class);
    dataGrid = new DataGrid<T>(pageSize, resource)

一个微妙之处在于，当您增加被覆盖样式的优先级时，您可能需要覆盖任何其他需要更高优先级的样式，例如行悬停规则需要放在行样式规则之后。