TileList creationComplete- Problem in Adobe Flex 3.0
-
02-10-2019 - |
Frage
Ich habe eine Kachel Liste ist Adobe Flex hergestellt wie folgt
<mx:TileList height="130" width="636" rowCount="1"
columnCount="8" columnWidth="150" direction="horizontal"
allowMultipleSelection="false" enabled="true" borderStyle="solid"
id="profilelist" verticalScrollPolicy="off" dataProvider="{xmlListColl}" itemRenderer="PageImageRenderer" cornerRadius="5" alpha="1.0" themeColor="#8791F3" x="36.5" y="29" change="openThisPage(event)">
</mx:TileList>
und hier ist der Code für PageImageRenderer
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="146" height="130" creationComplete="{initComponents()}">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function initComponents():void
{
var rectWidth:uint = 75;
var rectHeight:uint = 10;
var profilePopularity:Number = data.popularity;
var gradientFillColors:Array = [0x000000,0x000000];
var gradientAlpha:Array = [1,1];
var gradientRatio:Array = [220,255];
var fillAreaWidth:uint = 0;
this.graphics.lineStyle(1,0x000000);
this.graphics.moveTo(70,70);
this.graphics.lineTo(70+rectWidth,70);
this.graphics.lineTo(70+rectWidth,70+rectHeight);
this.graphics.lineTo(70,70+rectHeight);
this.graphics.lineTo(70,70);
this.graphics.lineStyle();
//border of rectangle has been drawn
//first calculate the width of filled area
fillAreaWidth = (rectWidth * profilePopularity)/100;
//now on the basis of popularity set the colors and width of filling area
if(profilePopularity<=10)
{
gradientFillColors[0] = 0x8ebc03;
gradientFillColors[1] = 0xc9f936;
}
else if(profilePopularity>10 && profilePopularity<=40)
{
gradientFillColors[0] = 0xe7e405;
gradientFillColors[1] = 0xf9f768;
}
else if(profilePopularity>40 && profilePopularity<=60)
{
gradientFillColors[0] = 0xeeb00a;
gradientFillColors[1] = 0xfbcf57;
}
else if(profilePopularity>60 && profilePopularity<=75)
{
gradientFillColors[0] = 0xb38404;
gradientFillColors[1] = 0xecad05;
}
else if(profilePopularity>75 && profilePopularity<=90)
{
gradientFillColors[0] = 0xf2a010;
gradientFillColors[1] = 0xf3b851;
}
else if(profilePopularity>90 && profilePopularity<=99)
{
gradientFillColors[0] = 0xec4004;
gradientFillColors[1] = 0xf18964;
}
else if(profilePopularity==100)
{
gradientFillColors[0] = 0xff0000;
gradientFillColors[1] = 0xff8a00;
}
this.graphics.beginGradientFill(GradientType.LINEAR,gradientFillColors,gradientAlpha,gradientRatio);
this.graphics.drawRect(70, 71, fillAreaWidth, rectHeight-1);
this.graphics.endFill();
}
]]>
</mx:Script>
<!-- Effects -->
<mx:Fade id="fadeIn" duration="2500" alphaFrom="0" alphaTo="1"/>
<mx:Fade id="fadeOut" duration="2500" alphaFrom="1" alphaTo="0"/>
<!-- Images and labels -->
<mx:Image source="{data.thumbnail}" x="10" y="10" height="48" width="48" completeEffect="{fadeIn}"/>
<mx:Label x="68" y="10" text="{data.name}" width="71"/>
<mx:Label x="68" y="27" text="{data.class}"/>
<mx:Label x="68" y="44" text="{data.school}"/>
</mx:Canvas>
das Problem ist das creation Ereignis für jeden PageImageRenderer nicht abgefeuert wird, und es gebrannt wird, nur für die Fliesen sichtbar am Anfang, so dass die in initComponents gezogen Rechtecken () nur für die Fliesen mit gültigen Werten gezogen werden, und wenn ich blättere Sie zu nächste Zeile verwendet scrollToIndex () Funktion sind die Rechtecke mit früheren Werten gezeigt. und keine initComponents () wird für diese Kacheln genannt? aber die data.name werden data.class korrekt angezeigt, nicht aber die Rechtecke, warum es so ist? Was ist die richtige Veranstaltung, gegen die ich initComponents nennen sollte ()?
Lösung
siehe folgende Beitrag für Antwort