FLEX에서 보통 스킨을 변경하는 것은 setStyle을 통해 이뤄 지죠...

그래서 스킨을 동적으로 변경하자고 하는 경우

.type1{
color:"#ff0000";
}

.type2{
color:"#0000ff";
}

css에서 이런식으로 만들어 놓은 이후 styleName = type1 ... styleName = type2 이런식으로 바꿔서 처리 합니다.

하지만 위와 같이 고정된 값이 아니라 외부에서 XML 또는 소켓통신 등을 통해서 값을 읽어들인 값을 기준으로

스킨의 값을 변경하고자 하는 경우에는 ... 스킨 클래스를 만들어 놓고 해당 클래스에 불러들인 값을 대입한 이후

해당 클래스를 스킨클래스로 지정하는 방법이 존재 합니다.

자세한 것은 첨부 파일을 참조 바랍니다 -__- 설명의 귀차니즘..


ArrayCollection을 2개 할당한 이후
데이터 수신용, 보여주기용(Bindable) 으로 설정하여 데이터를 컨트롤 해 주도록 하면 된다. 



소스 보기

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
 creationComplete="init()"
 xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 
 <mx:Script>
  <![CDATA[
   import mx.charts.chartClasses.Series;
   import mx.controls.CheckBox;
   import mx.collections.ArrayCollection;
   import mx.utils.ObjectProxy;
   
   private const MAX_SRV:uint = 3;
   [Bindable]
   private var viewArr:ArrayCollection = new ArrayCollection; //실제 보여주는 데이터
   private var rcvArr:ArrayCollection = new ArrayCollection; //받은 데이터
   
   
   
   private var fndIdx:uint;
   
   private var timer:Timer;
   
   private function init():void{
    timer = new Timer(1000);
    timer.start();
    timer.addEventListener(TimerEvent.TIMER, timerHandler);    
   }
   
   private function cbHandler(e:Event):void{
    generateRealValues();
   }
   
   private function generateRealValues():void{
    //보여주려는 것
    var tmpArr:ArrayCollection = new ArrayCollection;
    
    
    for(var i:uint=0;i<MAX_SRV;i++){
     var tmpCB:CheckBox = this["cb"+i] as CheckBox;
     if(tmpCB.selected){
      tmpArr.addItem(rcvArr.getItemAt(Number(tmpCB.id.substr(2))));
     }
    }
    
    viewArr = tmpArr;
   }
   
   private function timerHandler(e:TimerEvent):void{
    generateDummyValues();
   }
   
   private function generateDummyValues():void{
    
    rcvArr.removeAll();
    
    for(var i:uint=0;i<MAX_SRV;i++){
     var op:ObjectProxy = new ObjectProxy();
     
     op.server = "srv"+i;   // label field
     
     op.apple = randRange(0,5);  // data field
     op.melon = randRange(0,5);
     op.banana = randRange(0,5);
          
     rcvArr.addItem(op);
    }
    
    generateRealValues();
   }
   
   
   
   private function randRange(min:Number, max:Number):Number {
    var randomNum:Number = Math.floor(Math.random() * (max - min + 1)) + min;
    return randomNum;
   }
  ]]>
 </mx:Script>

 <mx:VBox width="100%" height="100%">
  <mx:HBox>
   <mx:Label text="SELECT SERVER :" />
   <mx:CheckBox id="cb0" label="srv0" selected="true" change="cbHandler(event)"/>
   <mx:CheckBox id="cb1" label="srv1" selected="true" change="cbHandler(event)"/>
   <mx:CheckBox id="cb2" label="srv2" selected="true" change="cbHandler(event)"/>
  </mx:HBox>
  <mx:HBox width="100%" height="100%">
   <mx:BarChart id="barchart1" height="100%" width="100%" dataProvider="{viewArr}">
    <mx:series>
     <mx:BarSet type="stacked" allowNegativeForStacked="true" >
      <mx:series>
       <mx:BarSeries id="bs0" displayName="apple" yField="server" xField="apple"/>
       <mx:BarSeries id="bs1" displayName="banana" yField="server" xField="banana"/>
       <mx:BarSeries id="bs2" displayName="melon" yField="server" xField="melon"/>
      </mx:series>
     </mx:BarSet>     
    </mx:series>
    <mx:verticalAxis>
     <mx:CategoryAxis dataProvider="{viewArr}" categoryField="server"/>
    </mx:verticalAxis>
    <!-- 가로 축 정보 -->
          <mx:horizontalAxis>
             <mx:LinearAxis
         interval="1"
         maximum="15"
         maximumLabelPrecision="0"
         minimum="0"
         minorInterval="0"
       />
          </mx:horizontalAxis>
   </mx:BarChart>
   <mx:Legend dataProvider="{barchart1}"/>
   
   
  </mx:HBox>
  <mx:TextArea width="100%" height="50" />
 </mx:VBox>
</mx:Application>


+ Recent posts