¿how could i make a simple texture-painting program?

Sosasees

i want to make a texture-painting program in Godot that is specialized in a slightly different way than all the other drawing programs i have seen.

before i want to make the full version, i first need to first understand how to make this as-simple-as-possible prototype: • 100×100px texture on the top-left of the screen, filled in completely with the color #ffffff • the ability to draw on this texture with my mouse, in single-pixel #000000-colored dots

¿can somebody please help give me the easy explaination of how to make this prototype program? i couldn't find this explaination for myself.

Leakbang

You might want to look at these programs: https://github.com/RodZill4/material-maker https://github.com/cwkx/godot-pixel-painter Both are made with Godot. I think one of the best things you can do is to check their source code out and see how they tackled the issues. You can learn a lot from them. I believe that there are a number of drawing apps based on Godot. Best part about it is that all of the ones that I've seen were open-source. So you can either learn from reading their source code, or alternatively build your project on the foundation that they have made!

Sosasees

@Leakbang this has not helped me at all. these programs are way too complex to undertstand the source code for me because they have a lot of extra stuff that i don't need for my project, and it's impossible to find the stuff i Do need.

why do i ask for an explaination of specifically how to make this as-simple-as-possible prototype? because i need to start as simple as possible. otherwise i won't understand how to make the program i want.

---

right now, i must Only know how to make: - 100×100px texture on the top-left of the screen, filled in completely with the color #ffffff - the ability to draw on this texture with my mouse, in single-pixel #000000-colored dots

so i need simple from-scratch instructions on how to do Just that.

the rest of the program i can make only after understanding these basics.

TwistedTwigleg

If you are okay with using a VIewport, then this demo project may help: GD Paint

It's not a explanation with from-scratch instructions, but the majority of the project is all contained in a single GDScript file with plenty of comments. I don't remember the size the Viewport is set to by default, but you could probably set it to 100x100 and it should still work, I think.

cybereality

You would use the draw() function. You can save mouse input into an array of positions, and then use draw to loop through the positions and draw a square (or circle) at each point. https://docs.godotengine.org/en/stable/tutorials/2d/custom_drawing_in_2d.html

Sosasees

i figured out what i want for the start. i made a prototype but it is now lost because i deleted it before i realized that i accidentally created my zip file Empty.

the next part i need to know is "¿how could i keep drawing the pixel line when moving the mouse with the button held down?", because for me, this code should theoretically already do it, but in practice it doesn't.

---

but the principle is already clear: i need to draw on a pixel grid so that i could store and render the images much more efficiently because the use-case of the finished program might need Many images to be displayed on-screen at once, and that's On A Phone where that finished program might actually Need lower-fidelity rendering to save battery.

the GDPaint approach (that @TwistedTwigleg and @cybereality suggested) of placing down Vector-based "Brush Objects" works well when drawing One image, but if you need to draw a few dozen images side-by-side this could become a performance disaster, especially on phones.

cybereality

Draw does use vectors, but the results are cached. So it doesn't update every frame, only when you change something (in which case it will redraw the whole image). So it should be okay on mobile, as if you have 10 layers, they are not all drawing at once, only the one you are currently working with. You can also save the results into a texture (using viewports) but I'm not sure if this is needed. You should test it.

Sosasees

@cybereality thanks for suggesting that i test the method. i made a modified version of GDPaint, it changes nothing but add a FPS display to the top-left of the drawing area. (this GDPaint mod is now lost because i deleted it before i realized that i accidentally created my zip file Empty).

while when using GDPaint on my computer the FPS does not dip below 60 (to 30) until ~5000 Brush Objects, when using GDPaint on my phone it quickly starts degrading and reaches 12FPS with just ~1000 Brush Objects (which is barely any painting time at all).

i think* i will use the Pixel Painting method for better performance, as originally plannned.

*my plans can change unexpectedly from comments