Transition using the alpha channel

I’m trying to make a transition using the alpha channel, but I found a problem. 

If I try to go from 1-0, everything works perfect.

Code:

Disparo = display.newRect (300,300,50,50)

Disparo :setFillColor(1,0,0)

Telon = display.newRect (500,500,100,100)

Telon :setFillColor(0,1,0,1)

function Cat1 (event)

function Arranque ()

Telon.x= -600

Telon.y= -600

end

transition.to( Telon, { time=1500, delay=0, alpha=0, onComplete=Arranque} )

end

Disparo:addEventListener(“tap”, Cat1)

But, if I go from 0 to 1, does not work. 

I wanna know what I’m doing wrong.

Code:

Disparo = display.newRect (300,300,50,50)

Disparo :setFillColor(1,0,0)

Telon = display.newRect (500,500,100,100)

Telon :setFillColor(0,1,0,0)

function Cat1 (event)

function Arranque ()

Telon.x= -600

Telon.y= -600

end

transition.to( Telon, { time=1500, delay=0, alpha=1, onComplete=Arranque} )

end

Disparo:addEventListener(“tap”, Cat1)

Hello @fferraro67,

I suggest that you do not set the alpha in the “fill” line. So, just do this:

[lua]

Telon:setFillColor(0,1,0)

[/lua]

Then, set the alpha in a separate line:

[lua]

Telon.alpha = 0

[/lua]

And then transition it:

[lua]

transition.to( Telon, { time=1500, delay=0, alpha=1, onComplete=Arranque} )

[/lua]

Thank you, Brent. It works perfectly. Still, I have doubts about what I had written before. If it works one way (the way they had raised me) and the other way does not work, is a problem of the SDK. If not work the other way, would not one way or the other. Do not you think? 

Is it a bug?

Hello,

Just curious about one thing in the code above:

When you go from alhpa 1 to 0 then the end state stays as 0

But when you go from 0 to 1 then the end state goes back to 0  (i would expect it to stay on 1).

Why is it so?

keram

Keram, no you wont get it right. But the code above things work one way and not the other. 

The solution proposed by Brent works perfectly. 

Now a question arises about all this: if it works in one direction and not the other (in the code above) this is clearly a bug. There is no doubt that, since there is no other reason why not.

Hi fferraro,

Yes, you are right, it seems to be a bug and it will be worthwhile to submit it here: http://developer.coronalabs.com/content/bug-submission

I’m not sure what you mean by ‘wont get it right’. Let me clarify what I ment:

Case 1: When going from alpha 1 to 0 the green rectangle fades and at the end stays invisible.

Case 2: When going from alpha 0 to 1 the green rectangle appears from being invisible but it disappears after having reached full visibility.

Why is that? Why does it dissapear again in Case 2? I don’t understand what function Arranque () is doing, so maybe that’s the reason?

the code for Case 2 is:

[lua]

Disparo = display.newRect (300,300,50,50)
Disparo :setFillColor(1,0,0)
Telon = display.newRect (500,500,100,100)
Telon:setFillColor(0,1,0)
Telon.alpha = 0
function Cat1 (event)
function Arranque ()
Telon.x= -600
Telon.y= -600
end
transition.to( Telon, { time=1500, delay=0, alpha=1, onComplete=Arranque} )
end
Disparo:addEventListener(“tap”, Cat1)

[/lua]

but I found a piece of code that works in both directions and the end state (faded or visible) is maintained:

[lua]

fadeButton = display.newRect (300,300,50,50)
fadeButton:setFillColor(1,0,0)
fadeButton.x = display.contentWidth/2
fadeButton.y = 100

square = display.newRect (300,300,100,100)
square:setFillColor(0,1,0)
square.x = display.contentWidth/2
square.y = 300

function fadeButton:tap(event)
   if square.alpha == 1 then
        transition.to(square, {time=1500, delay=0, alpha=0} )
   else transition.to(square, {time=1500, delay=0, alpha=1} )
   end
end

fadeButton:addEventListener(“tap”, fadeButton)

[/lua]

keram

Hello @fferraro67,

I suggest that you do not set the alpha in the “fill” line. So, just do this:

[lua]

Telon:setFillColor(0,1,0)

[/lua]

Then, set the alpha in a separate line:

[lua]

Telon.alpha = 0

[/lua]

And then transition it:

[lua]

transition.to( Telon, { time=1500, delay=0, alpha=1, onComplete=Arranque} )

[/lua]

Thank you, Brent. It works perfectly. Still, I have doubts about what I had written before. If it works one way (the way they had raised me) and the other way does not work, is a problem of the SDK. If not work the other way, would not one way or the other. Do not you think? 

Is it a bug?

Hello,

Just curious about one thing in the code above:

When you go from alhpa 1 to 0 then the end state stays as 0

But when you go from 0 to 1 then the end state goes back to 0  (i would expect it to stay on 1).

Why is it so?

keram

Keram, no you wont get it right. But the code above things work one way and not the other. 

The solution proposed by Brent works perfectly. 

Now a question arises about all this: if it works in one direction and not the other (in the code above) this is clearly a bug. There is no doubt that, since there is no other reason why not.

Hi fferraro,

Yes, you are right, it seems to be a bug and it will be worthwhile to submit it here: http://developer.coronalabs.com/content/bug-submission

I’m not sure what you mean by ‘wont get it right’. Let me clarify what I ment:

Case 1: When going from alpha 1 to 0 the green rectangle fades and at the end stays invisible.

Case 2: When going from alpha 0 to 1 the green rectangle appears from being invisible but it disappears after having reached full visibility.

Why is that? Why does it dissapear again in Case 2? I don’t understand what function Arranque () is doing, so maybe that’s the reason?

the code for Case 2 is:

[lua]

Disparo = display.newRect (300,300,50,50)
Disparo :setFillColor(1,0,0)
Telon = display.newRect (500,500,100,100)
Telon:setFillColor(0,1,0)
Telon.alpha = 0
function Cat1 (event)
function Arranque ()
Telon.x= -600
Telon.y= -600
end
transition.to( Telon, { time=1500, delay=0, alpha=1, onComplete=Arranque} )
end
Disparo:addEventListener(“tap”, Cat1)

[/lua]

but I found a piece of code that works in both directions and the end state (faded or visible) is maintained:

[lua]

fadeButton = display.newRect (300,300,50,50)
fadeButton:setFillColor(1,0,0)
fadeButton.x = display.contentWidth/2
fadeButton.y = 100

square = display.newRect (300,300,100,100)
square:setFillColor(0,1,0)
square.x = display.contentWidth/2
square.y = 300

function fadeButton:tap(event)
   if square.alpha == 1 then
        transition.to(square, {time=1500, delay=0, alpha=0} )
   else transition.to(square, {time=1500, delay=0, alpha=1} )
   end
end

fadeButton:addEventListener(“tap”, fadeButton)

[/lua]

keram