添加图标在GWT的按钮(Adding icons to an button in gwt)

我有按钮，并要设置它的图标，它里面的文本一起 。 他们是无属性添加图标按钮像SmartGWT的..任何想法如何实现它，请帮助。

Answer 1:

有实现的许多方面。

方法1：简单的方法

只需设置通过代码的背景图像。 myButton.getElement().getStyle().setBackgroundImage("path");

方式2：另一个简单的方法

设置自己的HTML myButton.setHtml("Pass the html string");

方式三：轻松，但提供了更多的控制

myButton.addStylename("buttonStyle")

使用CSS样式这个

.buttonStyle{
color : red;
}

方式4：根据我的最佳方式

创建您自己的劈扣它包裹一个flowpanel或horizo​​ntalPanel ，用图像作为第一配件和按钮，您的另一部件。 这给你的图像和更多的控制以及按钮。 你可以对你的形象单击处理以及按钮，你可以单独他们的风格中的每一个。

Answer 2:

这是我怎么实现的设置我的GET一个图标：按钮。

添加一个额外的样式类挂钩，矿井下面BTN-FA组到您的GWT按钮。 如果您使用属性“addStyleNames”你可以在你的样式表中定义它们，并有多个类。

<g:Button text=" Post Your Answer" enabled="false" ui:field="showPostButton" addStyleNames="btn btn-default btn-fa-group" />

现在，在你的CSS定义如下声明：

btn-fa-group:before {
    color: #333333;
    content: "\f0c0";
    display: inline-block;
    font-family: "fontawesome";
}

一些重要的事情需要注意; 选择之前不要忘记，确保统一以斜杠开始，已经fontAwesome安装。 另外，如果您已经安装的字体，你可以用另一种字形图标。

Answer 3:

您可以设置的innerHTML与按钮即图像

 Button button=new Button("<image src='abc.jpg' width='200px' height='300px' />Ok");

Answer 4:

Button bt = new Button();

bt.getElement().getStyle().setBackgroundImage("url('path/to/ur/image/imagename.extention')");

还设置背景图像的WRT大小按钮的尺寸

bt.getElement().getStyle().setProperty("backgroundSize","30px");

Answer 5:

添加CSS类的按钮probalby最好的解决方案。

button.addStyleName（ “ButtonIcon”）;

如何定义CSS和HTML你可以阅读这里 。

Answer 6:

是的，你可以.Gwt有SmartGwt称为类型按钮push buttopn

com.google.gwt.user.client.ui.PushButton

您可以将图片对象作为下面

Image  image = new Image(GWT.getModuleBaseURL() + "/images/search-arrow.png");
RootPanel.get().add(new PushButton(image));

文章来源: Adding icons to an button in gwt