Changing a child component in another component in a repeater
I have a custom component in a repeater. This component has a child component which can be of two types depending on some conditions. What I did was use an UIComponent as a place holder.
In the repeated component, lets say RepeatedComponent :
<mx:VBox>
<mx:UIComponent id="placeHolder"/>
</mx:VBox>
And I'm doing this in the component having the repeater :
// Function where I try to inject the child component :
private function getComponent():UIComponent{
if(condition)
{
return new ChildComponentA();
}
else
{
return new ChildComponentB();
}
]]>
</mx:Script>
<mx:VBox>
<mx:Repeater id="repeteur"
recycleChildren="true"
dataProvider="{arrayBeneficiaires}" >
<components:RepeatedComponent id="re开发者_运维技巧peatedComponent"
beneficiaire="{repeteur.currentItem}"
placeHolder="{getComponent()}"/>
</mx:Repeater>
</mx:VBox>
When I place breakpoints in the functions called at creationComplete, I can see that the component assigned to placeHolder is correct but it does not show on my display. I tried refreshing by calling invalidateDisplayList in every place I can think of but it does not seem to work. Any ideas would be most welcome.
Thanks
I suspect the issue is that the value from getComponent()
is never added to the stage. ie - setting the value of placeHolder
to something is not the same as calling addChild(getComponent()).
Therefore, the following would work:
<mx:Repeater id="repeteur"
recycleChildren="true"
dataProvider="{arrayBeneficiaires}" >
<components:RepeatedComponent id="repeatedComponent"
beneficiaire="{repeteur.currentItem}"
creationComplete="getComponent(repeatedComponent)"/>
</mx:Repeater>
private function getComponent(parent:RepeatedComponent):void {
if(condition)
{
parent.addChild(new ComponentA());
}
else
{
parent.addChild(new ComponentB());
}
}
Note, that in this scenario, you don't need the placeHolder UIComponent (which doesn't really serve any purpose).
However, I'd reccommend that this logic be moved inside RepeatedComponent
, as it appears as though this decision is the responsibility of the component, rather than the parent.
Then the code becomes much cleaner:
<mx:Repeater id="repeteur"
recycleChildren="true"
dataProvider="{arrayBeneficiaires}" >
<components:RepeatedComponent id="repeatedComponent"
beneficiaire="{repeteur.currentItem}" />
</mx:Repeater>
<!-- RepeatedComponent.mxml -->
<mx:VBox>
<mx:UIComponent id="placeHolder"/>
</mx:VBox>
<mx:Script>
private var _beneficiaire:Object
public function get beneficiaire():Object {
return _beneficiaire;
}
public function set beneficiaire(value:Object):void {
_beneficiaire = value;
createSubComponent();
}
private function createSubComponent():void
if(condition)
{
parent.addChild(new ComponentA());
}
else
{
parent.addChild(new ComponentB());
}
}
</mx:Script>
精彩评论