Flex 3 preloaders died with Flash 11/11.5

Question

I really need help, I've been dealing with this for months. Basically I have an old Flex 3 app with a custom preloader. Once everyone upgraded to Flash 11 and 11.5 the preloader has disappeared. I'm trying to get the thing working with Flash Builder 4.7, linking in 3.6 Libraries, but alas it's seems to be failing silently. Even the standard Preloader is boinked with "Loading library 0 of " (however it does show up)...I'm using the now classic "DownloadProgressBar" extended custom preloader pattern.

package com.timberdesignco.preloader
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.ProgressEvent;
    import flash.events.TimerEvent;
    import flash.utils.Timer;

    import mx.events.FlexEvent;
    import mx.preloaders.DownloadProgressBar;

    public final class CustomPreloader extends DownloadProgressBar {
        public  var loader : LoadScreen;
        private var _timer : Timer;

        public function CustomPreloader() 
        {
            super(); 
        }

        override public function initialize() : void
        {
            super.initialize();

            this.loader = new LoadScreen();
            this.addChild(this.loader);

            this._timer = new Timer(10);
            this._timer.addEventListener(TimerEvent.TIMER, handleTimerTick);
            this._timer.start();
        }

        override public function set preloader(preloader : Sprite):void 
        {                   
            preloader.addEventListener(ProgressEvent.PROGRESS,  SWFDownLoadScreen);
            preloader.addEventListener(Event.COMPLETE,          SWFDownloadComplete);
            preloader.addEventListener(FlexEvent.INIT_PROGRESS, FlexInitProgress);
            preloader.addEventListener(FlexEvent.INIT_COMPLETE, FlexInitComplete);
        }

        private function SWFDownLoadScreen(event : ProgressEvent) : void
        {
            var prog : Number = event.bytesLoaded / event.bytesTotal * 100;
            if (this.loader)
            {
                this.loader.progress = prog;
            }
        }

        private function handleTimerTick(event : TimerEvent) : void
        {
            this.stage.addChild(this);
            this.loader.x = (this.stage.stageWidth  - this.loader.width)  / 2 - 35;
            this.loader.y = (this.stage.stageHeight - this.loader.height) / 2;
            this.loader.refresh();
        }

        private function SWFDownloadComplete(event : Event) : void {}

        private function FlexInitProgress(event : Event) : void {}

        private function FlexInitComplete(event : Event) : void 
        {      
            this.loader.ready = true;
            this._timer.stop();
            this.dispatchEvent(new Event(Event.COMPLETE));
        }

        override protected function showDisplayForInit(elapsedTime:int, count:int):Boolean
        {
            return true;
        }

        override protected function showDisplayForDownloading(elapsedTime:int,
                                                  event:ProgressEvent):Boolean
        {
            return true;
        }
    }
}

---

package com.timberdesignco.preloader
{
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.Graphics;
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.text.Font;
    import flash.text.TextField;
    import flash.text.TextFormat;
    import flash.utils.ByteArray;

    import mx.graphics.codec.PNGEncoder;

    public class LoadScreen extends Loader {

        //~ Instance Attributes -----------------------------------------------
        [Embed(source="/assets/CreightonReg.otf", fontFamily="Creighton")]
        private var CreightonEmbedded:Class;
        private var creightonEmbeddedFont:Font = new CreightonEmbedded();


        [Embed(source="/assets/LoadingBar-Bark.png")]
        private var MyLogoClass: Class;

        private var _logo : Bitmap;
        private var _logoData : BitmapData;

        private var isReady  : Boolean = false;
        public  var progress : Number;

        //~ Constructor -------------------------------------------------------        
        public function LoadScreen()
        {
            super();
            this.progress = 0;
            this._logo = new MyLogoClass as Bitmap;
        }

        //~ Methods -----------------------------------------------------------
        public function refresh() : void {
            this._logoData = this.draw();
            var encoder : PNGEncoder = new PNGEncoder();
            var bytes   : ByteArray  = encoder.encode(this._logoData);
            this.loadBytes(bytes);
        }

        override public function get width() : Number {
            return 300;
        }

        override public function get height() : Number {
            return 300;
        }

        private function draw() : BitmapData {
            // create bitmap data to create the data
            var data : BitmapData = new BitmapData(this.width, this.height, true, 0);

            // draw the logo
            //data.draw(this._logo.bitmapData, null, null, null, null, true);

            // draw the progress bar
            var s : Sprite = new Sprite();
            var g : Graphics = s.graphics;

            // draw the bar background
            //g.beginFill(_BarBackground);
            //g.lineStyle(2, _BarOuterBorder, 1, true);
            //var px : int = (this.width - _BarWidth) / 2;
            //var py : int = _TopMargin + _LogoHeight + _Padding;
            //g.drawRoundRect(px, py, _BarWidth, _BarHeight, 2);
            //var containerWidth : Number = _BarWidth - 4;
            //var progWidth : Number = containerWidth * this.progress / 100;
            //g.beginFill(_BarColor);
            g.lineStyle(2, 0xa1865e);
            //g.drawRect(px + 1, py + 1, progWidth, _BarHeight - 3);
            var rad:int = (5 * (this.progress / 10));
            for(var i:int = this.progress; i > 0; i--) {
                g.drawCircle(this.width / 2 + 5, this.height / 2, (5 * (int)(i  / 10) + 1));
                data.draw(this._logo.bitmapData, null, null, null, null, true); 
            } 

            var startX:Number = this.width / 2 + 5;
            var endX:Number = startX + 50;//(rad / 2);
            var startY:Number = (this.height / 2); // - Math.sqrt(Math.pow(rad, 2) - (Math.pow(startX - endX, 2))); 
            var endY:Number = 50;

            g.moveTo(startX, startY);
            g.lineTo(endX, endY);
            g.lineTo(endX + 20, endY);

            var textFormat:TextFormat = new TextFormat();
            textFormat.color = 0xa1865e;
            textFormat.font = creightonEmbeddedFont.fontName;
            textFormat.size = 14;
            textFormat.letterSpacing = 2;

            var text:TextField = new TextField();
            text.defaultTextFormat = textFormat;
            text.embedFonts = true;
            text.text = Math.ceil(progress) + "%";
            text.x = endX + 28;
            text.y = endY - 14;
            text.textColor = 0xa1865e;
            text.width = 100;
            text.height = 20;
            s.addChild(text);

            data.draw(s);

            return data;
        }

        public function set ready(value : Boolean) : void
        {
            this.isReady = value;
            this.visible = !this.isReady;
        }

        public function get ready() : Boolean { return this.isReady; }

    }
}

Answer 1

So I have got a simplified version of your preloader.

Here is my code. We can discuss then which parts should be done in another way if any.

//Application

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
xmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute" minWidth="955" 
minHeight="600" 
preloader="com.timberdesignco.preloader.CustomPreloader">

<mx:Script>
    <![CDATA[
        [Embed("/assets/bmw.png") ]
        [Bindable] public var Office:Class;
    ]]>
</mx:Script>

<mx:Image source="{Office}" horizontalCenter="0" verticalCenter="0"/>

</mx:Application>

//CustomPreloader

package com.timberdesignco.preloader
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.ProgressEvent;
import flash.events.TimerEvent;
import flash.utils.Timer;
import mx.core.Application;
import mx.events.FlexEvent;
import mx.preloaders.DownloadProgressBar;

public final class CustomPreloader extends DownloadProgressBar 
{
    public  var loader : LoadScreenV2;
    private var _timer : Timer;

    public function CustomPreloader() 
    {
        super(); 
    }

    override public function initialize() : void
    {
        super.initialize();

        loader = new LoadScreenV2();
        this.addChild(this.loader);

        loader.x = (this.stage.stageWidth  - this.loader.width)  / 2 - 35;
        loader.y = (this.stage.stageHeight - this.loader.height) / 2;

        this._timer = new Timer(10);
        this._timer.addEventListener(TimerEvent.TIMER, handleTimerTick);
        this._timer.start();
    }

    override public function set preloader(preloader : Sprite):void 
    {                   
        preloader.addEventListener(ProgressEvent.PROGRESS,  SWFDownLoadScreen);
        preloader.addEventListener(Event.COMPLETE,          SWFDownloadComplete);
        preloader.addEventListener(FlexEvent.INIT_PROGRESS, FlexInitProgress);
        preloader.addEventListener(FlexEvent.INIT_COMPLETE, FlexInitComplete);
    }

    private function SWFDownLoadScreen(event : ProgressEvent) : void
    {
        var prog : Number = event.bytesLoaded / event.bytesTotal * 100;

        if (this.loader)
        {
            this.loader.progress = prog;
        }
    }

    private function handleTimerTick(event : TimerEvent) : void
    {
        this.loader.refresh();
    }

    private function SWFDownloadComplete(event : Event) : void 
    {
    }

    private function FlexInitProgress(event : Event) : void {}

    private function FlexInitComplete(event : Event) : void 
    {      
        this._timer.stop();
        this.dispatchEvent(new Event(Event.COMPLETE));
    }

    override protected function showDisplayForInit(elapsedTime:int, count:int):Boolean
    {
        return true;
    }

    override protected function showDisplayForDownloading(elapsedTime:int, event:ProgressEvent):Boolean
    {
        return true;
    }
}
}

//LoadScreenV2

package com.timberdesignco.preloader
{
import flash.display.Graphics;
import flash.display.Sprite;
import flash.text.Font;
import flash.text.TextField;
import flash.text.TextFormat;

import mx.preloaders.IPreloaderDisplay;

public class LoadScreenV2 extends Sprite
{
    private var _progress:Number;
    private var g : Graphics;

    private var startX:Number;
    private var endX:Number;
    private var startY:Number; 
    private var endY:Number;

    private var text:TextField;

    [Embed(source="/assets/Pahuenga.otf", fontFamily="Pahuenga")]
    private var CreightonEmbedded:Class;
    private var creightonEmbeddedFont:Font = new CreightonEmbedded();

    [Embed(source="/assets/LoadingBar-Bark.png")]
    private var MyLogoClass: Class;

    public function LoadScreenV2()
    {
        super();

        init();
    }

    public function get progress():Number
    {
        return _progress;
    }

    public function set progress(value:Number):void
    {
        _progress = value;

        refresh();
    }

    private function init():void
    {
        g = this.graphics;

        startX = this.width / 2 + 5;
        endX = startX + 50;
        startY = (this.height / 2); 
        endY = 50;

        var textFormat:TextFormat = new TextFormat();
        textFormat.color = 0xa1865e;
        textFormat.font = creightonEmbeddedFont.fontName;
        textFormat.size = 14;
        textFormat.letterSpacing = 2;

        text = new TextField();
        text.defaultTextFormat = textFormat;
        text.embedFonts = true;

        text.x = endX + 28;
        text.y = endY - 14;
        text.textColor = 0xa1865e;
        text.width = 100;
        text.height = 20;
        addChild(text);
    }

    override public function get width() : Number 
    {
        return 300;
    }

    override public function get height() : Number 
    {
        return 300;
    }

    public function refresh():void
    {
        g.clear();
        draw();
    }

    protected function draw():void
    {
        g.lineStyle(2, 0xa1865e);

        for(var i:int = this.progress; i > 0; i--) {
            g.drawCircle(this.width / 2 + 5, this.height / 2, (5 * (int)(i  / 10) + 1));
        } 

        g.moveTo(startX, startY);
        g.lineTo(endX, endY);
        g.lineTo(endX + 20, endY);

        text.text = Math.ceil(progress) + "%";
    }


}
}