Re: [flexcoders] Re: How can I loop through a Tile ?
Hi Mark, What you're trying to accomplish is (don't quote my authority here...) I think best tackled in Flex with a TileList and a custom ItemRenderer. You're definitely going into too much depth by altering component children individually at runtime. Since there's more than one way to skin a cat, best take a step back an prepare for a paradigm shift... forget about adding children and looping through and the like - Flex shouldn't need to follow that kind of model. If you need to loop through because your sources are live, you can schedule a call to one of the invalidation methods in the Flex display architecture, and thereby have Flex redraw the screen (except you should override the method so it does your stuff too...) http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Partsfile=ascomponents_advanced_148_16.html You'll need an understanding of ItemRenderers: http://www.adobe.com/devnet/flex/quickstart/using_item_renderers/ The basic concepts: - Any sort of List has a dataProvider. - A TileList is a sort of List. - Your dataProvider is normally an Array or ArrayCollection of items - A list has a default ItemRenderer which renders the items in the dataProvider (ordinarily extracting values from the label and data properties of objects in the dataProvider's ArrayList) - Your dataProvider can be a collection of *any object type* (in your case, I'd recommend creating a class that contains all the data relevant to each pair of image/text) - At render-time (to coin a term), an itemRenderer has it's content dropped into it. Flex will populate the with the TileList with itemRenderers, and set the data property on each itemRenderer. Flex loops over the dataProvider of the list, passing in one object at a time. - Each itemRenderer can now see one item (whatever is passed in) of the dataProvider (one instance of your custom class) in it's local scope as the data property if your itemRenderer is MXML. If it's ActionScript, you can override the data setter. So in your case, create a TileList with a columnWidth of 1. Each item in your TileList dataProvider should be of a custom type (create whatever type is necessary to store the data relating to each image and it's text). Put all your data into an ArrayCollection and bind it to the TileList dataProvider Create a custom itemRenderer in MXML (a VBox with an Image on one side, labels on the other) - bind it's properties (i.e. the image source, the label text, to the object you expect to be dropped in via the data property). If you need any more detailed modifications, look into creating your itemRenderer with ActionScript. This is an abstract of a wide range of concepts, so you may have to look round a bit on docs, blogs and the like, to find examples of similar stuff (there's plenty out there). It seems the main thing would be to change the approach your taking (if I'm making the right assumptions about what you're trying to do). Best Regards, Ciarán On 2/27/07, oneproofdk [EMAIL PROTECTED] wrote: Hi Ciarán Just put up a small example for you (and others) to see. Rightclick to view source: http://flex2.dk/mark/addchild/childTest.html Very simple app - 2 buttons. Add Children - will add 12 vboxes, each containing 2 images Loop Through Children - Will loop through tile1.numChildren - printing each name into the textarea. But HOW can I get hold of the names of the images (and even more, their source) I need this to be able to loop through each item, check if the source has been updated, and if so, reload the image. Thanks for your time. Mark -- Flexcoders Mailing List FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com Yahoo! Groups Links
[flexcoders] Re: How can I loop through a Tile ?
--- In flexcoders@yahoogroups.com, Ciarán [EMAIL PROTECTED] wrote:
Hi Mark,
Hi Ciarán
Thanks for your answer.
I can see your point, so I'll try to illustrate what I'm doing and
trying to achieve:
In the application, I have a mx:tile id=tile1/
In a HTTPService Result Handler, I loop through the result and add a
component (spreadView) to tile1.
Now each component (spreadView) has a function that will add children
til it (see below function pageHandler)
I have clipped alot of var's etc from the code, to save some space -
and it's still quite messy, so please bear with me.
Again : Basicly I need to access a childObject of a childObject in a
Tile - Have been looking at rawchildren, which doesn't really bring me
anywhere, propably wrong usage !!
Any helpers is greatly appreciated, it might (obviously) also be, that
I am doint his all wrong, should I avoid using a Component, and
instead build each component in AS ?
Thanks for your time!
Best regards,
Mark
private var newspread:SpreadView = null;
private function pageHandler(event:ResultEvent):void {
tile1.removeAllChildren();
if (event.result.action.pageset is ObjectProxy) {
pages.addItem( event.result.action.pageset ) ;
} else {
pages = event.result.action.pageset;
}
for (var i:int=0;ipages.length;i++){
//trace( pages[i].left.page.pageid );
newspread = new SpreadView();
newspread.leftPageID =
pages[i].left.page.pageid;
newspread.rightPageID =
pages[i].right.page.pageid;
tile1.addChild(newspread);
}
}
?xml version=1.0 encoding=utf-8?
mx:VBox xmlns:mx=http://www.adobe.com/2006/mxml;
creationComplete=init() width=100% height=100%
mx:Script
![CDATA[
import mx.controls.Image;
import mx.containers.Canvas;
private function init():void {
// Clear the canvas of any children
initLeft();
initRight();
this.name = leftPageNo + + leftPageTitle +-+
rightPageNo + +
rightPageTitle;
}
private var leftThumb:Image = null;
private var rightThumb:Image = null;
private var lc:Canvas = null;
private var rc:Canvas = null;
private function initLeft():void{
lc = new Canvas;
lc.id = leftCanvas;
lc.percentHeight = 100;
lc.percentWidth = 50;
lc.verticalScrollPolicy = off;
lc.horizontalScrollPolicy = off;
if (leftIsRegion) {
lc.setStyle(backgroundColor, 0x00C4FF);
} else {
//lc.setStyle(backGroundColor, 0xFF);
}
mainbox.addChild(lc);
leftThumb = new Image();
leftThumb.name = leftThumb;
leftThumb.source = leftImgLink;
leftThumb.id = leftPageNo;
leftThumb.scaleX = 1;
leftThumb.scaleY = 1;
leftThumb.y = 10;
leftThumb.toolTip = leftImgLink;
lc.addChild(leftThumb);
if (leftHasSwift) {
leftFooter.setStyle(backgroundColor,
0x00);
} else {
leftFooter.setStyle(backgroundColor,
0xFF);
}
leftPageno.text = leftPageNo + + leftPageTitle;
}
private function initRight():void{
rc = new Canvas;
rc.name = rightCanvas;
rc.percentHeight = 100;
rc.percentWidth = 50;
rc.verticalScrollPolicy = off;
rc.horizontalScrollPolicy = off;
if (rightIsRegion) {
rc.setStyle(backgroundColor, 0x00C4FF);
} else {
//rc.setStyle(backgroundColor, 0xFF);
}
mainbox.addChild(rc);
rightThumb = new Image();
rightThumb.name
[flexcoders] Re: How can I loop through a Tile ?
Just to visualize the problem : http://flex2.dk/mark/screencaps/tileproblems.jpg
[flexcoders] Re: How can I loop through a Tile ?
Hi Ciarán Just put up a small example for you (and others) to see. Rightclick to view source: http://flex2.dk/mark/addchild/childTest.html Very simple app - 2 buttons. Add Children - will add 12 vboxes, each containing 2 images Loop Through Children - Will loop through tile1.numChildren - printing each name into the textarea. But HOW can I get hold of the names of the images (and even more, their source) I need this to be able to loop through each item, check if the source has been updated, and if so, reload the image. Thanks for your time. Mark
[flexcoders] Re: How can I loop through a Tile ?
No one ?? Really need help with this one :-| bump Thanks, Mark
