argb farbwert anpassen, farbe a zu farbe b

[salazar]

hi ihrs,
ich steh grad etwas auf dem schlauch. ist vielleicht auch einfach schon zu spät, bzw. zu früh

ich habe ein paar partikel, und diese sollen ihre farbe ändern. ich kann jedem partikel zu begin einen farbwert mitgeben.. also z.B.

PHP-Code:

pixel.pixColor = 0xFFFFCC00; 


das ist so ein gelb/orange.
ich würde jetzt gerne hingehen und diese farbe 0xFFFFCC00 schritt für schritt in ein 0xFFCC0000.. also ein dunkles rot umfärben. oder in eine andere beliebige farbe.
sollte ja nicht zu kompliziert sein, bzw. ich mein das ich das schonmal gemacht habe hier und da. aber lang lang ists her und wie gesagt ists schon ein bissal spät. wohl deshalb fallen mir grad nur tierisch umständliche und somit nicht performante wege ein... dann kann ich mir das auch gleich wieder sparen und weiterhin die partikel mit einem teuren ColorTransform umfärben... aber ich will ja etwas mehr performance rauskitzeln aus der sache.
ein tween package kommt nicht in frage... hat viel zu viel gepäck mit an bort. es geht mir um die berechnung, bzw eine schöne knackige formel.
interessant wäre es hierbei auch noch den alpha kanal separat step by step zu verändern/verringern. also die farbe auf der einen seite und den alphawert auf der anderen getrennt von einander.

danke und grüße,
sal

[kRizzl]

haha ja moin moin, auch noch wach

also tweenmax (oder evtl tweenfilterdings oder sogar tweenlite) kann direkt von einem farbwert aufn anderen tweenen, das is schoen easy.
ansonsten muesstest du jeweils den wert in die komponenten zerlegen und einzeln aendern und das wieder zu nem rgb-wert basteln. was anderes macht tweenmax sicher auch nich.

int argb = quasi 0xaarrggbb;
int b = (argb & 0x000000ff);
int g = (argb & 0x0000ff00) >> 8;
int r = (argb & 0x00ff0000) >> 16;
int a = (argb & 0xff000000) >> 24;

dann musste lediglich pro komponente zwischen start- und endwert interpolieren.
also zb r_neu = r_end * (step) + r_end * (1-step); wobei step von 0-1 geht.

so, formatieren kann jetzt jemand anders machen, ich hau mich endlich hin (;

gruss

[salazar]

ja servus chris,
da warste ja noch länger wach als ich...
aber wenn ich mir das so durchlese hatteste wohl noch nicht so viel bierle drinn wie ich

erst mal danke für deine erklärung. an eine lösung mit bitverschiebung hatte ich auch schon gedacht...
aber so hundert prozent ist mir das noch nicht ganz klar. kannste das evtl noch etwas mehr konkretisieren? speziell den part mit dem interpolieren bitte

würde mir für das ganze gerne eine function/methode schreiben...
hier mal so der ganz grobe anfang.

PHP-Code:

function transformColor( argbColorOld:Number, argbColorNew:Number, step:Number ):Number {

    var aOld:Number = ( argbColorOld & 0xff000000 ) >> 24;
    var rOld:Number = ( argbColorOld & 0x00ff0000 ) >> 16;
    var gOld:Number = ( argbColorOld & 0x0000ff00 ) >> 8;
    var bOld:Number = ( argbColorOld & 0x000000ff ) >> 0;

    var aNew:Number = ( argbColorNew & 0xff000000 ) >> 24;
    var rNew:Number = ( argbColorNew & 0x00ff0000 ) >> 16;
    var gNew:Number = ( argbColorNew & 0x0000ff00 ) >> 8;
    var bNew:Number = ( argbColorNew & 0x000000ff ) >> 0;
    
    //ab hier wirds haarig :D
    
    var aRet:Number = aNew * ( step ) + aNew * ( 1 - step );
    var rRet:Number = rNew * ( step ) + rNew * ( 1 - step );
    var gRet:Number = gNew * ( step ) + gNew * ( 1 - step );
    var bRet:Number = bNew * ( step ) + bNew * ( 1 - step );
    
    return ( ( aRet << 24 ) + ( rRet << 16 ) + ( gRet << 8 ) + ( bRet << 0 ) );

} 


naja, da muss ich noch viel drann rumtüfteln. hab ich jetzt nur mal so zusammengeschustert die function. wär schön wenn mir hierbei jemand helfen könnte.

grüße

[hellslawyer]

Ahoi Nik,

wenn Du mit Steps arbeiten willst, wäre ja mein Ansatz eher, über den ColorMatrix-Filter zu gehen. Da würdest Du Dir das rumgewürge mit den hex-Zahlen zumindest ersparen, weil Du nur ne Matrix von 0-1 hast für den jeweiligen Wert. Als return könntest Du dann entweder direkt nen Array oder eben nur den Filter selbst nehmen.
Allerdings müsste man mal testen, welche Version performanter ist

[padavan]

also ich sowas gemacht aber nicht mit fixen step-größen pro kanal sondern fixe step-anzahl bei allen kanälen

sieht dann in deinem bsp ungefähr so aus:

PHP-Code:

function transformColor( argbColorOld:Number, argbColorNew:Number, step:Number, steps_max:Number ):uint {

    var aOld:Number = ( argbColorOld & 0xff000000 ) >> 24;
    var rOld:Number = ( argbColorOld & 0x00ff0000 ) >> 16;
    var gOld:Number = ( argbColorOld & 0x0000ff00 ) >> 8;
    var bOld:Number = ( argbColorOld & 0x000000ff ) >> 0;

    var aNew:Number = ( argbColorNew & 0xff000000 ) >> 24;
    var rNew:Number = ( argbColorNew & 0x00ff0000 ) >> 16;
    var gNew:Number = ( argbColorNew & 0x0000ff00 ) >> 8;
    var bNew:Number = ( argbColorNew & 0x000000ff ) >> 0;
    
    //ab hier wirds haarig :D 
    
    var aRet:Number = aOld - ( (aOld-aNew)*(step/steps_max) ) ;
    var rRet:Number = rOld - ( (rOld-rNew)*(step/steps_max) ) ;
    var gRet:Number = gOld - ( (gOld-gNew)*(step/steps_max) ) ;
    var bRet:Number = bOld - ( (bOld-bNew)*(step/steps_max) ) ;
    
    return ( ( aRet << 24 ) + ( rRet << 16 ) + ( gRet << 8 ) + ( bRet << 0 ) );

} 


aber das hab ich in der art mit colortransform gemacht - also keine hex - k.A. ob man's so übersetzen kann.....
und gibst du nicht eine uint zurück?

[kRizzl]

interpolation bedeutet in dem fall einfach das finden von nem wert c zwischen zwei bekannten werten a, b. in dem fall ist das die einfachste, lineare interpolation (siehe easing equations).
dazu wird quasi immer ein teil (step) von a genommen und der umgekehrte teil von b genommen (1-step)..
zb a = 5, b = 10, step = 0.5 (also genau die mitte zwischen beiden),
c = 5 * 0.5 + 10 * (1-0.5) = 5 * 0.5 + 10 * 0.5 = 2.5 + 5 = 7.5

wenn Du mit Steps arbeiten willst, wäre ja mein Ansatz eher, über den ColorMatrix-Filter zu gehen.

also step auf der diagonalen und die komponenten der endfarbe * (1-step) in der letzten spalte? dann kaeme man auch nicht ganz um "hex-gewuerge" drumrum (:
koennte je nach rahmenbedingungen allerdings schneller sein, stimmt scho.

also ich sowas gemacht aber nicht mit fixen step-größen pro kanal sondern fixe step-anzahl bei allen kanälen

sinn?

und gibst du nicht eine uint zurück?

uint wird in flash leider intern ueber Number abgebildet, daher bringt das nuescht.

[salazar]

hi,
grüß euch.

@reinhart
das müßte man mal so austesten. aber bin mit der jetzigen lösung eigentlich schon super zufrieden.
edit: aber mehr speed wär natürlich eine sehr feine sache. hm...

@padavan
danke. du hast den stein entgültig ins rollen gebracht. genau so wollte ich das auch haben. funktioniert bisher einwandfrei. wegen dem return... war ja noch nicht ganz fertig mit der function. zudem funktioniert das mit Number genauso so gut.

hier nochmal die function:

PHP-Code:

function transformColor( argbColorOld:Number, argbColorNew:Number, step:Number, steps_max:Number ):Number {
            
            var aOld:Number = ( argbColorOld & 0xff000000 ) >> 24;
            var rOld:Number = ( argbColorOld & 0x00ff0000 ) >> 16;
            var gOld:Number = ( argbColorOld & 0x0000ff00 ) >> 8;
            var bOld:Number = ( argbColorOld & 0x000000ff ) >> 0;
        
            var aNew:Number = ( argbColorNew & 0xff000000 ) >> 24;
            var rNew:Number = ( argbColorNew & 0x00ff0000 ) >> 16;
            var gNew:Number = ( argbColorNew & 0x0000ff00 ) >> 8;
            var bNew:Number = ( argbColorNew & 0x000000ff ) >> 0;

            var aRet:Number = aOld - ( ( aOld - aNew ) * ( step / steps_max ) ) ;
            var rRet:Number = rOld - ( ( rOld - rNew ) * ( step / steps_max ) ) ;
            var gRet:Number = gOld - ( ( gOld - gNew ) * ( step / steps_max ) ) ;
            var bRet:Number = bOld - ( ( bOld - bNew ) * ( step / steps_max ) ) ;
            
            return ( ( aRet << 24 ) + ( rRet << 16 ) + ( gRet << 8 ) + ( bRet << 0 ) );
        
        } 


danke nochmal an alle beteiligten und viele grüße!

edit: hey chris. super sache. ich dank dir für die erklärung!
kommste eigentlich bald mal rum, oder sieht man sich erst wieder beim pokern?

[hellslawyer]

Zitat von salazar

@reinhart
das müßte man mal so austesten. aber bin mit der jetzigen lösung eigentlich schon super zufrieden.
edit: aber mehr speed wär natürlich eine sehr feine sache. hm...

Naja, ich denke Filter könnten genau dann Speed geben, wenn es bei dem Objekt um nen Bild oder ähnliches geht. Wenn es um Pixelmanipulation geht, dürfte das nen absoluter Performancekiller werden und die Rechenmethode definitiv schneller sein
Ansonsten können Filter aber durchaus flink sein, wenn nicht zu viel drumherum ist, musste ich selbst erstaunt feststellen

[padavan]

Zitat von kRizzl

sinn?

das war viell. etwas kryptisch - sollte heißen:
entweder man geht immer fixe step-weiten (z.b. immer +1 pro kanal) dann dauern die Transformation zwischen den einzelnen kanälen verschieden lang oder man teilt die differenzen in jeweils die gleiche anzahl von schritten - so in meinem beispiel

@salazar: schön dass es dir geholfen hat..

gruß
thomas

[salazar]

@reinhart:
jupp. es geht in diesem speziellen fall um partikel die ich in ein bitmapData zeichne. ich habe zuvor die farbe mit einem ColorTransform und einem farb multiplier manipuliert. zum einen war das ergebnis nicht wirklich zufriedenstellend und zum anderen hat die ganze aktion viel performance gekostet. so wie es jetzt ist läuft es schonmal ganz gut

@thomas:
ja, wie gesagt danke

anbei der aktuelle stand. das sind ca. 550 partikel mit einer collision detection untereinander und den großen objekten. werd da aber noch ein bissal weiter drann rumschrauben.

grüße,
niklas

[hellslawyer]

Sehr schickes Teil! Da wäre die Filtervariante wohl definitiv nicht die performanteste.
Das willst Du doch bestimmt dann später mal in den Stuff-Bereich packen, gelle?!

[salazar]

danke. schaun ma mal. bei so flash experimenten weiß man ja oft gar nicht genau wohin einen der weg führen wird. werde da aber definitv noch was drann weiter schrauben und wenns dann immer noch einigermaßen schnieke ausschaut auch evtl. im stuff bereich posten

grüße

[mohj]

Sieht echt klasse aus. Und das bei konstanten 90 FPS, sehr sauber!