CellTables和css（GWT）

Question

有人可以帮我设置CellTable行的背景 拜托，我一直在努力做到这一点，并且一直都在失败 让我发疯我曾尝试使用setRowStyles()来调用它 似乎没有工作，我读过你无法改变 设置样式后，CellTable的样式 - 作为默认样式 已设定。 然后我尝试用自己的界面构建一个CellTable CellTableResources就在这个确切主题的帖子上看到但是 给了我关于未经混淆的ccs元素的错误消息....我的 css没有被混淆是一个明显的错误信息。 现在我不知道该尝试什么，我正式站稳脚跟。

我一直在读关于这个@external它似乎没有帮助...甚至不确定外部位应该去哪里...我猜在css但是像往常一样卡住了我'我正在尝试任何事情！

TonyK

Answer 1

我知道这是多么令人沮丧，我一直在同一个地方。我已经包含了我用来实现这一目标的所有步骤。但听起来你几乎就在那里，所以你可能不需要所有这些。

正如您提到的使用自己的css类名称，您必须实现 com.google.gwt.user.cellview.client.CellTable.Resources 并将您的类的实例传递给CellTable构造函数。

CellTable声明

CellTable<MyData> myCellTable = new CellTable<MyData>(10, MyResources.INSTANCE);

Resources的实现还需要 com.google.gwt.resources.client.ImageResource 和 com.google.gwt.user.cellview.client.CellTable.Style <的实例。 / em>，将提供您的css类名称的类。为简单起见，这里是Resources，ImageResource和Style的存根实现，除了提供字符串作为样式名称之外什么都不做。最后这些可以来自ClientBundle，但不是必需的。

样式存根（使用字符串文字）

import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyStyle implements Style {

    public static final MyStyle INSTANCE = new MyStyle();

    @Override public boolean ensureInjected() {

        return false;
    }

    @Override public String cellTableCell() {

        return "myCssClassName";
    }

    @Override public String cellTableEvenRow() {

        return "myCssClassName";
    }

    @Override public String cellTableEvenRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableOddRow() {

        return "myCssClassName";
    }

    @Override public String cellTableOddRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumn() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumnFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableFirstColumnHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableHoveredRow() {

        return "myCssClassName";
    }

    @Override public String cellTableHoveredRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedCell() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedRow() {

        return "myCssClassName";
    }

    @Override public String cellTableKeyboardSelectedRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumn() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumnFooter() {

        return "myCssClassName";
    }

    @Override public String cellTableLastColumnHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableLoading() {

        return "myCssClassName";
    }

    @Override public String cellTableSelectedRow() {

        return "myCssClassName";
    }

    @Override public String cellTableSelectedRowCell() {

        return "myCssClassName";
    }

    @Override public String cellTableSortableHeader() {

        return "myCssClassName";
    }

    @Override public String cellTableSortedHeaderAscending() {

        return "myCssClassName";
    }

    @Override public String cellTableSortedHeaderDescending() {

        return "myCssClassName";
    }

    @Override public String cellTableWidget() {

        return "myCssClassName";
    }

    @Override public String getName() {

        return "myCssClassName";
    }

    @Override public String getText() {

        return "myCssClassName";
    }
}

ImageResource Stub

import com.google.gwt.resources.client.ImageResource;

class MyImageResource implements ImageResource {

    public static final MyImageResource INSTANCE = new MyImageResource();

    @Override public int getHeight() {

        return 0;
    }

    @Override public int getLeft() {

        return 0;
    }

    @Override public String getName() {

        return "";
    }

    @Override public int getTop() {

        return 0;
    }

    @Override public String getURL() {

        return "";
    }

    @Override public int getWidth() {

        return 0;
    }

    @Override public boolean isAnimated() {

        return false;
    }
}

资源存根

import com.google.gwt.resources.client.ImageResource;
import com.google.gwt.user.cellview.client.CellTable.Resources;
import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyResources implements Resources {

    public static final MyResources INSTANCE = new MyResources();

    @Override public ImageResource cellTableFooterBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableHeaderBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableLoading() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSelectedBackground() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSortAscending() {

        return MyImageResource.INSTANCE;
    }

    @Override public ImageResource cellTableSortDescending() {

        return MyImageResource.INSTANCE;
    }

    @Override public Style cellTableStyle() {

        return MyStyle.INSTANCE;
    }
}

所以，此时你应该有一个没有样式的Cell Tabula Rasa，你应该能够在浏览器中检查你的CellTable元素，并将myCssClassName视为无处不在的CSS类名，不进行模糊处理。

如果此时使用其中一种传统方法链接到样式表，您应该能够将“myCssClassName”字符串设置为与您的特定样式表相对应。

样式表链接

<link href="myStyleSheet.css" rel="stylesheet" type="text/css">

现在，如果您想使用ClientBundle注入样式，则需要执行一些额外步骤。

首先，请确保您在某个时候注入样式表;这真的很容易忘记。一个简单的地方在你的模块的EntryPoint中，你可以确定它被调用。

CssResource Injection

MyClientBundle.INSTANCE.myCssResource().ensureInjected();

最后使用您的CssResource为之前的Style实现提供名称。无论CSS类名是否被混淆，都应该注入并使用正确的名称。

ClientBundle Stub

import com.google.gwt.core.client.GWT;
import com.google.gwt.resources.client.ClientBundle;

public interface MyClientBundle extends ClientBundle {

    public static final MyClientBundle INSTANCE = GWT.<MyClientBundle>create(MyClientBundle.class);

    @Override @Source("path/to/myStyleSheet.css") MyCssResource myCssResource();
}

CssResource Stub

import com.google.gwt.resources.client.CssResource;

public interface MyCssResource extends CssResource {

    @ClassName("myCssClassName") String myCssClassName();

    @ClassName("myOtherName") String myOtherCssClassName();
}

样式表存根

.myCssClassName {
    background-color: magenta;
    /* Yes, you will see when it is working. */
}

@external .myOtherName {
    background-color: yellow;
}

样式存根（使用ClientBundle）

import com.google.gwt.user.cellview.client.CellTable.Style;

public class MyStyle implements Style {

    public static final MyStyle INSTANCE = new MyStyle();

    @Override public boolean ensureInjected() {

        return false;
    }

    @Override public String cellTableCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableEvenRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableEvenRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableOddRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableOddRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumn() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumnFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFirstColumnHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHoveredRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableHoveredRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableKeyboardSelectedRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumn() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumnFooter() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLastColumnHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableLoading() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSelectedRow() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSelectedRowCell() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortableHeader() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortedHeaderAscending() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableSortedHeaderDescending() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String cellTableWidget() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String getName() {

        return MyCssResource.INSTANCE.myCssClassName();
    }

    @Override public String getText() {

        return MyCssResource.INSTANCE.myCssClassName();
    }
}

那应该是它。我确信还有其他方法可以做同样的事情但到目前为止这对我来说效果很好。祝你好运，我希望这能节省你一些时间。