How to implement lighting without shaders? [SOLVED]

Fool

  • Posts: 88
For my lighting I can't use shaders. I want to stick to normal, add, multiply, and screen effects. I've tried all of them without much luck.

My fellow stencylers, I ask you to rise to the occasion, and ask you one question: How would you implement lighting in this circumstance?

The way I'm attempting to perform it is by using transparent circles that overlay on a secondary layer above the main game, and the second layer blending is set to 'add', but I'm not having much luck. The lights should 'cut out' the darkness from the layer to show whats beneath, but I can't seem to accomplish that.

 All answers or solutions are welcome.

« Last Edit: October 01, 2017, 08:32:10 pm by Fool »

rob1221

  • *
  • Posts: 9473
If you're using layer blend modes then try multiply on the layer and screen on the lights.

Fool

  • Posts: 88
Thank you Rob. Didn't work, but thank you. I currently have four sprites for experimenting with lights.
my 'base' sprite which is black with a transparent circle in the middle, 'black' which is a black circle on white, 'shadow' which is a black circle on transparent, and 'white', which is a white circle on black.

Currently the black circle on white, with layer blending set to 'multiply' acts as a 'shadow' for the given layer, as long as I have no layer fill.

Layer filling now is implemented as some commands in the scene .draw event. I set the fill color to 'black', set draw layer to layer 1, and then fill a square the size of the screen, which is a terrible way of doing it, but I'm just working out the kinks anyway.

Lights are implemented as actors, and the animations are what are supposed to act as the template for the cut out.
I'm currently on flash and using openfl legacy.

I'm not sure what I'm doing wrong but I appreciate your advice.

merrak

  • *
  • Posts: 2738
Rather than draw the lights, draw the shadows and cut out "holes" for the lights. You can do this with the Image API.

Set up two images: a shadow (black, screen-sized rectangle) and circular masks for the lights. The masks don't have to be circles, either. You can set up directional lights and also smooth the transition from clear to opaque.

Everywhere there is a light on screen, clear the shadow image using the light images as a mask. If the lights are moving then you'll have to refresh the screen every frame. For a handful of lights and relatively small screen this should be okay with OpenFL legacy.

Example of the effect: http://www.stencyl.com/game/play/34029
Source code: http://anorthogonaluniverse.com/ed/  (Game Manager scene behavior, drawing event)

« Last Edit: October 01, 2017, 04:03:15 pm by merrak »

rob1221

  • *
  • Posts: 9473
Try a white circle on the same layer as a black rectangle but with a higher Z-order.  Set the actor blend mode to screen on the circle then layer blend mode to multiply.

Fool

  • Posts: 88
Hey thanks merrak, gonna give this a go.
Rob, tried what you suggested, still getting a black screen.
I'm setting the light actor z index in .created using the 'move self to front/back of layer' block.
Blend mode for the actor is set at creation while blend mode for the layer I set through the layer propery dialog in the
scene editor (instead of through blocks in the scene event .created). In any case I'm still getting the black screen, so I'm gonna resort to the image api method. I'll see how it goes and let you guys know. Thanks again fwiw.

rob1221

  • *
  • Posts: 9473
Here's a sample game showing RGB lights with blend modes.  Click to create a light that will bounce around the screen and you'll see the actors and background through it.

The image API method is a similar concept, replacing parts of the black rectangle with transparency rather than colors.

Fool

  • Posts: 88
Rob and Merrak I owe you guys a debt of gratitude and a six pack.
A lot of times I can't wrap my head around a concept unless I see it implemented.
I didn't know how to use the image api which is what was hurting me.
You have my thanks.

Edit: I wasn't making the leap from "first create an image attribute" to -> "modify it and then create instances before attaching them."

This is gonna open up a bunch of possibilities for me. Again, thank you.