0 Favourites

How to create a flashlight lighting the dark

  • Hey everyone,

    I'm currently working on a submarine game and I'm troubling with blend modes/WebGL effects.

    What I want to do is the following:

    • A submarine in dark water (not black, more blueish)
    • Submarine's light lights up the dark water and a bit of the submarine too
    • Everything else which is not in the torchlight area should be not visible or very dark

    (Let the details be my problem, I just want the general setup)

    Kinda like this: https://goo.gl/UP3cRx

    I figured I'd create a Sprite for the light, being a gradient going from white to transparent.

    I tried every possible combination of blending modes, including the ones in the "effects" property.

    I tried every possible Z order.

    There must be a way, probably a very simple way, a combination of effects I missed.

    Any help is greatly appreciated, thanks.

    [EDIT]

    I maybe found a way to do it. Maybe.

    It just ignores colors of objects on the main layer...

    Link to the capx: https://www.dropbox.com/s/4basmw18nzmcbb6/SubLight.capx?dl=1

  • Try an extra layout as a hud with parallax 0,0. Have the dark hue for the water as a screen wide blue hue. Then erase a triangle of vision.

    Every tick set the angle to the sub angle. If you need effects on the water, add this separately

    Additionally you can change its opacity, so the deeper you go the less opac it becomes.

    Only trouble is when the sub isn't centre screen..

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • Thanks for the answer.

    So you mean that for the hue I should create a water layer or Sprite which is on top of everything and then just...erase something?

    Should I use a canvas or how am I supposed to achieve that?

  • My favourite way of doing this kind of thing is to make a top layer filled with black, you make sure it's visable and tick Force Own Texture. Then make a white coloured sprite to be the torch, set the blend mode to Destination Out.

    Go the events and make a new one, set it that every tick the torch sets its position to the character, then set the angle of the torch to the character angle.

    Here's an example using a character with 8 direction ->

    You can change the layer opacity to make more or less of the level visable. Is that what you were trying to achieve?

  • littleredpanda

    Yeah, that's the basic look I want to achieve.

    Now the thing is, I want to have multiple lights in the foreground and background which have different parallax values.

    To do so, I created foreground and background layers and applied different parallax values to them.

    But I still want those layers to light up the sub.

    Is that possible?

    Here is my current layout: https://www.dropbox.com/s/4basmw18nzmcbb6/SubLight.capx?dl=1

    (Note that the LightCone is lighting up the submarine and the darkness like I want it, but the lights in the back- and foreground don't)

    (Also note that I applied the blending modes and parallax to the layers, not the objects)

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)