没有Flash CS的Flex Preloader

时间:2011-11-03 12:52:43

标签: flex preloader

我一直在寻找自定义Flex预加载器,它们似乎都依赖于相同的模板:
SWC是使用Flash CS5创建的,然后由Flash Builder使用“预加载器”应用程序属性使用。

我不拥有Flash CS,并认为Flash构建器应该能够做到这一点 我在Flash Builder中使用以下简单的代码创建了一个库项目:

package loader  
{
    import flash.display.DisplayObject;
    import flash.events.Event;
    import flash.utils.getTimer;

    import mx.events.RSLEvent;
    import mx.preloaders.DownloadProgressBar;
    import mx.preloaders.SparkDownloadProgressBar;      

    public class Preloader extends SparkDownloadProgressBar
    {

        [Embed(source="loaderlogo.png")] public var logoClass:Class;

        private var _displayStartCount:uint = 0; 
        private var _initProgressCount:uint = 0;
        private var _downloadComplete:Boolean = false;
        private var _showingDisplay:Boolean = false;
        private var _startTime:int;
        // private var preloaderDisplay:PreloaderDisplay;
        private var rslBaseText:String = "loading: ";


        public function Preloader()
        {
            super();
        }

        /**
         *  Event listener for the <code>FlexEvent.INIT_COMPLETE</code> event.
         *  NOTE: This event can be commented out to stop preloader from completing during testing
         */
        override protected function initCompleteHandler(event:Event):void
        {
            dispatchEvent(new Event(Event.COMPLETE)); 
        }

        /**
         *  Creates the subcomponents of the display.
         */
        override protected function createChildren():void
        {    
            var img:DisplayObject = new logoClass();
            img.x = Math.round( ( stageWidth - img.width) / 2);
            img.y = Math.round( ( stageHeight - img.height) / 2);
            addChild( img);

            var dpb:DownloadProgressBar = new DownloadProgressBar();
            dpb.x = img.x + 100;
            dpb.y = img.x + 100;
            dpb.width = 170;
            dpb.height = 20;
            addChild( dpb);
        }

        /**
         * Event listener for the <code>RSLEvent.RSL_PROGRESS</code> event. 
         **/
        override protected function rslProgressHandler(evt:RSLEvent):void {
            if (evt.rslIndex && evt.rslTotal) {
                //create text to track the RSLs being loaded
                rslBaseText = "loading RSL " + evt.rslIndex + " of " + evt.rslTotal + ": ";
            }
        }

        /** 
         *  indicate download progress.
         */
        override protected function setDownloadProgress(completed:Number, total:Number):void {

        }

        /** 
         *  Updates the inner portion of the download progress bar to
         *  indicate initialization progress.
         */
        override protected function setInitProgress(completed:Number, total:Number):void {
        } 


        /**
         *  Event listener for the <code>FlexEvent.INIT_PROGRESS</code> event. 
         *  This implementation updates the progress bar
         *  each time the event is dispatched. 
         */
        override protected function initProgressHandler(event:Event):void {
            var elapsedTime:int = getTimer() - _startTime;
            _initProgressCount++;

            if (!_showingDisplay &&    showDisplayForInit(elapsedTime, _initProgressCount)) {
                _displayStartCount = _initProgressCount;
                show();
                // If we are showing the progress for the first time here, we need to call setDownloadProgress() once to set the progress bar background.
                setDownloadProgress(100, 100);
            }

            if (_showingDisplay) {
                // if show() did not actually show because of SWFObject bug then we may need to set the download bar background here
                if (!_downloadComplete) {
                    setDownloadProgress(100, 100);
                }
                setInitProgress(_initProgressCount, initProgressTotal);
            }
        }

        private function show():void
        {
            // swfobject reports 0 sometimes at startup
            // if we get zero, wait and try on next attempt
            if (stageWidth == 0 && stageHeight == 0)
            {
                try
                {
                    stageWidth = stage.stageWidth;
                    stageHeight = stage.stageHeight
                }
                catch (e:Error)
                {
                    stageWidth = loaderInfo.width;
                    stageHeight = loaderInfo.height;
                }
                if (stageWidth == 0 && stageHeight == 0)
                    return;
            }

            _showingDisplay = true;
            createChildren();
        }

    }
}

简而言之,它正在加载徽标和进度条 它显示了预加载器,但在加载过程中确实很晚。仿佛它是在Flex之后加载的 我是否需要在CS5中编译它以完全避免使用MX / Spark?

1 个答案:

答案 0 :(得分:1)

  1. 您不应在预加载器中使用任何组件。尝试删除导入(Ctrl + Shift + O)

    import mx.controls.Image; import spark.components.Label;

  2. 如果需要,请改用TextField和Loader。我不确定DownloadProgressBar组件。

  3. 也不要在预加载器中使用create children。这是一个工作样本:

    package {
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.ProgressEvent;
    import flash.text.TextField;
    import flash.text.TextFormat;
    
    import mx.core.mx_internal;
    import mx.preloaders.SparkDownloadProgressBar;
    
    use namespace mx_internal;
    
    public class Preloader extends SparkDownloadProgressBar {
    
        private var preloaderLogo : MovieClip;
        private var loadingText : TextField;
        private var loadingProgress : TextField;
    
        private var _initProgressCount : uint = 0;
    
        private var textFormat : TextFormat = new TextFormat("Verdana", 16, 0x666666, true);
    
        public function Preloader() {
            super();
    
            textFormat.align = "center";
        }
    
    
        override public function set preloader(value : Sprite) : void {
            super.preloader = value;
    
            if (!preloaderLogo) {
                preloaderLogo = new Assets.PRELOADER_LOGO;  // kakaranet logo
    
                var startX : Number = Math.round((stageWidth - preloaderLogo.width) / 2);
                var startY : Number = Math.round(stageHeight / 2 - preloaderLogo.height) - 100;
    
                preloaderLogo.x = startX;
                preloaderLogo.y = startY;
    
                loadingText = new TextField();
                loadingProgress = new TextField();
    
                loadingText.width = stageWidth;//to allow center align
                loadingProgress.width = stageWidth;                
    
    
                loadingText.text = "Loading...";
                loadingText.y = preloaderLogo.y + preloaderLogo.height + 20;
    
    
                loadingProgress.text = "0%";
                loadingProgress.y = loadingText.y + loadingText.textHeight + 10;
    
                addChild(preloaderLogo);
                addChild(loadingText);
                addChild(loadingProgress);
    
                loadingText.setTextFormat(textFormat);
                loadingProgress.setTextFormat(textFormat);
            }
        }
    
    
        override protected function progressHandler(event : ProgressEvent) : void {
            super.progressHandler(event);
            if (loadingProgress) {
                loadingProgress.text = Math.floor(event.bytesLoaded / event.bytesTotal * 100) + "%";
                loadingProgress.setTextFormat(textFormat);
            }
    
        }
    
        override protected function completeHandler(event : Event) : void {
            loadingText.text = "Ready!";
            loadingText.setTextFormat(textFormat);
            preloaderLogo.stop();
        }        
    
    
        override protected function initProgressHandler(event : Event) : void {
            super.initProgressHandler(event);
            //similar to super
            _initProgressCount++;
            if (loadingProgress) {
                loadingProgress.text = "100% / " + Math.floor(_initProgressCount / initProgressTotal * 100) + "%";
                loadingProgress.setTextFormat(textFormat);
            }
        }
    }
    

    }