如何在CellTable Gwt中设置ButtonCell样式？

如何在CellTable Gwt中设置ButtonCell样式？如何在CellTable Gwt中设置ButtonCell样式？

我搜索互联网&上发现2个解决方案：

- 溶液1：使用urColumn.setCelLStyleNames("yourStyleName");（Adding style to a ButtonCell）

ButtonCell nextStepButton=new ButtonCell(); 
Column<String[], String> nextStepColumn = new Column<String[], String>(nextStepButton) { 

     @Override 
     public String getValue(String[] oneOrder) { 
      return oneOrder[11]; 
     } 
}; 
nextStepColumn.setCellStyleNames(getView().getRes().css().buttonCell());

在CSS

.gwtButton, .buttonCell.getButton { 
    margin: 0; 
    padding: 5px 7px; 
    text-decoration: none; 
    cursor: pointer; 
    cursor: hand; 
    font-size:small; 
    background: black; 
    border:1px solid #bbb; 
    border-bottom: 1px solid #a0a0a0; 
    border-radius: 3px; 
-moz-border-radius: 3px; 
    color: white; 

}

我试过，但什么都没有发生。

-Solution2：修改扣式（https://code.google.com/p/google-web-toolkit/issues/detail?id=7044）

   ButtonCell nextStepButton=new ButtonCell(){ 
        // A native button cell doesn't have the gwt-button class, which makes it 
         // look weird next to other gwt buttons. Fix that here. 
         @Override 
         public void render(
          final Context context, 
          final SafeHtml data, 
          final SafeHtmlBuilder sb) { 
         sb.appendHtmlConstant("<button type=\"button\" class=\"gwt-Button\" tabindex=\"-1\">"); 
         if (data != null) { 
          sb.append(data); 
         } 
         sb.appendHtmlConstant("</button>"); 
         } 
       };

的溶液2，我可以看到的差（即扣式的风格得到了改变）。但是，我没有“gwt-Button”css类，但只有“gwtButton”css类（请参阅上面的css）。但是，当我在第二个代码sb.appendHtmlConstant("<button type=\"button\" class=\"gwtButton\" tabindex=\"-1\">");中将“gwt-Button”更改为“gwtButton”时，则什么也没有发生。

那么，如何样式的纽扣电池，以便它可以拿起gwtButton css class

来源

2013-10-23 Tum

如果发布的代码是什么，你必须在你的页面，你有一个错误的选择，除非你复制的时候做了一个错误对你的问题。

尝试.buttonCell.gwtButton
或更改.buttonCell.getButton改变.buttonCell.getButton只有.gwtButton

将帖子

好吧，我看到错误，你的风格设置的容器按钮，所以你必须改变你的选择器。使用在你的CSS资源这一个：

.gwtButton button { 
    margin: 0; 
    padding: 5px 7px; 
    ... 
}

来源

2013-10-23 08:13:55

您好马诺洛，谢谢你的回答。我尝试了.buttonCell.gwtButton，但没有发生任何事情。我改为.gwtButton，然后样式适用于整个单元而不是单元格内的按钮，这是不正确的。我只想单元格内的按钮获得“gwtButton”风格。你可以在http://i.stack.imgur.com/w9LJt.png看到错误风格的图片。 – Tum

你能像在开发工具或萤火虫控制台中看到的那样发布html代码吗？ –

嗨马诺洛，你的意思是实际的HTML/Javascript代码？这里是上述代码的查看源代码（http://i.stack.imgur.com/WyiFk.png）。请告诉我，如果你的意思是别的。 – Tum

什么工作对我来说是创建一个自定义按钮Cell类（比方说，对于StyledButtonCell例如）延伸扣式，并推翻渲染方法合我的胃口。在我的下面的示例中，我指定了一个基本的引导按钮样式，并使用一个附加的图标来使用按钮文本。用于自定义按钮细胞类

示例代码（从基扣式类派生）：

public class StyledButtonCell extends ButtonCell{ 
/** 
    * Construct a new StyledButtonCell that will use a {@link SimpleSafeHtmlRenderer}. 
    */ 
    public StyledButtonCell() { 
    super(SimpleSafeHtmlRenderer.getInstance()); 
    } 

    @Override 
    public void render(Context context, SafeHtml data, SafeHtmlBuilder sb) { 
    sb.appendHtmlConstant("<button class=\"btn btn-default\" type=\"button\" tabindex=\"-1\">"); 
    sb.appendHtmlConstant("<i class=\"fa fa-refresh\"></i>"); 
    if (data != null) { 
     sb.append(data); 
    } 
    sb.appendHtmlConstant("</button>"); 
    }

}

样品参照StyledButtonCell同时限定GWT表/列：

... new Column<XYZClass, String>(new StyledButtonCell()) { 
     @Override 
     public String getValue(XYZClass object) { 
      return "buttonText_goes_here"; 
     }

来源

2017-02-23 22:46:11 PrithvirajVasanth

如何在CellTable Gwt中设置ButtonCell样式？

回答

相关问题