Flex 3: Hiding elements created by repeater

Question

I have a repeater that creates a custom component named "Block." I need to make it so that when the user clicks a button, all of the blocks created by the repeater have their visible field set to false (and then true when the button is clicked again).

Here's some of the code I have right now:

<mx:Repeater id="indPositions" dataProvider="{projectPositions}" startingIndex="0">
        <components:block height="24"
            width="100%" id="thisBlock" visible="true" horizontalScrollPolicy="off"  
            oneDay="{oneDay}"
        />
    </mx:Repeater>

Here's the button the user will click to show/hide the blocks:

<mx:Button id="showHideButton" label="Show Project" x="{addBlock.x + addBlock.width + 2}" click="showProjectSwitch();" />

Here's the function showProjectSwitch():

public function showProjectSwitch():void {
            if (showHideButton.label == "Hide Project")
            {   
                showHideButton.label = "Show Project";
                indPositions.visible = false;
                thisProject.height = 65;
            }
            else
            {   
                showHideButton.label = "Hide Project";
                indPositions.visible = true;
                thisProject.height = projectHeight ;
            }
        }

I tried setting projectRP.visible="true/false", but it didn't work :(

I also tried wrapping a canvas around the repeater, but when I did that... the repeater only ran once despite the fact I have the startingIndex="0" and the count="16". I then removed the canvas tags and the repeater ran the correct number of times.

Anybody able to help me out?

Andrew Traviss · Answer 1 · 2011-04-28T14:44:04.410

0

The easiest way to achieve what you want is just to use databinding, same as you did for the "oneDay" value.

<mx:Repeater id="indPositions" dataProvider="{projectPositions}" startingIndex="0">
    <components:block height="24"
        width="100%" id="thisBlock" visible="true" horizontalScrollPolicy="off"  
        oneDay="{oneDay}"
        visible="{showBlocks}"
    />
</mx:Repeater>
<mx:Boolean id="showBlocks" />

[Edit for additional clarity] To change the visibility of the blocks, you need to set the value of showBlocks, like so:

showBlocks = true;

or

showBlocks = false;

edited Apr 28 '11 at 14:44

answered Apr 27 '11 at 20:25

Andrew Traviss

249
1
7

Could you explain this a little bit? isn't a component type, and even if it was, i'm not sure i understand how that would change the visible state of the blocks. – Brds Apr 27 '11 at 20:38
is equivalent of declaring a Boolean variable in Actionscript, so you can assign it to be true or false. Each of the blocks is data-bound to this variable by the addition of the property visible="{showBlocks}". Whenever you assign a value of true to "showBlocks", all of the blocks will then set their "visible" property to true. – Andrew Traviss Apr 28 '11 at 14:40

score 0 · Answer 2 · answered Apr 29 '11 at 19:45

Here's how i solved it... since the variable name of "thisBlock" is declared every time a block is made, all that information gets stored in an array. After learning this, i was able to create a for each loop in a function that was called when the show/hide button was pressed... the for each loop goes something like this:

for (var I:int = 0; i < dataprovidername.length; i++)
    thisBlock[i].visible = true/flase;

Hope that can help somebody else out in the future.

Flex 3: Hiding elements created by repeater

2 Answers2