Ladekreis in AS3

[hothead89]

Hallo zusammen.
ich habe mich jetz öfters rumprobiert und bin nur auf "unschöne" lösungen gekommen. wie kann man denn einen Ladekreis in AS3 verwirklichen? Progressbar ist ja einfach mit den % zahl verändert man die width des balkens aber wie ist es dann bei einem kreis. Ein beispiel habe ich hierfür hier

::: EuroGrand Casino :::

Sorry hab grad keine andere website gefunden die das hat. Kann mir jemand da helfen
danke

[RustyCake]

Kannst Du AS2 auf AS3 umschreiben?

[hothead89]

ich verstehe as2 , also ja

[RustyCake]

Servus
Hab das selber umgeschrieben, wenn bitMaps verwendet werden (innenRing, aussenRing), ist das nätürlich ein wenig anders

PHP-Code:

import flash.display.MovieClip;
import flash.text.TextField;
//
var aussenRing:MovieClip = new MovieClip();
var gradMc:MovieClip = new MovieClip();
var innerRing:MovieClip = new MovieClip();
var proText:TextField = new  TextField();
//
var XPosLoader:uint = 150;
var YPosLoader:uint = 150;
var gradMcEndGrade:uint = 340;
var gradMcZeichnenStartPunkt:uint = 10;
var gradMcRadius:uint = 75;
var gradMcKreis_pi:Number = Math.PI / 180;
var gradMcAplha:Number = 0.5;
var zeichenSchritte:Number = 1;
var loadedB:Number = 0;
var totalB:Number = 0;
var aussenRingRadius:uint = 80;
var innenRingRadius:uint = 50;
var proTextWidth:uint = 60;
var proTextHeigth:uint = 25;
var proTextYVersatz:uint = 5;
var aussenRingColor:uint = 0x660000;
var gradMcColor:uint = 0xFF6600;
var inneRingColor:uint = 0x660000;
var proTextColor:uint = 0xFF6600;
var proTextSize:uint = 20;
var proTextFont:String = "Myriad Pro";
//
aussenRing.graphics.beginFill (aussenRingColor);
aussenRing.graphics.drawCircle (0,0,aussenRingRadius);
innerRing.graphics.beginFill (inneRingColor);
innerRing.graphics.drawCircle (0,0, innenRingRadius);
aussenRing.x = XPosLoader;
aussenRing.y = YPosLoader;
gradMc.rotation = gradMcZeichnenStartPunkt;
addChild (aussenRing);
aussenRing.addChild (gradMc);
aussenRing.addChild (innerRing);
aussenRing.addChild (proText);
//;
proText.width = proTextWidth;
proText.height = proTextHeigth;
proText.x=(proText.width/2)-proText.width;
proText.y= ((proText.height/2)-proText.height)-proTextYVersatz;
proText.embedFonts = true;
proText.autoSize = TextFieldAutoSize.CENTER;
proText.type = TextFieldType.DYNAMIC;
var pF:TextFormat = new TextFormat();
pF.font = proTextFont;
pF.size = proTextSize;
pF.color = proTextColor;
pF.align = TextFormatAlign.CENTER;
proText.text = "0 %";
proText.defaultTextFormat = pF;
//
function loadFunktion ( uri:String):void {
    gradMc.addEventListener (Event.ENTER_FRAME, gradMcOEF);
    var loader:Loader = new Loader();
    loader.contentLoaderInfo.addEventListener (Event.COMPLETE, completeHandler);
    loader.contentLoaderInfo.addEventListener (ProgressEvent.PROGRESS, progressHandler);
    function completeHandler (e:Event):void {
        var mc:DisplayObject = e.currentTarget.content as DisplayObject;
        //addChild (mc);
    }
    function progressHandler (e:ProgressEvent):void {
        loadedB = e.bytesLoaded;
        totalB = e.bytesTotal;
        proText.text = Math.round((e.bytesLoaded/e.bytesTotal)*100).toString()+" %";
    }
    var request:URLRequest = new URLRequest(uri);
    loader.load (request);
}
//
loadFunktion ("big.jpg");
//
function gradMcOEF (e:Event):void {
    var zeichenGrad:Number = 0;
    var zeichenRate:Number = Math.ceil((loadedB/totalB)*gradMcEndGrade);
    if (zeichenRate >= gradMcEndGrade) {
        gradMc.removeEventListener (Event.ENTER_FRAME, gradMcOEF);
    }
    e.currentTarget.graphics.clear ();
    e.currentTarget.graphics.beginFill (gradMcColor,gradMcAplha);
    e.currentTarget.graphics.lineTo (0,-gradMcRadius);
    while (zeichenGrad-zeichenSchritte>=(-zeichenRate)) {
        zeichenGrad -=  zeichenSchritte;
        var xc:Number =  -  gradMcRadius * Math.sin(zeichenGrad * gradMcKreis_pi);
        var yc:Number =  -  gradMcRadius * Math.cos(zeichenGrad * gradMcKreis_pi);
        e.currentTarget.graphics.lineTo (xc,yc);
    }
    e.currentTarget.graphics.endFill ();
}
// 


[hothead89]

hey,
ent gut! Danke dir vielmals...is krass, hätte nicht gedacht dass das gleich so viel code ist ^^
danke !!!!

[RustyCake]

Update: Mit png's statt gezeichneten Kreisen.

PHP-Code:

var aussenRingMc:MovieClip = new aussenRing();//aussenRing ist Klasse in der Bibliothek,, Transparentes PN
var gradMc:MovieClip = new MovieClip();
var innenRingMc:MovieClip = new  innenRing();//innenRing ist Klasse in der Bibliothek, Transparentes PNG
var proText:TextField = new  TextField();
//
var XPosLoader:uint = 150;
var YPosLoader:uint = 150;
var gradMcEndGrade:uint = 340;
var gradMcZeichnenStartPunkt:uint = 10;
var gradMcRadius:uint = 90;
var gradMcKreis_pi:Number = Math.PI / 180;
var gradMcAplha:Number = 0.7;
var zeichenSchritte:Number = 1;
var loadedB:Number = 0;
var totalB:Number = 0;
var proTextWidth:uint = 60;
var proTextHeigth:uint = 25;
var proTextYVersatz:uint = 5;
var gradMcColor:uint = 0x990000;
var proTextColor:uint = 0xCC6600;
var proTextSize:uint = 20;
var proTextFont:String = "Myriad Pro";
//
aussenRingMc.x = XPosLoader;
aussenRingMc.y = YPosLoader;
gradMc.rotation = gradMcZeichnenStartPunkt;
addChild (aussenRingMc);
aussenRingMc.addChild (gradMc);
aussenRingMc.addChild (innenRingMc);
aussenRingMc.addChild (proText); 


Alle oberhalb von :

PHP-Code:

proText.width = proTextWidth; 


austauschen.

[milchreis]

Guck mal hier:

Rounded Rect Umrandranung per Script zeichnen?

die RectCakeMask Klasse ist ein Quadrat das die von dir gewünschte Funktionalität mitbringt.

Maskiere damit einfach einen Kreis oder Ring und du erhälst dein gewünschtes Ergebnis.

[RustyCake]

Sehr schön
Beim nächsten mal vielleicht.

Aber ich schreib jetzt das Ding nicht nochmal um.
Zumal es ja funktioniert

Aber wenn Du Spaß dran hast, kannst das obige gerne umschreiben