AS3을 사용하여 동적으로 생성 된 스파크 사각형에 색상 적용

Question

(FlashBuilder) 클릭시 액션을 수행 할 CSV 파일에서 약 1200 개의 직사각형을 동적으로 생성하고 싶습니다.

이렇게하는 가장 좋은 방법은 무엇입니까? Air and Android의 드로잉 API는 좋은 생각이 아니며 Spark Rectangle 클래스를 사용하려고 생각하고 있습니다. 그러나 생성하는 경우 색상을 적용하는 방법을 생각할 수 없습니다. 동적으로 사용 하시겠습니까?

 private function addRect(color:uint, xPos:Number, yPos:Number, width:Number, height:Number):void { 
      var rect:Rect = new Rect(); 
      rect.x = xPos; 
      rect.y = yPos; 
      rect.width = width; 
      rect.height = height; 
      var fillColor:SolidColor = new SolidColor(color); 
      rect.fill = fillColor; 
      var obj:Group = new Group(); 
      obj.addElement(rect); 
      obj.addEventListener(MouseEvent.CLICK, this.onClick); 
      this.addElement(obj); 
     } 

     private function onClick(e:Event):void { 
      trace("clicked"); 
     } 

희망하는 데 도움이 :

Answer 1

당신의 CSV에서 읽은 후, 요소를 통해 루프 때문에 같은 함수 뭔가를 호출합니다.

Answer 2

전체 UI를 선언적으로 처리 할 수 ​​있습니다. CSV를 데이터 구조로 구문 분석하고 ArrayCollection으로 팝합니다. 이 예제에서 나는 방금 3 개의 샘플을 던졌다.

그런 다음 을 만들고 dataProvider="rectangles"을 설정 한 다음 itemRenderer을 만듭니다.

이 예는 IMO, 잘 작동 :

<?xml version="1.0" encoding="utf-8"?> 
<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"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 

      var rectangles:ArrayCollection = new ArrayCollection([ 
       {color: 0x00FF00, x: 5, y: 10, width: 30, height: 40}, 
       {color: 0xFF0000, x: 50, y: 100, width: 300, height: 400}, 
       {color: 0x0000FF, x: 55, y: 10, width: 30, height: 40}, 
       ]); 

     ]]> 
    </fx:Script> 

    <s:DataGroup dataProvider="{rectangles}" itemRenderer="RectangleRenderer" /> 
</s:Application> 

는 다음, itemRenderer은 다음과 같습니다

:

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" 
       autoDrawBackground="true" 
       click="whenClicked()" 
       x="{data.x}" y="{data.y}" 
       width="{data.width}" height="{data.height}"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.controls.Alert; 
      private function whenClicked():void { 
       Alert.show("clicked"); 
      } 
     ]]> 
    </fx:Script> 

    <s:Rect width="100%" height="100%"> 
     <s:fill> 
      <s:SolidColor color="{data.color}" /> 
     </s:fill> 
    </s:Rect> 
</s:ItemRenderer>