Page 1 of 2

day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 3:45 am
by master0500
Using canvas, how could i make it change transparency to give the impression of day/night?

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 4:59 am
by skydereign
Why canvas? If you just want to change transparency, then you can use a black actor over the screen. Transparency at 1 would be closest to day, while at 0 would be completely black.

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 5:03 am
by master0500
because i want to learn how to use canvas for various things

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 12:08 pm
by lcl
No that's not something you should use a canvas for..
You use canvas for drawing lines and pictures and stuff, you don't use it for
making the world seem darker or lighter, that is not clever because canvas actors always
slow down your game a little. If you have 3 - 4 whole screen size canvas actors you'll already be facing
slowdown caused by those canvas actors. That is why when ever you can use something else than canvas, it is better to not use canvas. :)

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 12:54 pm
by master0500
OK, I'm using the black actor as sky suggested, but how can i make it so it darkens, and stays like that for a while, then lightens and stays like that for a while as well as having a sun and moon arcing across the sky?

the code i am currently using is
Night>DrawActor>Script editor
Code: Select all
transp = transp - .001;


thanks

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 4:45 pm
by Kalladdolf
I'd even not use transparency, but rgb values.
R = red.
G = green.
B = blue.

Script example:
Code: Select all
r = 0;
g = 0;
b = 0;
// now your actor is pitchblack.


If all of them are at 255, your actor will have its full brightness. Turn either of them up or down, your actor will be darker and adapt different tones of color.
I'd suggest a little trial and error playing around and you'll just find the right colors you're looking for.

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 6:28 pm
by skydereign
Kalladdolf wrote:I'd even not use transparency, but rgb values.

Well if it isn't transparent, you won't be able to see behind it. Though the most dynamic way is to combine both. That way you can have different tinted sky colors. You can set the color to black, red, or any other color you'd like. And change the transp to match the environment you want.

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 9:23 pm
by Kalladdolf
skydereign wrote:Well if it isn't transparent, you won't be able to see behind it.

Hence I'd also trash the black box. :3

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 11:04 pm
by master0500
but cant i just set the min value at .3 if i don't want it ti become fully black?

PS. my game is black and white, so i have no need for tinting the sky

Re: day/night cycle using canvas

PostPosted: Sun Jul 08, 2012 11:56 pm
by skydereign
Kalladdolf wrote:
skydereign wrote:Well if it isn't transparent, you won't be able to see behind it.

Hence I'd also trash the black box. :3

That was the point. When transp is set to 0, it is entirely black (no light). But if it were a moonlit night, you would want some light, and have transp at 0.3 or similar.

master0500 wrote:but cant i just set the min value at .3 if i don't want it ti become fully black?

Yeah, you can. Just make it never go below 0.3. We were just pointing out what could be done, not entirely what you were going to do.

Re: day/night cycle using canvas

PostPosted: Mon Jul 09, 2012 1:54 am
by master0500
ok but what about:
master0500 wrote:How can i make it so it darkens, and stays like that for a while, then lightens and stays like that for a while as well as having a sun and moon arcing across the sky?

Re: day/night cycle using canvas

PostPosted: Mon Jul 09, 2012 4:14 am
by skydereign
Assuming you are using an actual rotating sun, you can use the angle to determine how bright it should be. Something like this.
Code: Select all
double ang = (int)abs(90-sun_angle)%360;
if(ang>180.0)
{
    ang = 360.0-ang;
}
transp = 1.0-(ang/180.0)*0.7;

Re: day/night cycle using canvas

PostPosted: Mon Jul 09, 2012 4:24 am
by master0500
what do you mean rotating?

Re: day/night cycle using canvas

PostPosted: Mon Jul 09, 2012 4:40 am
by skydereign
Rotating meaning a sun moving in a circle. 90 degrees meaning noon, 270 degrees meaning midnight. You said you wanted the sun and moon to pass through the sky, so rotating around constantly makes sense. If you skip the rotation, you can still use the same code, just have sun_angle be a variable that constantly increases.

Re: day/night cycle using canvas

PostPosted: Mon Jul 09, 2012 5:02 am
by master0500
ah right