Scrollbar not working until browser resize

[srodrigue]

Hello, I'm using the following version:
SmartClient Version: v8.2p_2012-10-24/EVAL Deployment (expires 2012.12.23_06.26.15) Licensed to: Isomorphic Software (#ISC_EVAL_NIGHTLY) with Firefox 16.0.2 and Firebug.

See attached source files. The ImageViewer.java extends a DynamicForm displaying an image from a DataSource.

In my case, the loaded image is larger than the ViewFileItem container, so the scrollbar should be active, but they are grayed out at first. I have to resize the browser window to trigger something that make the scrollbar activate correctly. What is the solution ?

[Isomorphic]

The size of the image won't be known until it has been loaded.

You can use the core GWT Image API to detect when the image has been loaded, and call adjustForContent() on the DynamicForm after it's loaded.

Or, just don't draw the DynamicForm until the image is loaded.

[srodrigue]

Image will be refreshed periodically with varying size

Thank you for your response. I believe I will have to use the GWT Image API because the image will be reloaded periodically with varying size. Could you give me a short example on how to use the GWT Image API along with adjustForContent() ? Also, is it risky to use the GWT image API because it would mix SmarGWT and GWT ?

[Isomorphic]

No, not risky, the FAQ talks about *widgets* not core APIs like that do not render HTML into the DOM.

[srodrigue]

Thank you. I'm not familiar with the GWT Image API. Could you just give me the class name and method name I should call in order to listen to "image loaded" events ?

[srodrigue]

My solution

I found a solution that works great for me. Because the image width and height is known on the server side, I added two fields to the data source which are "width" and "height". Then I linked these field to the "image" field with the following code on the client:
ds = DataSource.get("producedImage");
ds.getField("image").setImageWidth("width"); // link the image field to the width field
ds.getField("image").setImageHeight("height"); // link the image field to the height field