RollOver, RollOut and Release acting up

[Vandenberg]

This must be a very basic question, but I'm lost on it.

The premise is simple. OnRollOver button 'A' gets color 'X', onRollOut button 'A' gets color 'Y', onRelease button 'A' gets color 'Z'.

Now, ofcourse, when a button gets pressed, it gets a highlight color. But as soon as the user rolls out, the onRollOut part kicks in a changes the color back to 'Y', while it should remain at 'Z' as long as no other button is clicked.

This is a very basic problem, but I'm still asking. Is there a way to solve this easily? Do I need to start using booleans and if statements to fix this?

[nathan99]

1. onRelease set a variable to say that the button was the last one pressed
2. for loop through the button to set them all to the Y colour
3. set the saved button (the variable) to colour Z

[Vandenberg]

Ok, I think this might work. However, all buttons have different colors for rollover and rollout, only same color for released.

[Vandenberg]

Okay thanks Nathan, thanks to your advice if found a nice little workaround

[Vandenberg]

Okay well thaty was premature... It's like I shouldn't mess with the rollover and rollout states, they're fine as it is. It's more like I should stop the function from applying to the button movieclip as soon as it's pressed. And reinitiate it as soon as it's pressed again...

[gigaboost]

Should work if it is a single button only, or repeating over several buttons, however if you want the highlight to dissapear after you click another button you need another, global variable.

Pseudo:
onRelease(this.highlighted = true
color = color3
)
onRollOver(if(this.highlighted == false){
color = color2
}else{
//do nothing)

onRollOut(if(this.highlighted == false){
color = color1
}else{
//do nothing)

[nathan99]

or

onPress - set the variable (variable = this)
onMouseUp - if the MC is the variable (this == variable) set the colour to Y, else (otherwise) set the colour to Z
onRollOver - if the MC is not the variable (this != variable) set the colour to X
onRollOut - if the MC is not the variable (this != variable) set the colour to Z

does the desired results effectively?

[Vandenberg]

I did what Gigaboost suggested. However, now the rollover and rollout state stopped working. Is this because this.highlighted isnt defined as false before it has been released and set to true?

Also, I need the highlight to dissapear when another button is clicked. Can that be done with an adition to this code, or does it need to be completely different?

:edit:

this is the code I'm working with. As you can see, I'm using mc tween for the color transitions:

function colorChange() {
    button0_btn.onRelease = function() {
        this.highlighted = true;
        this.shape_mc.ruit_mc.colorTo(0xFFFFFF,0.2,"easeInQuint");
        this.shape_mc.header_holder_mc.colorTo(0xff8043,0.2,"easeInQuint");
    };
    button0_btn.onRollOver = function() {
        if (this.highlighted = false) {
            this.shape_mc.ruit_mc.colorTo(0xbcbec0,0.2,"easeInQuint");
        } else {
            //
        }
        //this.shape_mc.header_holder_mc.colorTo(0xFFFFFF,0.2,"easeInQuint");
    };
    button0_btn.onRollOut = function() {
        if (this.highlighted == false) {
            this.shape_mc.ruit_mc.colorTo(0xE3E4E6,3,"easeOutQuint");
        } else {
            //
        }
        //this.shape_mc.header_holder_mc.colorTo(0xff8043,3,"easeOutQuint");
    };
    
    button1_btn.onRollOver = function() {
        this.shape_mc.ruit_mc.colorTo(0x959799,0.2,"easeInQuint");
    };
    button1_btn.onRollOut = function() {
        this.shape_mc.ruit_mc.colorTo(0xd2d3d5,3,"easeOutQuint");
    };


    button2_btn.onRollOver = function() {
        this.shape_mc.ruit_mc.colorTo(0x818385,0.2,"easeInQuint");
    };
    button2_btn.onRollOut = function() {
        this.shape_mc.ruit_mc.colorTo(0xbcbec0,3,"easeOutQuint");
    };


    button3_btn.onRollOver = function() {
        this.shape_mc.ruit_mc.colorTo(0x6D7072,0.2,"easeInQuint");
    };
    button3_btn.onRollOut = function() {
        this.shape_mc.ruit_mc.colorTo(0xa7a9ac,3,"easeOutQuint");
    };


    button4_btn.onRollOver = function() {
        this.shape_mc.ruit_mc.colorTo(0x57595B,0.2,"easeInQuint");
    };
    button4_btn.onRollOut = function() {
        this.shape_mc.ruit_mc.colorTo(0x939598,3,"easeOutQuint");
    };

}

[Vandenberg]

oke by predefining the highlighted variable as false, both rollover, rollout and release work as they should.

Now, as soon as another button gets pressed, the previously highlighted button should go back to his rollout state. You mentioned a glbal variable for that? How does it work?

[gigaboost]

Are you working with 4 buttons, or are you working with indefinate number of buttons? A very simple solution would be to make 4 variables, 1 for each button and check them against eachother, however this is not optimal if you plan on using many buttons. Btw, you dont need to put this. in front of the variables since you are coding it on the timeline.