Zuerst erkläre ich das Prinzip, dann den Zeichnungsteil:
In meinem Beispiel gehe ich davon aus, dass Sie einen Fortschrittswert von 0 bis 100 (%) haben, obwohl alles andere ausreicht.
Auf einer geraden Linie wäre die aktuelle Position des Fortschrittsbalkens einfach dieser Fortschrittswert.
Auf einem Kreis erhalten Sie diese Position mit Trigonometrie. Jeder Punkt auf einem Kreis wird wie folgt angegeben:
point.x = r * cos(angle);
point.y = r * sin(angle);
Dabei ist r der Radius des Kreises. Wie Sie sehen, ist der Winkel die einzige Variable in diesen Gleichungen. Das bedeutet, dass Sie Ihren Fortschritt irgendwie in den Winkel integrieren müssen.
Die Lösung ist einfach: Ein "Lauf" um den Kreis entspricht 2 * Pi (oder 360 Grad). Sie müssen diesen Abstand in 100 kleinere Teile aufteilen, damit bei einem Fortschrittswert von 100 der Wert innerhalb von cos () und sin () 2 * pi (oder 360 Grad) beträgt.
Sie erreichen dies, indem Sie einfach 2 * pi (oder 360 Grad) durch 100 teilen und mit dem Fortschritt multiplizieren:
float step = 2*pi/100;
point.x = r * cos(progress * step);
point.y = r * sin(progress * step);
Nun zum Zeichnungsteil.
Ich weiß nichts über Actionscript3 (oder Flash), daher kann ich Ihnen die genauen Verfahren nicht mitteilen, aber im Allgemeinen gibt es zwei Möglichkeiten, dies zu tun:
Erstens und (meiner Meinung nach einfacher von beiden): Zeichnen Sie den Teilkreis manuell als einfache Verbindung von farbigen Linien mit einer bestimmten Dicke (wenn Sie keine Textur darauf benötigen und eine einfache Farbe ausreicht), oder zeichnen Sie den Kreis als Verbindung von strukturierten Quads (wenn Sie eine Texturierung benötigen).
Zweitens: Sie zeichnen ein Bild, das Ihren vollständig geladenen Kreis darstellt, und laden es als Textur, legen es auf ein Quad und rendern es. Anschließend zeichnen Sie erneut manuell einen Teilkreis über dieses Quad und rendern nur den Teil des strukturierten Quad, auf dem der Kreis davor gerendert wird. In OpenGL können Sie dies beispielsweise problemlos mit dem Schablonenpuffer tun.
Wenn Sie wissen möchten, wie Sie die verschiedenen Punkte auf Ihrem Kreis berechnen, um daraus die erforderlichen Polygone / Linien zusammenzusetzen, können Sie sich die obigen Gleichungen noch einmal ansehen:
point.x = r * cos(angle);
point.y = r * sin(angle);
Sie können diese in einer for-Schleife ausführen, die von 0 bis zu Ihrem aktuellen Fortschritt reicht, wenn es sich beispielsweise um einen Kreis handelt, der aus einer Reihe verbundener Punkte besteht (in C ++ - Syntax):
float granularity = 2*PI/required_granularity; //determines how smooth your circle will look
float step = 2*PI/100.0f;
list<Vector2> points; //list of all the calculated points
for(float angle=0; angle < progress*step; angle += granularity)
{
Vector2 point(radius*cos(angle), radius*sin(angle));
points.push_back(point); //adds the point to the list
}
Jetzt werden diese Punkte alle auf den Ursprung Ihres Koordinatensystems zentriert, sodass Sie sie an die Position verschieben müssen, an der sich Ihr Kreis befinden soll. Aber ich denke, Sie können das selbst herausfinden: P.