# Game 2D light and shadow ray casting with colors

Hello, I create sketch that uses ray casting with shadows and lights, but i want to tint every single light with own color, how i can do it ?

``````boolean lihghtsEnable = true;
PImage background, screen;
ArrayList<Light> lights;
ArrayList<Wall> walls;
int pressedX, pressedY;

void setup() {
size(800, 450);
frameRate(100);
textAlign(LEFT, TOP);
background(0);

walls = new ArrayList<Wall>();
lights = new ArrayList<Light>();

background.resize(width, height);
}

void draw() {
// Draw background or game
background(background);

// Get game screen pixels
screen = get();

// Draw blackness
fill(0, 240);
noStroke();
rect(0, 0, width, height);

if (lihghtsEnable) {
for (Light l : lights) {
l.draw();
}
}

// Apply mask to game screen pixels

// Draw game screen
image(screen, 0, 0);

// Draw walls
for (Wall w : walls) {
w.draw();
}

// Show FPS and others stuff
fill(0, 255, 0);
text(int(frameRate)+"\n"+"Lights: "+lihghtsEnable+"\nLeft mouse button - create wall\nRight mouse button - create light\nKey 'L' - enables lights\nKey 'C' - clear all walls", 0, 0);
}

class Light {
int x, y, dist;
color c = color(255), recoCol = color(random(100, 255), random(100, 255), random(100, 255));
PImage texture;

Light(int x, int y, int dist, color c) {
this.x = x;
this.y = y;
this.dist = dist;
this.c = c;
texture.resize(dist*2, dist*2);
}

void draw() {
for (float i = 0; i < 360; i+=1) { // This is just test with angle ray scan, it is not accurate, later i will change it with cleverly ray render casting.
for (Wall w : walls) {
if (pos.z == 1) {
if (dist(x, y, point.x, point.y) > dist(x, y, pos.x, pos.y)) {
point.x = pos.x;
point.y = pos.y;
}
}
}
}
}
}

class Wall {
int x1, y1, x2, y2;
Wall(int x1, int y1, int x2, int y2) {
this.x1 = x1;
this.y1 = y1;
this.x2 = x2;
this.y2 = y2;
}
void draw() {
strokeWeight(3);
stroke(255);
line(x1, y1, x2, y2);
}
}

PVector lineLine(float x1, float y1, float x2, float y2, float x3, float y3, float x4, float y4) {
float uA = ((x4-x3)*(y1-y3) - (y4-y3)*(x1-x3)) / ((y4-y3)*(x2-x1) - (x4-x3)*(y2-y1));
float uB = ((x2-x1)*(y1-y3) - (y2-y1)*(x1-x3)) / ((y4-y3)*(x2-x1) - (x4-x3)*(y2-y1));
PVector out = new PVector(0, 0, 0);
if (uA >= 0 && uA <= 1 && uB >= 0 && uB <= 1) {
out.x = x1 + (uA * (x2-x1));
out.y = y1 + (uA * (y2-y1));
out.z = 1;
return out;
}
return out;
}

void mousePressed() {
pressedX = mouseX;
pressedY = mouseY;
}

void mouseReleased() {
if (mouseButton == LEFT) {
}
if (mouseButton == RIGHT) {
lights.add(new Light(mouseX, mouseY, 100, color(255, 255, 255)));
}
}

void keyPressed() {
if (key == 'l' || key == 'L') {
lihghtsEnable = !lihghtsEnable;
}
if (key == 'c' || key == 'C') {
for (int i = walls.size()-1; i >= 0; i--) {
walls.remove(i);
}
}
}
``````

And I want it to look something like this, I mean the colors, to make it look real when the lights come together when they’re colored in different colors. 2 Likes

you need to switch from masks to multiply blending modes or direct shaders.

``````boolean lihghtsEnable = true;
PImage background, screen;
ArrayList<Light> lights;
ArrayList<Wall> walls;
int pressedX, pressedY;

void setup() {
size(800, 450);
frameRate(100);
textAlign(LEFT, TOP);
background(0);

walls = new ArrayList<Wall>();
lights = new ArrayList<Light>();

PGraphics blank =  createGraphics(width, height);
blank.beginDraw();
blank.background(255);
blank.endDraw();
background = blank.get();
background.resize(width, height);
}

void draw() {
// Draw background or game
background(background);

// Get game screen pixels
screen = get();

// Draw blackness
fill(0, 240);
noStroke();
rect(0, 0, width, height);

if (lihghtsEnable) {
for (Light l : lights) {
l.draw();
}
}

// Apply mask to game screen pixels

// Draw game screen
blendMode(BLEND);
image(screen, 0, 0);
//black x black = black,
//white x balck = black
//white x white = white, etc
blendMode(BLEND);
// Draw walls
for (Wall w : walls) {
w.draw();
}

// Show FPS and others stuff
fill(0, 255, 0);
text(int(frameRate)+"\n"+"Lights: "+lihghtsEnable+"\nLeft mouse button - create wall\nRight mouse button - create light\nKey 'L' - enables lights\nKey 'C' - clear all walls", 0, 0);
}
class Light {
int x, y, dist;
color c = color(random(100, 255), random(100, 255), random(100, 255));
PImage texture;

Light(int x, int y, int dist, color c) {
this.x = x;
this.y = y;
this.dist = dist;
this.c =  color(random(100, 255), random(100, 255), random(100, 255));
texture.resize(dist*2, dist*2);
}

void draw() {
for (float i = 0; i < 360; i+=1) { // This is just test with angle ray scan, it is not accurate, later i will change it with cleverly ray render casting.
for (Wall w : walls) {
if (pos.z == 1) {
if (dist(x, y, point.x, point.y) > dist(x, y, pos.x, pos.y)) {
point.x = pos.x;
point.y = pos.y;
}
}
}
}
//same deal here

}
}
``````

result: 3 Likes

Thanks a lot, working better than I expected 1 Like

Nice solution – that looks great!

I seem to recall that PixelFlow also several examples of colored light raycasting.

1 Like

Hi, first happy new year !

i found your code and i wanted to try it in my code (i use java with eclipse).

i get a java nullPointerException for the line : screen = get();
I think it’s because it’s not initialize but i don’t know how to.

Can you explain to me ?
{"ft_lang_label":"__label__en","ft_lang_prob":0.562953,"math_prob":0.9940129,"size":3727,"snap":"2022-27-2022-33","text_gpt3_token_len":1228,"char_repetition_ratio":0.10609724,"word_repetition_ratio":0.007142857,"special_character_ratio":0.38717467,"punctuation_ratio":0.27010804,"nsfw_num_words":0,"has_unicode_error":false,"math_prob_llama3":0.98102474,"pos_list":[0,1,2,3,4,5,6,7,8,9,10,11,12],"im_url_duplicate_count":[null,null,null,1,null,null,null,3,null,null,null,null,null],"WARC_HEADER":"{\"WARC-Type\":\"response\",\"WARC-Date\":\"2022-06-27T18:15:21Z\",\"WARC-Record-ID\":\"<urn:uuid:87afa86b-66cb-4d1e-8393-1d71006dc66d>\",\"Content-Length\":\"44481\",\"Content-Type\":\"application/http; msgtype=response\",\"WARC-Warcinfo-ID\":\"<urn:uuid:84c6f217-a6f2-406f-a60b-2eafd4847775>\",\"WARC-Concurrent-To\":\"<urn:uuid:aaea77af-884c-4c2a-88aa-9218fdc782d0>\",\"WARC-IP-Address\":\"64.62.250.111\",\"WARC-Target-URI\":\"https://discourse.processing.org/t/game-2d-light-and-shadow-ray-casting-with-colors/14025\",\"WARC-Payload-Digest\":\"sha1:ACDAOJRAMDDDTZHCQUWGYJ3RARX25LW7\",\"WARC-Block-Digest\":\"sha1:6ARO6GFA7FR6JGTHLRAA42BXKW4EUZHI\",\"WARC-Identified-Payload-Type\":\"text/html\",\"warc_filename\":\"/cc_download/warc_2022/CC-MAIN-2022-27/CC-MAIN-2022-27_segments_1656103337962.22_warc_CC-MAIN-20220627164834-20220627194834-00695.warc.gz\"}"}