Re-measuring custom item renderer on a List

Question

I'm writing an Adobe Air client to a service similar to Twitter.

On the timeline (List component) I have a custom item renderer which is basically a Canvas with a fixed-width Image and a Text control, which is multi-line.

If the text is long enough to change the Canvas height, it will only be resized if I manually change the width of the Window, forcing a redraw of all renderers. If I simply scroll through the List, all "new" renderers will have the minimum height possible (which is the Image height).

Any ideas on how to force the re-measurement of the renderer when I set it's data?

Thanks in advance! :)

score 0 · Answer 1 · answered Oct 09 '09 at 10:57

I'm struggling with similar invalidation / resizing issues. This video shed some light on building custom components for me. Hope it helps.

Here is a link to a great video of an adobe engineer speaking about creating components for flex in Action script.

http://tv.adobe.com/watch/max-2008-develop/creating-new-components-in-flex-3-by-deepa-subramaniam/

score 0 · Answer 2 · answered Oct 09 '09 at 11:29

0

Did you try setting variableRowHeight=true for the list?

answered Oct 09 '09 at 11:29

Amarghosh

58,710
11
92
121

I did. It does resize correctly if I change the window width. I just want it to recalculate and size it correctly when I am scrolling the list. – leolobato Oct 19 '09 at 12:29
how about setting the height of canvas and text to 100% – Amarghosh Oct 20 '09 at 03:57

score 0 · Answer 3 · answered Mar 24 '10 at 23:13

0

If you handle the updateComplete event, you can recalculate the size there. It is probably over kill since updateComplete happens every time the itemrenderer is drawn but it works.

answered Mar 24 '10 at 23:13

score 0 · Answer 4 · answered Apr 11 '11 at 10:25

First you have to set variableRowHeight to true;
In your itemRenderer you should turn off verticalScrollPolicy (i assume you already did), and do the same to the text control as well. Also set the text's height to 100%.
I didn't try it in Flex4, but in prior versions i had to have a VBox as root for the itemRenderer in order to make it resize based on its text's content, so you should consider using a VBox / VGroup instance instead of Canvas.

score 0 · Answer 5 · answered Apr 17 '09 at 04:34

0

try calling invalidateSize() on the itemrender, and/or invalidateDisplayList() on the list

answered Apr 17 '09 at 04:34

rogueg

293
3
10

I remember struggling with something similar, but I can't find the code. Try calling invalidateDisplayList() on another frame using the callLater function. You might also try validateNow(). Sorry I can't give you a specific solution. – rogueg Apr 20 '09 at 15:19

score 0 · Answer 6 · edited May 23 '17 at 10:24

I ran into a very similar issue with resizing item renderers in a data grid using labels which need to size themselves based on text. The problem is it requires two passes for a multi-line text component to update itself correctly. This works for most controls because they are continually updating and positioning. It fails in a list or grid because the first update when a change happens forces the list to measure the item renderers then it sets the height of its row based on the returned result. The item renderer then updates itself the second time (meauring itself correctly this time) but the list is not looking for those update changes. I took to forcibly validating the label (text control) in the measure pass to get the text component sized correctly so the renderer would report the correct measured height the first update pass after any change. My questing (and my subsequent discovered anser and some discussion) is here: ItemRenderer hieght (and height changes) not reflected in AdvancedDataGrid row

Re-measuring custom item renderer on a List

6 Answers6