RGB-Farbverlauf basierend auf Prozentsatz der geladenen Datei

Question

Ich arbeite an meinem ersten Flash-Projekt, und für meinen Preloader möchte ich einen wirklich einfachen Farbverlauf basierend auf dem Prozentsatz geladen machen. Der Preloader sagt "77% geladen ...", wobei die Zahl 77 eine dynamische Textinstanz ist, die percentLoaded heißt. Ich möchte, dass sich die textColor von percentLoaded auf einem Farbverlauf von # 000000 zu #FFFFFF in Graustufen ändert.

Daher kann ich nicht einfach tun:

percentLoaded.textColor=(currentValue/100)*0xFFFFFF; 

Dieser wandelt nur die Textfarbe auf ein Vielfaches von FFFFFF, sondern gibt eine Farbe, da es nicht drei separate Komponenten ist. Derzeit ist hier, was ich habe:

percentLoaded.text=currentValue.toString(); 
percentLoaded.textColor=rgb2hex((currentValue/100)*255, (currentValue/100)*255, (currentValue/100)*255); 

Wo „rgb2hex“ ist eine Funktion innerhalb der Klasse als solche definiert:

public function rgb2hex(r:Number, g:Number, b:Number) { 
    return '0x'+(r << 16 | g << 8 | b).toString(16).toUpperCase(); 
} 

Es sieht nicht so wirklich verändert die Farbe des die Schriftart aber. Ich habe flash.text.TextField und flash.display.MovieClip importiert, bin mir aber nicht sicher, ob ich etwas anderes vermisse. Wäre das mit String-Verkettung einfacher? Oder gibt es vielleicht etwas mit currentValue/100 und übergibt das als Nummer?

Wenn neugierig, fand ich den Code für rgb2hex here.

Danke!

Answer 1

percentLoaded.textColor=(currentValue/100)*0xFFFFFF; 

Diese enge ist.

ein Graustufen zu erhalten, Sie in der Tat jede Komponente haben müssen, aber dies kann noch durch ein ähnliches Verfahren von Ihnen getan werden: Sie

percentLoaded.textColor = uint((currentValue/100) * 0xFF) * 0x010101; 

Answer 2

percentLoaded.textColor = int((currentValue/100) * 0xFF) * 0x010101; 

Die Umwandlung in einen int vor der Multiplikation mit 0x010101 ist ein Muss. 8-Bit-Farbwerte können nur Ganzzahlen zwischen 0 und 255 sein. Wenn es nicht innerhalb dieser Grenzen liegt, könnte die Multiplikation mit 0x010101 dazu führen, dass Zahlen von einer Farbkomponente (RR, GG, BB) zu einer anderen überlaufen (B-> G, G-> R). Sie können aber auch den anderen Weg führen, wenn nicht eine ganze Zahl (R-> G, G-> B). Ich habe currentValue als Zahl zwischen 0-100 angenommen.

Betrachten Sie diese, wobei jede Ziffer seine eigene Farbkomponente (dezimal):

5.0 * 111 = 555 = 5R, 5G, 5B 
5.5 * 111 = 610.5 = 6R, 1G, 0.5B 

Answer 3

Wenn das funktioniert für Sie

percentLoaded.textColor=(currentValue/100)*0xFFFFFF; 

Dann könnte einfach

var percent = currentValue/100; 
percentLoaded.textColor = Math.floor(percent*0xFF) * 0x010101; 

Answer 4

Sie haben Glück, ich habe das gerade erst in einem Projekt getan, nur mit anderen nt Farben. Hier ist eine Funktion, die einen Farbwert zwischen zwei anderen Farben basierend auf einem Bereich von 0-1 zurückgibt. Ich denke, der Code ist ziemlich selbsterklärend, aber lassen Sie mich wissen, wenn Sie auf irgendwelche Probleme stoßen.

private function getBetweenColourByPercent(value:Number = 0.5 /* 0-1 */, highColor:uint = 0xFFFFFF, lowColor:uint = 0x000000):uint { 
    var r:uint = highColor >> 16; 
    var g:uint = highColor >> 8 & 0xFF; 
    var b:uint = highColor & 0xFF; 

    r += ((lowColor >> 16) - r) * value; 
    g += ((lowColor >> 8 & 0xFF) - g) * value; 
    b += ((lowColor & 0xFF) - b) * value; 

    return (r << 16 | g << 8 | b); 
} 

Tyler.