What the easiest way to add a image to my GWT application

Question

I have .jpg file that I want to display. I have some Horizontal and Vertical panels and I would like to have it somewhere in there. It is a fairly large image but I would like to make a class or an object that will scale it down for me.

My first thought was to just put it in a Horizontal Panel like so but that does not seem to work as I intended

HorizontalPanel picturePanel = new HorizontalPanel();
picturePanel.setPixelSize(600, 300);
picturePanel.addStyleName("pic");

Css.css

.pic
{
    background: url(images/mypic.jpg);
    height: auto;
    width: auto;
}

I'd like to set the pixel size of an object (panel) and add an image to that panel so that it fits within the bounds (while making sure the ratio is the same as in the picture) so I can programatically add it to a panel somewhere.

score 6 · Answer 1 · answered May 02 '13 at 06:06

6

public interface MyResources extends ClientBundle {

MyResources INSTANCE = GWT.create(MyResources.class);

@Source("logo.png")
ImageResource logo();
}

in your view class

Image logo = new Image(MyResources.INSTANCE.logo());

add image to panel; set resolution to your panel and also set the same to your image by using

setPixelSize(int,int);

answered May 02 '13 at 06:06

Ashok

587
1
4
5

this does not seem to scale the image to the size. I have a large image and I am trying to fit it into a smaller frame (but not much) and it doesnt work (i.e if i set pixel size 300, 300, i only see 300, 300 pixels of the actual image – bubbles May 02 '13 at 17:24

score 1 · Accepted Answer · edited Mar 20 '14 at 18:21

1

This works:

Image image = new Image();

Image.setWidth("100px");

image.setUrl('http://127.0.0.1:8888/images/accounts.png');

Loads image form local server and will limit size of image.

edited Mar 20 '14 at 18:21

fiz

906
3
14
38

answered May 03 '13 at 10:19

Hein B

67
4

i do not understand this. image.setUrl(slide.getFileImageUrlSmall()); what is slide? – bubbles May 04 '13 at 23:07
Removed getFileImageUrlSmall() and replaced it with a direct reference to an image i.e. string URL. – Hein B May 07 '13 at 09:04

What the easiest way to add a image to my GWT application

2 Answers2