Actuate change color problem

Help
#1

Hi OpenFL Community, I am trying to change display object color with Actuate, according actuate doc, but does’t works.

This is my simple code:

var myButton:Sprite = cast(e.target, Sprite);	
var color:UInt = 0xFFFFFF;		
var arrow:DisplayObject = myButton.getChildByName('arrow');	
Actuate.transform(arrow, 1).color(color);

HELP PLEASE!

#2

Hi VBS.

Are you targeting HTML5 by chance? I think it’s related to this: http://community.openfl.org/t/solved-help-applying-colortransform-to-svg-images/8548/2
Does it work if you’re targeting flash?
This code snippet runs fine over here:

        var myButton:Sprite = new Sprite();
        var shape:Shape = new Shape();
        shape.graphics.beginFill(0x00ff00,1);
        shape.graphics.moveTo(0, 0);
        shape.graphics.lineTo(100, 0);
        shape.graphics.lineTo(100, 100);
        shape.graphics.lineTo(0, 100);
        shape.graphics.lineTo(0, 0);
        shape.graphics.endFill();
        shape.name = "arrow";
        addChild(myButton);
        myButton.addChild(shape);
        var color:UInt = 0xFFFFFF;    
        var arrow:DisplayObject = myButton.getChildByName("arrow");    
        Actuate.transform(arrow, 1).color(color);
#3

Hi @obscure yes I am targeting HTML5, porting AS3 project to OpenFl and using swf library to load assets.
What I am trying to do is to get item from library, this item has lot of children inside (Sprites), find one of them and change color.

is there any workaround?
@singmajesty can you help me?

#4

Hey VBS.

In the post I’ve linked, singmajesty mentioned you have to use bitmapData.colortransform to change the color.
Problem is you can’t smoothly tween from one color to another that way. Luckily there’s a workaround. The idea is to create a Bitmap duplicate of your target shape (myButton.arrow), make this a child of myButton and instead of using Actuate to tween between colors use Actuate to fade the duplicate in/out.
Check out this example:

package;

import openfl.display.*;
import openfl.Lib;
import motion.*;
import openfl.geom.*;
import openfl.Assets;
import openfl.events.MouseEvent;

class Main extends Sprite 
{
    private var localColor:ColorTransform = new ColorTransform();
    public function new() 
    {
        super();
        var myButton:Sprite = new Sprite();
        var shape:Shape = new Shape();
        shape.graphics.beginFill(0x00ff00,1);
        shape.graphics.moveTo(0,20);
        shape.graphics.lineTo(50,20);
        shape.graphics.lineTo(50,0);
        shape.graphics.lineTo(80,30);
        shape.graphics.lineTo(50,60);
        shape.graphics.lineTo(50,40);
        shape.graphics.lineTo(0,40);
        shape.graphics.lineTo(0,20);
        shape.graphics.endFill();
        shape.name = "arrow";
        addChild(myButton);
        myButton.addChild(shape);
        localColor.color = 0x0000ff;  
        
        myButton.addEventListener(MouseEvent.ROLL_OVER, rollOver);
        myButton.addEventListener(MouseEvent.ROLL_OUT, rollOut);
    }
    
    private function duplicateAsBitmap(parentObj:DisplayObjectContainer,targetObj:DisplayObject):Void
    {
        var bitmapData:BitmapData = new BitmapData (Math.ceil (targetObj.width), Math.ceil (targetObj.height), true, 0x00000000);
        bitmapData.draw(targetObj);
        bitmapData.colorTransform(bitmapData.rect, localColor);
        var bmp:Bitmap = new Bitmap(bitmapData);
        bmp.name = "bmpDup";
        parentObj.addChild(bmp);
    }
    
    private function rollOver(e:MouseEvent):Void
    {
        if (!Std.is(cast(e.target, Sprite).getChildByName("bmpDup"), Bitmap))
        {
            duplicateAsBitmap(cast(e.target, Sprite),cast(e.target, Sprite).getChildByName("arrow"));          
        }
        Actuate.update (fadeColor, 1, [cast(e.target, Sprite).getChildByName("bmpDup"),0], [cast(e.target, Sprite).getChildByName("bmpDup"),1]);
    }
    
    private function rollOut(e:MouseEvent):Void
    {
        if (!Std.is(cast(e.target, Sprite).getChildByName("bmpDup"), Bitmap))
        {
            duplicateAsBitmap(cast(e.target, Sprite),cast(e.target, Sprite).getChildByName("arrow"));            
        }
        Actuate.update (fadeColor, 1, [cast(e.target, Sprite).getChildByName("bmpDup"),1], [cast(e.target, Sprite).getChildByName("bmpDup"),0]);        
    }    
    
    private function fadeColor(ob:Bitmap,val:Float):Void
    {
        ob.alpha = val;
    }
}
1 Like
#5

thanks, @obscure I will try and report back
@singmajesty when do you plan to implement actuate color transform in HTML5?

Actuate.transform (MySprite, 1).color (0xFF0000, 0.5);
#6

Here’s the current status: