0

我创建了一个简单的标注,其中包含一个列表。像这样:

<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 添加到 List 时,它总是将 List 调整为第一项。当列表发生一些用户交互时,它会突然正确调整大小(调整到最大的项目)。

不幸的是,CallOut-Position 并没有改变,导致 Callout 错位,有时甚至是屏幕的一半。

所以我想在打开标注之前确保列表的大小正确。

我怎样才能做到这一点?非常感谢您的输入。

4

1 回答 1

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()。

于 2013-07-21T17:40:47.063 回答