java - creating custom button in gwt -

After

I'm trying to do something very common with GWT - but with an image by setting the position of the text Button behavior and text above the image

I have used the html widget, but how can I not select the text?

I had the only need for a recent GWT button to add images and text Allows So I coded myself one because the already available implementation was not working. I also copy the code here:

Here is the code for your custom button

  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 increases the custom button button {Private string text; Public Custom Button () {super} (); } Public Zero Set Resources (ImageResource imageResource) {Image img = New Image (imageResource); String defined: style = img.getElement () GetAttribute ("style"); Img.getElement () SetAttribute ("Style", Defined Style + "; Vertical-Alignment: Medium;"); DOM.insertBefore (getElement (), img.getElement (), DOM.getFirstChild (getElement ())); } @ Override Public Zero Set Text {String Text} {this.text = text; Element duration = DOM.createElement ("span"); Span.setInnerText (text); Span.setAttribute ("Style", "Padding-Left: 3px; Vertical-Align: Middle;"); DOM.insertChild (getElement (), Duration, 0); } @ Override public string getText () {return this.text; }}  

UiBinder XML Definition

  ... & lt Use! - ImageBundle Definition - & gt; & Lt; Ui: field = "res" type = "com.sample.client.IDevbookImageBundle" /> ... and & lt; D: CustomButton ui: area = "buttonSave" text = "save" resource = "{} res.save" & gt; & Lt; / D: CustomButton & gt;  

Screenshots of one such button: