21

How do I add image to GWT Button or how do I use Mosaic's Buttons to add image. I can't figure out how to use THIS example in my code. What library do I need to add. I have Mosaic Library in my project and I can use it but the example that they have there does not work for me.

Thanks

Maksim
  • 16,635
  • 27
  • 94
  • 135
  • What code have you tried, and what is the result? – CPerkins Sep 22 '09 at 01:11
  • If you want to have image and text then I probably created what you want. I wrote a post on this SO question: http://stackoverflow.com/questions/1853042/creating-custom-button-in-gwt/2449019#2449019 – Juri Mar 15 '10 at 17:25
  • GWT oficial sample: http://gwt.googleusercontent.com/samples/Showcase/Showcase.html#!CwCustomButton – Zaur_M Jan 23 '13 at 05:44

5 Answers5

26

If you just want to add an image to a normal GWT Button, then PushButton is the way to go:

PushButton pushButton = new PushButton(new Image("test.png"));
Igor Klimer
  • 15,321
  • 3
  • 47
  • 57
24

PushButton does not have the same behavior, and you have a prettier solution than creating yourself an image tag :

Image img = new Image("whatever.jpg");
Button button = new Button();
button.getElement().appendChild(img.getElement());
Michael
  • 241
  • 2
  • 2
4

Alternatively, you this method. 

Button editRow = new Button("Edit Row");
editRow.setHTML(("<img border='0' src='rowEdit.Png' />");

I have found the the PushButton appears to have a problem with calculating its x, y click point correctly, which the normal button does not have.

Robin
  • 41
  • 1
3

Just use CSS and style in the image. Something like this should make the image appear before the button text:

background-image: url("/yourimage.png");
background-repeat:  no-repeat;
height: 20px;
width:      20px;
athspk
  • 6,722
  • 7
  • 37
  • 51
David Parish
  • 111
  • 7
1

Just set the HTML img tag inside the button as:

Button btn = new Button("<img src='image.png'/>");
Firas Sabbah
  • 21
  • 2