如何设置作为图像列（GWT）呈现的ClickableTextCell列的样式？

我想在Celltable中有一个图像列。我不想使用ImageResource来做这件事，因为它的图像位置有问题&我不能使用

setFieldUpdater

。因此，我使用了“

ClickableTextCell列，该列被渲染为图像列”

，如下所示：

     String[] msg={"12","love","image/icon/delete.jpg"}
     Column<String[], String> deleteColumn=new Column<String[], String>(new ClickableTextCell(){

            public void render(Context context, 
                    SafeHtml value, 
                    SafeHtmlBuilder sb)
             {

                sb.appendHtmlConstant("<img width=\"20\" src=\""
                                        + value.asString() + "\">");
             }

     }){

            @Override
            public String getValue(String[] object) {
                // TODO Auto-generated method stub
                return object[3];
            }

     };

     deleteColumn.setCellStyleNames(getView().getRes().css().gwtCellImage());

deleteColumn

显示了图像，但当我将鼠标移到它上面时，图像没有变成红色

所以我觉得我做错了什么

---

你能告诉我怎么修吗？

你的手机里没有按钮。将

按钮

替换为

img

基于Andrei的提示，我想出了一个在CellTable中创建ImageColumn的解决方案。我相信这是制作ImageColumn最简单的方法：

因此，甚至不需要

覆盖渲染

，只需为imageColumn创建一个简单的ClickableTextCell&然后设置

背景图像

。它会表现得很好

     String[] msg={"12","love",""}; //just put empty String value for the column 
     Column<String[], String> deleteColumn=new Column<String[], String>(new ClickableTextCell()){

            @Override
            public String getValue(String[] object) {
                // TODO Auto-generated method stub
                return object[3];
            }

     };

     deleteColumn.setCellStyleNames(getView().getRes().css().gwtCellImage());

---

非常感谢安德烈。您的答案并不是完整的，但关键的一点是，我要用一种更优雅、非常简单的方法，使用“背景图像”策略创建ImageColumn。毫无疑问，互联网上的ImageColumn提到了这种技术。我希望我的回答能帮助其他人。

     String[] msg={"12","love",""}; //just put empty String value for the column 
     Column<String[], String> deleteColumn=new Column<String[], String>(new ClickableTextCell()){

            @Override
            public String getValue(String[] object) {
                // TODO Auto-generated method stub
                return object[3];
            }

     };

     deleteColumn.setCellStyleNames(getView().getRes().css().gwtCellImage());

.gwtCellImage{
    background-image:url('/images/icon/delete.png');    
}

.gwtCellImage:hover{
    background-image:url('/images/icon/deleteRed.png'); 
} 

.gwtCellImage, .gwtCellImage:hover{
    background-size:16px 16px;
    background-position:center;
    background-repeat:no-repeat;
    cursor: pointer;
    cursor: hand;
}