Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

GWT client-side image crop and resize

Tags:

gwt

Is there any GWT widget which allows me to:

  • select a part of an image and then retrieve the selection area?
  • resize an image and then give me the updated size?

The above should be reflected in the browser as well.

like image 845
Robert Munteanu Avatar asked Jun 12 '09 12:06

Robert Munteanu


4 Answers

As far as I know, GWT client-side code cannot directly modify images, but the Image widget can be set to display only a portion of an image. You can do this using the constructor Image(java.lang.String url, int left, int top, int width, int height), where width and height are the dimensions of the visible box and not the image itself.

However this does not allow you to resize and then crop. In order to do this you could first resize the image then put it in an absolute panel to crop it.

AbsolutePanel testPanel = new AbsolutePanel();
Image image = new Image("path/image.jpg");
image.setWidth("1000px");
testPanel.add(image,-100,-100);
testPanel.setPixelSize(300,300);

I apologize if this isn't exactly what you're looking for, but it's the best answer I have.

like image 95
DLH Avatar answered Oct 18 '22 15:10

DLH


You can also load the image type as a DataResource instead of ImageResource if you want it to scale with setPixelsSize()

e.g.

...

@Source("uploading.gif")
DataResource uploadingIcon();

...

Image uploadingGif = new Image(RESOURCE.uploadingIcon().getUrl());
uploadingGif.setPixelSize(25, 25);
like image 35
Istinra Avatar answered Oct 18 '22 14:10

Istinra


Here is how I use the canvas element to scale images using HTML5.

like image 22
Brandon Avatar answered Oct 18 '22 16:10

Brandon


Thanks ImageResource have same method getURL() i used it worked for me.. try this it will work we can use now Images in both ways either as URL path or ImageResource..

like image 29
JAVAC Avatar answered Oct 18 '22 16:10

JAVAC