Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Your problem is that it is not guaranteed that you can do your operation (<em>"remove all elements"</em> and <em>"add the new children"</em>) in one update. In fact, it is absolutely sure that they will happen in at least two updates - one for the removal, and one for the addition. The flickering is caused by the brief time frame between the two updates.</p> <p>The easiest fix is to reuse the already created components instead of the laborious creation of 50 containers with labels on every timer update. With some more effort you may create and remove the new components dynamically or use bindings.</p> <p>Here is a quick modification of your code with component reuse. You won't experience flickering here, as the labels are changed in just one update.</p> <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="init()"&gt; &lt;fx:Script&gt; &lt;![CDATA[ import mx.containers.HBox; import mx.controls.Button; import mx.controls.Label; private var timer:Timer; private var labels:Array = []; protected function init():void { updateContainer(); timer = new Timer(1000); timer.addEventListener(TimerEvent.TIMER, updateContainer); timer.start(); initContainers(); } private function initContainers():void { labels = []; for (var i:int = 0; i &lt; 50; i++) { var myHBox:HBox = new HBox(); myHBox.percentWidth = 100; myHBox.setStyle("backgroundColor", "#FFFFFF"); var myLabel:Label = new Label(); myHBox.addChild(myLabel); container.addChild(myHBox); labels.push(myLabel); } } private function updateContainer(evt:TimerEvent = null):void { trace("update"); for(var i:int = 0; i &lt; 50; i++) { if (labels[i] != null) { (labels[i] as Label).text = "Hello World " + i + " " + (new Date).time; } } } ]]&gt; &lt;/fx:Script&gt; &lt;mx:VBox id="container" /&gt; </code></pre> <p></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload