Flex移动 - 具有大图像的ItemRenders的火花列表的性能



我正在开发flex手机中的大图像的火花列表。每个项目Renderer都有一个大图像。

喜欢。

<s:ItemRenderer>
    ...
    <s:BitmapImage source="{data.bmpData}" />
</s:ItemRenderer>

在dataprovider中,有bitmapdata为" bmpdata"。

问题是滚动时性能。滚动时,它在渲染新图像时停止了一段时间。

请帮助我。

如果问题是您在同一时间渲染太多的bitmapdata,则可以在不同框架中一个一个渲染。

这是一个示例。制作自定义项目renderer

class YourItemRenderer
{
    override public function set data(value:Object):void
    {
         if (super.data != value)
         {
              super.data = value;
              yourBitmapImage.source  = null;
              //when the data change, don't call the render function directly
              EnterFrameManager.getInstance().addRenderFunction(render)
         }
    }
    private function render():void
    {
        if (yourBitmapImage != null && data != null)
        {
             yourBitmapImage.source = data.bmpData;
        }
    }
 }

EnterframeManager用于控制渲染功能。

 class EnterFrameManager 
 {
        import mx.core.FlexGlobals;
        public function EnterFrameManager()
        {
             FlexGlobals.topLevelApplication.addEventListener( Event.EnterFrame, onEnterFrameHandler)         
        }
        private var _instance:EnterFrameManager;
        public static function getInstance():EnterFrameManager
        {
             if (_instance == null)
             {
                  _instance = new EnterFrameManager();
             }
             return instance;
        }
        //save the render functions
        private var renderQueue:Array = [];
        private var nowIntervalFrame:int = 0;
        //change it to small value when you don't feel lag
        private const UPDATE_INTERVAL_FRAMES:int = 6;
        private function onEnterFrameHandler(e:Event):void
        {
              nowIntervalFrame++;
              if (nowIntervalFrame >= UPDATE_INTERVAL_FRAMES)
              {
                  nowIntervalFrame = 0;
                  //change renderQueue by waitQueue
                  for each (var f:Function in waitQueue)
                  {   
                      addFunctionToQueue(f, renderQueue);
                  }
                  waitQueue.length = 0;
                  if (renderQueue.length > 0)
                  {
                      var f:Function = renderQueue.shift();
                      f();
                  }
              }
        }
        private var waitQueue:Array = [];
        public function addRenderFunction(f:Function):void
        {
            addFunctionToQueue(f, waitQueue);
        }
        private function addFunctionToQueue(f:Function, queue:Function):void
        {
           var index:int = queue.indexOf(f);
            if (index == -1)
            {
                 queue.push(f);
            }
            else
            {
                var temp:Function = queue.splice(index, 1);
                queue.push(temp);
            }
        }
 }

最新更新