我正在尝试做一些与 GWT 很常见的事情 - 通过将文本放置在图像顶部来创建带有图像和文本的按钮行为。
我已经使用了 HTML
小部件,但我怎样才能使文本不可选?
最佳答案
我最近同样需要一个允许添加图像和文本的 GWT 按钮。所以我自己编写了一个,因为已经可用的实现不起作用。我 wrote a post on my blog但我也在这里复制代码:
这是我的自定义按钮的代码
import com.google.gwt.resources.client.ImageResource;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.Image;
public class CustomButton extends Button {
private String text;
public CustomButton(){
super();
}
public void setResource(ImageResource imageResource){
Image img = new Image(imageResource);
String definedStyles = img.getElement().getAttribute("style");
img.getElement().setAttribute("style", definedStyles + "; vertical-align:middle;");
DOM.insertBefore(getElement(), img.getElement(), DOM.getFirstChild(getElement()));
}
@Override
public void setText(String text) {
this.text = text;
Element span = DOM.createElement("span");
span.setInnerText(text);
span.setAttribute("style", "padding-left:3px; vertical-align:middle;");
DOM.insertChild(getElement(), span, 0);
}
@Override
public String getText() {
return this.text;
}
}
使用 UiBinder XML 定义
...
<!-- ImageBundle definition -->
<ui:with field="res" type="com.sample.client.IDevbookImageBundle" />
...
<d:CustomButton ui:field="buttonSave" text="Save" resource="{res.save}"></d:CustomButton>
这样一个按钮的截图:
关于java - 在 gwt 中创建自定义按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1853042/