3d raycasting game doesn't work

[Gino_Enzini]

Hi . I am making a 3d ray-casting maze game in App Inventor . I "translated" the code from scratch , because the original tutorials I used were : https://www.youtube.com/watch?v=M1c5TcdITVs
and https://www.youtube.com/watch?v=Vihr-PVjWF4 . This are the blocks :

And I don't know why it doesn't work . I would like any type of help . P.S. for who was helping me in the google genie topic : That one for now is solved

[Gino_Enzini]

Maybe I should answer this alone , even if I don't know the answer ?

[Gino_Enzini]

Sorry , I was kidding . This is definitively not solved

[ABG]

@Gino_Enzini

I "translated" the code from scratch ,

If you translate the code to English and post the aia, I could take a look.

Otherwise the only think I can discern is a couple of red X's.

[Gino_Enzini]

I edited the first post . And now there are not red crosses . But it still doesn't work

[davidefa]

Did you upload the aia?
Did you use any extension ( which one and where did you get )?

[Gino_Enzini]

What is this fraud ? Sorry , App Inventor combined 3 projects . I don't know how . This are the blocks I wanted to post :

And , anyway , it still doesn't work

[ABG]

Still insufficient information to diagnose with out the aia export.

[Gino_Enzini]

If you really want it ... raycastin_g.aia (900.0 KB) this is the AIA

[ABG]

When I started the project and hit one of the 4 directional buttons, I got this error message:

I went looking for division /), and found

Trace what happens when the first block to compute global variable distance runs.
A division with denominator raycaster.Y - player.Y will always crash because the two Y values are set equal at the top of this procedure.

I see unexplainable decisions elsewhere in this project:

Stage1 is a Canvas. AI2 Colors are 4 byte RGBA values. If you want to build a color, use the makecolor block and feed it the color component values.
What did you expect to see painting with this color?

Let's discuss collisions:

You have two small sprites, player and raycaster.
Here's your canvas, outlined in green:

Here's your big fat sprite level1, filling the upper part of the Canvas:

Note that the maze is a background image of the level sprite, not the canvas.

You also have another big fat sprite, level_color, overlapping the level sprite partially, both at z=1:

If your intention is to shoot rays of dots from the player, they will not respect the drawn walls on your sprite images, because they don't test canvas pixel color values.
There are two Canvas blocks for that, and you use neither.

If your intention is to use sprite collision, your sprite is crashing into a painted wall.
https://www.google.com/search?q=Fast+and+Furry-ous

At this point, there's no benefit to try to fix this.
Instead, look for samples from AI2-specific apps:

FAQ Section: Canvas, Sprites, Balls, Animation

Sprite Origin Docs - @Taifun Scott Ferguson Easing Demo Gravity Exercise from the defunct Scott Ferguson Library Transparent Color Number 16777215 on Canvas - @Ryan_Patridge Fit Canvas to Image using JavaScript - TimAI2 Off Screen Visible Canvas trick - Italo Canvas larger than screen - Scott Ferguson Draggable Canvas blog entry - Emile Wong 2018 Color extraction - Scott Ferguson Flood Fill - Scott Ferguson Gradients sample - Italo Multi Touch Pixelation - Italo Rotate an ImageSprit…

I recommend the defunct Scott Ferguson library.

[Gino_Enzini]

@ABG

When I started the project and hit one of the 4 directional buttons, I got this error message:

Also I receive it

@ABG

I went looking for division /), and found

Trace what happens when the first block to compute global variable distance runs.
A division with denominator raycaster.Y - player.Y will always crash because the two Y values are set equal at the top of this procedure.

This is probably a translation error from Scratch to App Inventor . I am an ex-Scratcher and when I changed to App Inventor there were many differences ... for example there are not the "pen extension" component or the "distance from (Sprite) " block . Also ...

@ABG

I see unexplainable decisions elsewhere in this project:

Stage1 is a Canvas. AI2 Colors are 4 byte RGBA values. If you want to build a color, use the makecolor block and feed it the color component values.
What did you expect to see painting with this color?

In the original tutorial , witch I added the link in the first post , there was color value of pen setted like 53 . Maybe is different with App Inventor , so , as you said , but I didn't knew , sorry

@ABG

Let's discuss collisions:

Probably is another difference from Scratch to App Inventor ( I didn't even suspected they are so different languages ! ) , because Scratch is based on sprites and ... well ... the communication of sprites

@ABG

You have two small sprites, player and raycaster.
Here's your canvas, outlined in green:

Here's your big fat sprite level1, filling the upper part of the Canvas:

Note that the maze is a background image of the level sprite, not the canvas.

I know . I wanted this because in Scratch there the sprites have "costumes" . Probably is one of the last but not least translation mistakes ...

@ABG

You also have another big fat sprite, level_color, overlapping the level sprite partially, both at z=1:

Ok . Is very similar to the "level" sprite if you wanted to say that

@ABG

If your intention is to shoot rays of dots from the player, they will not respect the drawn walls on your sprite images, because they don't test canvas pixel color values.
There are two Canvas blocks for that, and you use neither.

If your intention is to use sprite collision, your sprite is crashing into a painted wall.
https://www.google.com/search?q=Fast+and+Furry-ous

At this point, there's no benefit to try to fix this.
Instead, look for samples from AI2-specific apps:

Like I said before is probable that is , so , also this a mistake in translating . If you have seen the video ( and probably you have seen it as I see by your reply ) yes , I want the "laser" of raycaster sprite like in the tutorial , for raycasting
And finally ...

@ABG

At this point, there's no benefit to try to fix this.
Instead, look for samples from AI2-specific apps:

FAQ Section : Canvas , Sprites , Balls , Animation

I recommend the defunct Scott Ferguson library.

Thank you for the suggestion . But what of the extension from that library should I use ?

@Gino_Enzini

raycastin_g.aia (900.0 KB)

And is it possible to ... save or "recycle" this ? Because later I hope I will do a tutorial for App Inventor's , because the tutorial for App Inventor doesn't exist . And because of the Appathon it will be even more useful

[ABG]

@Gino_Enzini

But what of the extension from that library should I use ?

Scott Ferguson's samples are all in AI2 blocks, no extensions.

Here is his well documented flood fill sample, from the Canvas FAQ:
https://groups.google.com/g/app-inventor-developers-library/c/NBuCEDP8SxQ

An example of pixel color extraction (old and bugged).
https://groups.google.com/g/mitappinventortest/c/fV2MZVWdnIM/m/tWdno2AhCgAJ

If you would like to repost those here on this board with fresh block downloads, feel free.

Our Canvas FAQ is dusty and moth eaten.

[ABG]

@Gino_Enzini

And is it possible to ... save or "recycle" this ?

Scratch is quite different from AI2 in its event cycle.

Scratch uses messages to initiate events.

AI2 has no such concept.

You have some unlearning ahead of you.

FAQ Section: Waiting and Timing

Async Procedure extension - kodular How to do something long running - Taifun How to run an accurate metronome Pause and Break in Loops Extension - Juan Antonio Why you can't wait in AI2 (mirrored here) Event-Based programming in AI2 - FTurbak CCSCNE14-AI2-events-first-paper.pdf (432.1 KB) How to avoid using delay() in Arduino - JuanAntonio, docs.arduino.cc BlueTooth Connect is Synchronous - @ewpqtton Dec 2025 Also See:

[Gino_Enzini]

Sorry but ...

@ABG

Here is his well documented flood fill sample, from the Canvas FAQ:
https://groups.google.com/g/app-inventor-developers-library/c/NBuCEDP8SxQ

An example of pixel color extraction (old and bugged).
https://groups.google.com/g/mitappinventortest/c/fV2MZVWdnIM/m/tWdno2AhCgAJ

... How can this help me ? I don't need a bugged tutorial or a "fill shape" one because that's not raycasting . If you see how this can help me , please say it

@ABG

Scratch is quite different from AI2 in its event cycle.

Scratch uses messages to initiate events.

AI2 has no such concept.

You have some unlearning ahead of you.

Async Procedure extension - kodular . Also See:

And the messages aren't really needed if there it's the "collision" block .

@ABG

If you would like to repost those here on this board with fresh block downloads, feel free.

Our Canvas FAQ is dusty and moth eaten.

I will see and report

[Gino_Enzini]

For the Canvas FAQ suggest to do a few things :

To remove the Pixel color extraction example (old and bugged) in the FAQ because is still there . Then I suggest to whrite , like in a book , the things :

• Working little trick to be able to draw things in a hidden canvas and save the picture
  The trick is to make a horizontal arrangement and make it fill parent on its width.
  Then Inside it put an arrangement to the left and a canvas to the right. The arrangement on the left should have width 100% (not fill parent). That will push the canvas outside the screen, but will still count as visible.

• Howto : make transparent background colour in canvas
  Setting the Canvas.PaintColor property to the number 16777215 works for specifying the color to transparent, which behaves like an eraser for anything that's been drawn on the canvas already.

And to put directly the link :
(ANIMATION IMPROVEMENTS - Google Docs)
Instead of putting the topics of old Google Groups .
And ( HOWTO: 4. "Fancy" Crop a Canvas Background Image - Tutorials and Guides - MIT App Inventor Community ) : not HOWTO 1 because the topic I suggested contains the links of all the previous HOWTO .
Many of Scott's YouTube videos are very old and ... erm ... of not so high quality . That's not all : Google Groups topics are very old ... it where made even before the community was "born" ...
Even , for Pixelation there is also another method I found if you really want to know ...

[davidefa]

If you want to replicate the scratch project you linked... you have to follow the tutorial from the beginning, step by step.
Doing this you will find that ai2 is "quite different" from scratch.
For example the collision detection between sprites is different ( you can't detect the collision af the sprite player "inside" the sprite layer )