resourceheight after calling setSource

[cmcginnis]

Hi

I'm trying to set an image to a view using the setSource method. The image shows up fine, but I need to get the resources height and width. If I do it right after calling the set source method, it returns me a "0".

this.myView.setSource( "http://somesite/some.jpg");
Debug.write("the image height " + this.myView.resourceheight);

Is there some event that I can key off of to make sure to get the resourcehieght once the image has loaded?

Thanks

[antun]

Hey cmcginnis

It's the onload event. From the reference:

onload Sent when the view attaches its resource.

Here's a simple way, using the <method event="onload"> syntax:


<canvas debug="true">
<view name="myView">
<method event="onload">
Debug.write("the image height " + this.resourceheight);
</method>
</view>

<button>
<method event="onclick">
myView.setSource("http://www.laszlosystems.com/img/h_head_logo.gif");
</method>
</button>
</canvas>


Alternatively you could set up a delegate to be called on the onload event.

-Antun

[cmcginnis]

Thanks Antun. Works like a charm.

[cmcginnis]

It looks like it is only calling the onload method once.

So if I do the following:

<canvas debug="true">
<view name="myView">
<method event="onload">
Debug.write("the image height " +
this.resourceheight);
</method>
</view>

<button>
<method event="onclick">
myView.setSource( someURL1 );
myView.setSource( someURL2 );
</method>
</button>
</canvas>

I only see one call to onload appear in the debugger when I'm suspecting to see two. Is this correct? Is there anyother way that I can trigger the onload event after calling the setSource method?

Thanks!

[antun]

The onload event only gets sent when the view attaches its resource (i.e. it gets the image back over HTTP). HTTP transactions in Laszlo are asynchronous, so the runtime will not wait for the first one to come back before it calls setSource() the second time around.

You could manually send the onload event:


<canvas debug="true">
<view name="myView">
<method event="onload">
Debug.write("the image height " + this.resourceheight);
</method>
</view>

<button>
<method event="onclick">
var someURL1 = 'http://www.lzlo.com/clipart/kernelpanic.png';
var someURL2 = 'http://www.lzlo.com/clipart/cherry.png';
myView.setSource( someURL1 );
myView.onload.sendEvent();
myView.setSource( someURL2 );
</method>
</button>
</canvas>


-Antun

Thanks to iconfactory (http://www.iconfactory.com/) for the icons.