Dynamic lighting camera system

Solar2D Advanced Graphics
#1

Some years ago i adventured myself into the universe of the custom shaders in corona and got some dynamic lighting system working with normal maps, but, after some weeks of inactivity (worked on my spare time) i lost the proof of concept code in a system format and never got to work on it again, (I did record it however)

Until a week ago, where I’ve made huge progress! I reworked how stuff would work, coded from scratch and made it compatible with normal grouping and many many other stuff, including a tracking camera with rotation tracking as well. (Yes, as in the camera view rotates too.)

This is still a work in progress and depending on how it turns out, i will consider on putting it as a plugin in the marketplace, but right now, how some things work might be changed in Corona in the future (Uniforms) so that leaves it a little bit uncertain. It basically works with the graphics.newTexture API. Anyway, here’s the showcase (Old now)

You can find updates on it on the channel as well. Any feedback is appreciated

EDIT: Here is the latest video of the project

ANOTHER EDIT: Here are some up to date screenshots of the project:

YET ANOTHER EDIT:

Try it out in the HTML5 build

Use the arrow keys to accelerate and rotate, tap on the ship to toggle ship light, tap on coins or shapes for other tests (Only on desktop, sorry)

2 Likes
Solar2D camera + dynamic lightning & split screen
#2

Cool, so you have both custom shaders and a vignette mask in that sample?

It looks great!  Please keep us posted as your projects evolve. 

#3

I agree, this looks fascinating. I have a few concepts in mind that could leverage something like this.

Like @sporkfin already said, keep us posted!

#4

Hi Sporkfin, XeduR! long time no see. Currently it’s divided into 2 general shaders, one to calculate lights, and another to apply the lights. I use another shader to fix the normal map rotation, but no mask is used,

I just use the alpha value to mask it, the display object has an out of the box filter applied as well, filter.pixelate, with a transition changing it’s value

Got sprites working, physics is next on the list to try out, but i will have to fix some stuff there, check out the video of progress

#5

That’s really cool!

Rob

#6

Thanks @Rob Miracle!

Currently working on getting physics bodies working correctly, but it seems i will have to track each dynamic object individually to update the normal map’s rotation.

The problem relies in that once physics owns the body, i can’t intercept the transform change, not even in a metatable (As i do with normal display objects) or wrapping the translate or rotate functions. 

One solution would be to add a wrapper to physics.addBody so that i can get these dynamic bodies in a list and update their normal rotation in an enterFrame.

Right now i’m just browsing around the Corona repository to see how physics is handled.

#7

New update, got physics working!

Check it in action here!

Now i just need to tidy up the code, add all of the missing functions if this is ever going to be a plugin, and write some documentation, which is pretty straightforward.

The engine/camera adds new object types, lights, lightGroups, and lightObjects (Like a normal displayObject). Grouping works like normal Corona, light objects have an extra normal fill property, and it works as the other two, same type of fills and that. 

object.fill object.stroke object.normal

There are still a few issues so don’t get too excited if your next project depends on something like this. I have not benchmarked it in a stress test yet as well but it seems to run fine so far.

EDIT: This newer video showcases camera rotation tracking in action:

EDIT: Meshes, Polygons, Lines, Sprites, Rects, RoundedRects, Circles, Snapshots, Containers, ImageRect, Image, Groups, Text, Embossed text, & all Physics bodies now work with the Dynamic camera. Next up are emitters

EDIT: Just finished updating the documentation, and a lot of polishing. Emitters can wait another day. 

#8

Worked mostly on seeing how to export normals from blender to use in a 2D game, read this blog and used the project, except i had to modify the composite so that it does not invert the X.

Anyway, did not work too much on anything, but did notice that tap and touch listeners are gone as i am rendering everything using frame buffers. I think i have a solution anyway, but will end up testing it on another day. Emitters are still 0% done. The good news is that default displayObjects can also be inserted into the light group hierarchy, thus, default emitters can be placed without a problem right now (Without shading, which looks weird)

So, i added some stuff to stress the engine and it now has a name, check out the latest video here, its gold! lol It’s around 130 normal tiles, 50 sprites each with its own light, and other stuff to test the engine (1 container, some images, a mesh, text, line, different shapes with fill properties, and other lights)

Other good news include that it works on HTML5 builds, although performance is not the best.

EDIT: For now, the project will remain as a private dependency until i implement it on an editor i’ve been working on and iron things out, some days at the most. Made with Corona as well:

For those interested in the editor, it works with physics, has layered (background & foreground) capability, custom item loader, scenery placement, will soon have a light mode, and other interesting stuff

#9

New stuff, touch and tap listeners are still a work in progress, i still have to compare what the real result from the event listener would be compared to what it is right now, maybe add some masks to hit mask the rect? I think i’ll leave it as it is and add only circle and roundedRect paths as they are easy values to read.

#10

This looks absolutely amazing.  So is the plan to eventually have it on the marketplace as a plugin?

I’ve had an idea for a game in my head for a while now and this would push it to the next level.

#11

The multiple light sources work great together.  I love it!

#12

@Appletreeman Yes, that is the plan. I’m just making sure everything works as close as expected.

I’m currently integrating it into an existing project to see what works and iron things out

@sporkfin Yes! thought it would slow down after some lights, but i still have to benchmark this on real devices.

EDIT: Touch and tap listeners are working like intended, to an extent. Still need to listen for hierarchy changes somehow to update the touch object. Right now, it’s a group copy mimicking the whole original group hierarchy/object that the listener was added to, in the end, white stuff is the touch area:

ANOTHER EDIT: Editor is up and running. Integrating it did help iron stuff out. Some things are still not finished and will continue working on it until the editor is ready (Must add light placement mode) 

#13

For the curious, i’ve uploaded the demo as an HTML5 build to http://zetosoft.com/dynacam/ Use the arrow keys to accelerate and rotate, click on the ship to toggle ship light, tap on coins or shapes for other tests

Getting pretty decent FPS!!!

Please let me know what you think! 

#14

I tried with iphone 6s, safari on ios 13.1 an it gave me an error in the fragment kernel

ERROR: 0:11: ‘vec2’ : declaration must include a precision qualifier for type
ERROR: 0:11: ‘float’ : declaration must include a precision qualifier for type
ERROR: 0:22: Invalid call of undeclared identifier ‘webgl_88f75f8300000015’

Then the demo started but tapping on the ship did nothing

#15

Hmmm i have not tested on other browser other than chrome. I’ll do some testing on Safari and fix anything that comes up.

You will need a keyboard to test movement out for now. No plans on making this an actual full game, the assets were borrowed from other of my projects.

EDIT: fixed both ERROR 0:11 (not reflected on build)

EDIT2: Error is fixed on build

#16

I looked at the HTML5 via my MacMini Safari ver 12.0 … no errors, looks really good.  Nice work!

#17

Very nice!

#18

I tried it on MacOS Safari 13.1 and Chrome Version 77.0.3865.90 and it worked and looked great!

#19

Glad you guys are liking it, more is to come!

Latest update: Got zoom working

And more zooming

#20

Updated HTML5 demo build. Added some sliders to modify ship light and camera zoom. Sliders represent:

Constant, Linear and Quadratic attenuation factors, Light scale, Light color Red, Green, Blue, and camera Zoom

Test the dynamic lights demo here