2009-08-24 14 views
1

作成しているFlexアプリケーションで問題が発生しています。問題はコンポーネントのライフサイクルをよく理解していないためだと思っています。コンポーネント作成に関する問題

私のアプリはAirで動作します。アプリケーションは、DashItemsの配列を作成します。 DashItemは、Canvasを拡張するActionScriptクラスです。 DashItemの作成時に渡されたデータに基づいて、さまざまなコンポーネントがこのキャンバスに追加されます。たとえば、dashtypeが "grid"の場合、EvGridが作成されます。 EvGridは、DataGridに基づくmxmlコンポーネントです。 DashItemはurlを設定し、HTTPService send()を開始するEvGridでpublic関数を呼び出します。データが取得され、グリッドに表示されます。これは期待どおりに動作しています。

ここに難しい部分があります。私はこれらのDashItems(Snackrを考えてください)のスクロール表示をしたいと思います。そこで、メインアプリケーションでEvent.ENTER_FRAMEのイベントリスナーを設定しました。呼び出される関数は、項目を画面の上にスクロールし、上からスクロールするときにそれらをリサイクルします。 DashItemsの配列を作成した直後にこのeventListenerを作成すると、何も表示されません。デバッグ私はHTTPServiceからデータを受け取っているDashItemのコンポーネントを見ていますが、スクロールコードがyの設定を調整していますが、アプリケーションウィンドウに何も表示されません。

完了時にENTER_FRAMEイベントハンドラを設定する別のタイマーを設定して、ENTER_FRAMEのeventListenerの追加を遅延させると、項目が表示されます。場合によっては、dataServiceが遅い場合は、空のグリッドが返されます。グリッドデータプロバイダはBindableです。

これは、私がコンポーネントのライフサイクルの一部を踏みにじっていると考えています。下にいくつかのコードスニペットを配置します。この初心者の助けや助言をありがとう。

MXでScroller.mxml:スクリプトセクション

public function handleApplicationComplete(event:Event):void { 
       dataService.send(); 
      } 
      public function faultHandler(event:FaultEvent): void { 
       trace(event.toString()); 
      } 

      public function resultHandler(event:ResultEvent): void { 
       trace("returned XML: " + event.result.toString()); 
       for each (var i:XML in event.result.item) { 
        var dx:DashItem = new DashItem({ 
             type: i.type, 
             url: i.url.toString(), 
             index: i.index, 
             title: i.title, 
             description: i.description, 
             height: this.height/(DISPLAY_LIST_SIZE -1), 
             width: this.width * 0.9 
            }); 

        trace("created " + dx.toString()); 
        DashList.unshift(dx); 
       } 
       buildDisplayList(); 
       var timer:Timer = new Timer(1000, 1); 
       timer.addEventListener(TimerEvent.TIMER_COMPLETE, startAnimation); 
       timer.start(); 
      } 

      private function startAnimation(event:TimerEvent):void { 
       trace("starting animation"); 
       addEventListener(Event.ENTER_FRAME, animate); 
      } 

      private function buildDisplayList():void { 
       var starty:Number = this.height; 
       var listSize:Number = DISPLAY_LIST_SIZE; 
       if (DashList.length < DISPLAY_LIST_SIZE) { 
        listSize = DashList.length; 
       } 
       for (var i:Number = 0; i < listSize; i++) { 
        var di:DashItem = DashList.pop(); 
        displayList.unshift(di); 
        di.y = starty; 
        scroller.addChild(di); 
        starty += di.height + PADDING; 
       } 
       trace("DisplayList is: "); 
       traceList(displayList); 
      } 

スクローラのHTTPServiceの:

<mx:HTTPService 
     id="dataService" 
     url="{ws}" 
     resultFormat="e4x" 
     result="resultsHandler(event);" 
     fault="faultHandler(event);" 
    /> 

    <mx:XMLListCollection id="eventListXml" source="{xmlData.events.event}"/> 
    <mx:Panel id="evwrapper" title="{evtitle}" width="100%" height="100%"> 

    <components:RowColorDataGrid id="EventListGrid" 
      dataProvider="{eventListXml}" 
      width="100%" 
      height="100%" 
      rowCount="{eventListXml.length+1}" 
      rowColorFunction="calcRowColor"> 
      <components:columns> 
       <mx:DataGridColumn 
        id="Serial" 
        dataField="serial" 
        headerText="Serial" 
        width="70" 

       /> 
       <mx:DataGridColumn 
        id="Severity" 
        dataField="severity" 
        headerText="Severity" 
        width="60" 
       /> 
       <mx:DataGridColumn 
        id="snlStatus" 
        dataField="snlstatus" 
        headerText="snlStatus" 
        width="100" 
       /> 
       <mx:DataGridColumn 
        id="Owneruid" 
        dataField="owneruid" 
        headerText="Owner" 
        width="70" 
       /> 
       <mx:DataGridColumn 
        id="Node" 
        dataField="node" 
        headerText="Node" 
        width="120" 
       /> 
       <mx:DataGridColumn 
        id="Summary" 
        dataField="summary" 
        headerText="Summary" 
        labelFunction="getCdata" 
       /> 
      </components:columns> 
     </components:RowColorDataGrid> 

    </mx:Panel 

<mx:HTTPService 
     id="dataService" 
     url="{DS_URL}" 
     resultFormat="e4x" 
     fault="faultHandler(event);" 
     result="resultHandler(event);" /> 

DashItem.asが

public function build():void { 
      if (type == "grid") { 
       trace("Building EventList..."); 
       var ev:EvGrid = new EvGrid(); 
       ev.evtitle = this.title; 
       this.addChild(ev); 
       ev.fetchData(); 
      } else if (type == "StatChart") { 

EvGridスニペットをスニペット

>

答えて

0

1年か2年前MAXでディーパのプレゼンテーションは、より優れたFlexコンポーネントのライフサイクルを理解するための素晴らしい方法です:

http://tv.adobe.com/MAX-2008-Develop/Creating-New-Components-in-Flex-3-by-Deepa-Subramaniam.html#vi+f15384v1002

、プロパティ、サイズおよび表示リストの無効化スキームを把握したら、そこにありますあなたがすることができる膨大な量。

+0

リンクありがとうございます! – Todd

0
  1. コールのsetTimeout(startAnimation、1000)。おそらく、タイマーを作成するより簡単です。または、UIComponentで "callLater"関数を使用するだけです。

  2. 同じメモで... ENTER_FRAMEの代わりにsetInterval(func、33)を使うことができます(aprox 30フレーム/秒と仮定します)。

  3. アイテムの準備ができたら、FlexEvent.CREATION_COMPLETEイベントを待ち受けます。

+0

ヒントをありがとう。私は彼らに試してみましょう。 – Todd

1

私はこの問題は、コンポーネント ライフサイクルの私の貧弱な 理解してあり、具体的に、あなたの問題に対処していないがあなたのように感じる場合、私は大いに は、いくつかのポインタ

Excellent white paper on the Flex Component Lifecycle.をいただければ幸いと考えていますライフサイクルに関する知識が必要です。

+0

リンクありがとうございます、私はそれをチェックアウトします。 – Todd

関連する問題