The Land Of Light and Shadows (Part 2)

1

Attached Files

The following files have been attached to this tutorial:

.capx
.capx

torchlight-01.capx

Download now 260.2 KB
.png

torchlight-with-beam.png

Download now 30.81 KB
.png

Stats

4,078 visits, 7,056 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 5 Jan, 2014. Last updated 19 Feb, 2019

Link to Part 3

Link to part 1

since the 170 release this is mostly now unneeded

Introduction

In part one I went through the basics of using layers and blend modes to be able to see through one layer to the layers below.

Here in part two I want to continue with these ideas and take it a few steps further.

There will be nothing complicated here and I think it is suitable for all levels of experience.

Please ask if anything is not clear - please point out any mistakes.

"Previously on SG1..."

Remember you need two (or more) layers.

The top layer must be set to be non transparent. It must be set to "Force own texture to YES" OR its blend mode must be set to "Destination out".

The sprite that we use to remove this top layer needs to have its blend mode set to "Destination out".

Destination out uses alpha channels and opacity.

Moving on...

Lets have a quick look at alpha channels.

Computer graphics can contain colour and transparency information. I think of alpha, transparency and opacity as pretty much the same thing ( it could be argued they are not but for now let us assume they are ?)

An alpha (map) makes bits of the sprite image more or less "see through" - so you can see what is behind (underneath) it. This can be the whole image or just parts of it.

Have a quick look at the attached file "opacity.capx" (155)

This shows opacity in action - move your mouse over one of the coloured rectangles and its opacity is shown on the right. Left and right mouse will alter the opacity. Note that if you take the opacity right down to 0 you can no longer see the sprite - but it is still there.

(the event sheet is slightly (?) OTT - but it should be very easy to read. This could have been much tidier using functions, instance variables or families. Don't mention the number of times I reset the text !)

If we use an sprite with a fading alpha we can imitate things like a torch shining on a wall or a light beam where the light is gradually fading away...

something like

or

the more opaque the graphic is the more or the top layer will be removed and therefore more of the lower layer will be seen.

Lets place these in to a simple capx and see how they look ? (see attached file torchlight 01.capx (155))

Almost there but still not casting shadows.

Tune in next time for a couple of ways to fake the shadows. It's still far from perfect but should look something like this.

torchlight with shadows

.CAPX
.CAPX

torchlight-01.capx

Download now 260.2 KB
.PNG

torchlight-with-beam.png

Download now 30.81 KB
.PNG

torchlight.png

Download now 13.98 KB
  • 0 Comments

Want to leave a comment? Login or Register an account!