2013-07-21 60 views
0

我已經創建了一個帶有列表的簡單標註。 像這樣:帶列表的Spark Mobile Callout不能正確定位/調整大小

<s:Callout xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" 
     autoLayout="true" > 
<fx:Declarations> 
    <!-- Platzieren Sie nichtvisuelle Elemente (z. B. Dienste, Wertobjekte) hier --> 
</fx:Declarations> 

<fx:Script> 
    <![CDATA[ 
     import com.skill.flextensions.factories.StyledClassFactory; 

     import mx.collections.IList; 

     import spark.components.IconItemRenderer; 
     import spark.components.List; 
     import spark.events.IndexChangeEvent; 
     import spark.layouts.HorizontalAlign; 
     import spark.layouts.VerticalLayout; 

     private var _list:List; 
     // 
     // PUBLIC PROPERTIES 
     // 
     private var _dataProvider:IList; 
     private var _dataProviderChanged:Boolean = false; 
     public function get dataProvider():IList 
     { 
      return _dataProvider; 
     } 

     public function set dataProvider(value:IList):void 
     { 
      _dataProvider = value; 
      _dataProviderChanged = true; 
      this.invalidateProperties(); 
     } 

     private var _itemRenderer:IFactory; 
     private var _itemRendererChanged:Boolean = false; 
     public function get itemRenderer():IFactory 
     { 
      return _itemRenderer; 
     } 
     public function set itemRenderer(value:IFactory):void 
     { 
      _itemRenderer = value; 
      _itemRendererChanged = true; 
      this.invalidateProperties(); 
     } 
     //   
     // @ SUPER 
     // 
     override protected function commitProperties():void 
     { 
      super.commitProperties(); 

      if(_dataProviderChanged) 
      { 
       _dataProviderChanged = false; 
       _list.dataProvider = _dataProvider; 
       // TODO 
       // we have to remeasure, after dataprovider updated 
       // unfortunately, this doesn't work: 
       /* 
       _list.invalidateSize(); 
       _list.invalidateDisplayList(); 
       _list.validateNow(); 
       invalidateSize(); 
       invalidateDisplayList(); 
       validateNow(); 
       */ 
       // so we will have to find a workaround for this situation. 
      } 

      if(_itemRendererChanged) 
      { 
       _itemRendererChanged= false; 
       _list.itemRenderer = getItemRenderer(); 
      } 
     } 

     override protected function createChildren():void 
     { 
      _list = new List; 
      _list.top = _list.bottom = 0;     
      _list.itemRenderer = getItemRenderer(); 
      _list.addEventListener(IndexChangeEvent.CHANGE , onChange , false , 0 , true); 

      var l:VerticalLayout = new VerticalLayout; 
      l.gap = 0; 
      l.requestedMinRowCount = 0; 
      l.horizontalAlign = HorizontalAlign.CONTENT_JUSTIFY; 
      _list.layout = l; 

      this.addElement(_list); 
     } 
     // 
     // @ LIST 
     // 
     protected function onChange(e:IndexChangeEvent):void 
     { 
      var obj:Object = _list.selectedItem; 
      this.removeAllElements(); 
      _list = null; 
      this.close(true , obj); 
     } 

     private function getItemRenderer():IFactory 
     { 
      if(! _itemRenderer) 
      { 
       var fac:StyledClassFactory = new StyledClassFactory(IconItemRenderer); 

       var props:Object = new Object; 
       props.messageField = "message"; 
       props.labelField = ""; 
       props.styleName = "itemName"; 
       props.iconField = "icon"; 

       var styles:Object = new Object; 
       styles.messageStyleName = "itemHeadline"; 

       fac.properties = props; 
       fac.styles = styles; 

       return fac; 
      } 
      return _itemRenderer; 
     } 

    ]]> 
</fx:Script> 

這裏的問題是,我的標註不正確測量。當dataProvider被添加到列表中時,它總是將列表的大小調整爲第一項。當列表發生某些用戶交互時,它會突然調整大小(調整爲最大項目)。

不幸的是,CallOut-Position不會改變,導致錯誤的標註,有時候甚至是一半的屏幕。

因此,在打開標註之前,我想確保列表的大小合適。

我該怎麼做?許多thx爲您的輸入。

+0

我在您的自定義組件上下注實施measure()方法將解決此問題。 – JeffryHouser

+0

@ Reboog711是的,我很可能會這樣做。但現在我沒有找到時間。我會在完成後立即發佈完成的代碼。許多thx。 –

回答

0

我有同樣的問題。我確信有一個更優雅的方式來做到這一點,但這是我的解決方案。

  1. 傾聽標註FlexEvent.CREATION_COMPLETE:

    <s:Callout xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" 
        autoLayout="true" 
        creationComplete="init()"> 
    
  2. 強制標註重做其佈局/尺寸:

    function init():void 
    { 
        validateNow(); 
        updatePopUpPosition(); 
    } 
    

在我的應用程序,我處理列表數據人口與你略有不同,所以你可能需要在設置數據之後調用init()。

+0

我試過了,但是這在我的情況下不起作用:(問題必須在列表中的某個地方或者它的佈局中。我暫時將init綁定到'ResizeEvent.Resize',它至少重新定位彈出窗口在列表調整大小後,任何用戶交互。但列表不應該調整大小,但從一開始就調整大小,所以你的答案大概是一半正確;-)順便說一句:如果我刪除我的'自定義'佈局,列表不會調整大小,但不足以顯示數據。 –

+0

奇怪的是,@Lee Burrows標籤現在不適合我,我希望你能得到這個。 thx再 –

+0

你也可以嘗試爲列表佈局justify爲horizo​​ntalAlign - 我發現內容證明是麻煩 – 2013-07-22 02:11:04

相關問題