Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

A simple color transition function for corona
Started by danielr0 Apr 27 2016 08:24 PM

3 replies to this topic
color transition

Best Answer davebollinger , 28 April 2016 - 03:03 AM

your solution is clever, though there is an easier way:

local rect = display.newRect(50,50,100,100)
rect:setFillColor(0,0,0,0)
transition.to( rect.fill, { r=1, g=1, b=1, a=1, time=500, transition=easing.inCubic })

[TOPIC CONTROLS]
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

danielr0

[GLOBAL: userInfoPane.html]
danielr0
  • Enthusiast

  • 44 posts
  • Corona SDK

Hi guys,

 

While working on my project, I found I needed to be able to animate display objects' colors.

Corona doesn't seem to support this functionality.

A google search seems to make references to someone who made a library for this, but I couldn't find it at all since the links google has are old.

So, I made my own.

 

Here you go.

https://code.coronalabs.com/code/display-object-color-transition

 

code.coronalabs doesn't have a comment system, so use this topic as a way to communicate with me and provide feedback/ideas/abuse.

 

Ideas:

- start/complete callbacks

- pause/resume

- easing options for non-linear interpolation



[TOPIC: post.html]
#2

danielr0

[GLOBAL: userInfoPane.html]
danielr0
  • Enthusiast

  • 44 posts
  • Corona SDK

Hello again.

 

Decided I needed to implement corona's easing library.

See the revised gist.

 

For those who are wondering how corona's easing library works:

See this implementation https://github.com/EmmanuelOga/easing/blob/master/lib/easing.lua

Corona's is almost exactly the same, except I've figured out that corona has swapped the variable positions around in the function parameters

For example, you can call robert penners easing.linear(time, begin, change, duration)

Corona's swapped them around to easing.linear(time, duration, begin, change)

Which does make a lot more sense.

 

Anyway, if you update with my gist, you will have the option of using corona's easing library like so:

TransitionColor(displayObj, {
    startColor = {0,0,0,0},
    endColor = {1,1,1,1},
    transition = easing.outCubic
})

And if you decide to omit the transition parameter, it will default to easing.linear, just like corona does.



[TOPIC: post.html]
#3

davebollinger

[GLOBAL: userInfoPane.html]
davebollinger
  • Corona Geek

  • 1,319 posts
  • Enterprise

  Best Answer

your solution is clever, though there is an easier way:

local rect = display.newRect(50,50,100,100)
rect:setFillColor(0,0,0,0)
transition.to( rect.fill, { r=1, g=1, b=1, a=1, time=500, transition=easing.inCubic })


[TOPIC: post.html]
#4

danielr0

[GLOBAL: userInfoPane.html]
danielr0
  • Enthusiast

  • 44 posts
  • Corona SDK

You have to be kidding me hahaha. Well, that was fun while it lasted.




[topic_controls]
[/topic_controls]