Setting resource size automatically

[JApostoles]

I've noticed that when a resource is loaded within a view, the parent width is not updated.

For example, if I have an object with a view that contains an image, and I have the objects spaced using the simplelayout, when the resources load they are overlapping since the width doesn't seem to be updated.

Do I need to add an onLoad event to the resource to explicity resize the parent container if I want this functionality?

[antun]

I've noticed that when a resource is loaded within a view, the parent width is not updated.

I think it should update automatically - unless you're explicitly setting width or height dimensions, in which case the parent shall remain the same size.

-Antun

[JApostoles]

Well the view size is not explicity set, but it's instantiated before the image is loaded, so when the image resource is finally loaded (via http request) it seems that the other components of the class containing the view with the image do not adjust their sizes appropriately.

This is essentially what I'm using for code:


<class name="MyClass">
<attribute name="graphic" value="" type="string" />
<attribute name="text" value="" type="string" />
<view>
<simplelayout axis="y" spacing="5" />
<view clickable="true" name="myImage">
<method event="onInit">
this.setResource( this.classroot.graphic );
</method>
</view>
<text resize="true" align="center" text="${this.classroot.text}" />
</view>
</class>


Now if I create a few of those using simplelayout like so:


<view name="answerContainer">
<simplelayout axis="x" spacing="20" />
<MyClass graphic="someGraphicNormallyFromXPath.gif" text="text also from xpath" />
<MyClass graphic="someGraphicNormallyFromXPath.gif" text="text also from xpath" />
<MyClass graphic="someGraphicNormallyFromXPath.gif" text="text also from xpath" />
</view>


When the app loads, the three images are actually overlapping, spaced maybe ~20 pixels apart. So say the graphic is 300 pixels wide, the first graphic is at 0,0, then the next one starts at 20,0, then the third at 40,0 . So it's as if it's treating the width of the class as 0. It should be automatically updating the width so that the second instantiated class is at 320,0.

Any ideas?

[kusalacitta]

Hi JApostoles, you said:
================================================== ===
I've noticed that when a resource is loaded within a view, the parent width is not updated.

For example, if I have an object with a view that contains an image, and I have the objects spaced using the simplelayout, when the resources load they are overlapping since the width doesn't seem to be updated.

Do I need to add an onLoad event to the resource to explicity resize the parent container if I want this functionality?
================================================== ===

I also have the same problem when I want to display an image retrieved from dataset. The view attribute like width and height cannot resize to its original width or height of the image.
Example like the code below:
If I set explicitly width and height attribute of "viewImage", then when the data come up from dataset and setSource of this view with the data, the image can appears to its view (display image works fine). But because this is a replicated view, and some of data can have null or no contains image, I want to set viewImage just for the data that have image ("picture/text()" maybe a null value).
The problem is there's a space between text content and "viewImage" if dataset retrieve a null value on the ondata event. Because I define width and height attr explicitly. But If I don't define it explicitly, the image will appear at the behind of the text (overlapping between text and view).
What's going on about this?? Although I set visible attr of the view to false, it still remains the spaces. Does anyone know what is happen?.
Sometimes, I don't understand about how datapath works, especially when retrieve more than one data and make a replicated view.
Thanks for any help of you

...
...
<view x="10" name="postContent">
<view name="viewImage" datapath="picture/text()" width="50" height="60" visible="false">
<method event="ondata" name="setImage" args="d"><![CDATA[
if ( d!="" || d!=null) {
this.setSource(d);
this.setVisible(true);
} else {
this.setVisible(false);
}
]]>
</method>
</view>
<text x="1" y="1" maxlength="${1000000}" font="$path{'fontface/text()'}" ondata="this.setAttribute('fgcolor',Number(datapath.xpathQ uery('fontcolor/text()'))); this.setAttribute('align',datapath.xpathQuery('ali gntext/text()')); this.setAttribute('fontsize',Number(datapath.xpath Query('fontsize/text()')))" text="$path{'postcontent/text()'}" width="${classroot.width-40}" multiline="true" resize="true" selectable="true"/>
<simplelayout axis="y" spacing="5"/>
</view>
...
...