Fade in to another layout

Get help using Construct 2

Post » Sat Dec 17, 2011 1:34 pm

After clicking start on the menu, I would like the next layout to fade in, instead of just suddenly appearing, how could I accomplish this?
B
2
G
1
Posts: 10
Reputation: 495

Post » Sat Dec 17, 2011 1:39 pm

Full black layer above all others. Starting from start of layout, gradually reduce layer's opacity until it becomes fully transparent, at which you can disable it altogether.

Bonus points: add a "loading" sprite or something.
B
62
S
21
G
12
Posts: 1,910
Reputation: 13,155

Post » Sat Dec 17, 2011 1:56 pm

Example capx

As you can see, the button object appears on top, whatever layer it is.
Use sprites as buttons, they'll get covered.

EDIT: See this post for a more recent example (2015 with r206), simpler, using the fade behavior
New to Construct ? Where to start

Image Image
Image Image

Please attach a capx to any help request or bug report !
Moderator
B
208
S
71
G
32
Posts: 6,350
Reputation: 48,951

Post » Thu Sep 20, 2012 2:25 am

Thanks! Great example
B
32
S
7
G
5
Posts: 32
Reputation: 5,220

Post » Thu Oct 18, 2012 9:11 pm

[QUOTE=Mipey] Full black layer above all others. Starting from start of layout, gradually reduce layer's opacity until it becomes fully transparent, at which you can disable it altogether.
[/QUOTE]


How do you "gradually reduce" the value of the opacity at runtime?
B
19
S
3
G
2
Posts: 212
Reputation: 3,976

Post » Sat Dec 22, 2012 4:52 pm

Fade Behavior
(\__/)
(='.'=)
(")_(")
B
20
S
9
G
1
Posts: 60
Reputation: 3,039

Post » Sat Dec 22, 2012 7:38 pm

In order to fade away the layer, you'd do something like:

System > On layout start > Black Screen > Set Opacity to 100
                           System > Wait .5sec
                           Black Screen > Opacity 80
                           System > Wait .5sec
                           Black Screen > Opacity 60

etc.

So basically, every half second, you'd be lowering the opacity of the object until it reaches zero. At that rate, the screen will transition from black to invisible in about 3 seconds.

If the transition is too blocky or takes too much time, try something like lowering the opacity by 5 every .1 seconds. This would change you from black to clear in about two seconds, with a fairly smooth transition.

Or you could play around with fade. I haven't found a fade button yet, so...
Everybody got to come out of the closet... does that mean I'm allowed to come out of the corner? Is that even funny anymore? Do parents still make their kids stand in corners when they mouth off?? These are the questions that keep me out of the really good schools.

havenisle.net
B
11
S
3
G
3
Posts: 27
Reputation: 2,675

Post » Sat Dec 22, 2012 8:10 pm

ok , i have tried this idea long time ago when i tried to make my 3rd game but i found some problem that its hard to do it perfectly so i made a way i think that is the best >>>
the way is : you will have 2 object and lets call them : black1, black2
ok lets say these are the events :
when player collision with win ---> then play the winning animation then fade in ( black1 ) with waiting = 2sec , then the 2nd event will be :
at the start of layout play fade out of (black2) without any waiting... so in this case you will have object for fading in and another for fading out and i made this in my latest game ( gathering the sheep ) you can check it out if you like it
B
39
S
14
G
5
Posts: 795
Reputation: 11,161

Post » Sat Dec 22, 2012 11:59 pm

[QUOTE=Kyatric] Example capx
[/QUOTE]

Go check the "FadeIn" and "FadeOut" group in the "Common" event sheet.
That's how you gradually modify the opacity over time.
New to Construct ? Where to start

Image Image
Image Image

Please attach a capx to any help request or bug report !
Moderator
B
208
S
71
G
32
Posts: 6,350
Reputation: 48,951

Post » Mon Apr 15, 2013 9:38 am

[QUOTE=Kyatric] [QUOTE=Kyatric] http://dl.dropbox.com/u/36472942/construct/forumhelp/LayoutFade.capx
[/QUOTE]

Go check the "FadeIn" and "FadeOut" group in the "Common" event sheet.
That's how you gradually modify the opacity over time.[/QUOTE]

In your example, I can't find the variables "fading" and "faded" Is there somewhere they are placed?
B
3
G
1
Posts: 8
Reputation: 291

Next

Return to How do I....?

Who is online

Users browsing this forum: andreguilherme, CrucialUpdat3, donutpond, Nancyweltch and 4 guests