texture not tiling when painting

Godot Version

Godot Engine v4.4.1

Question

I made a simple painting scene, but when i apply the texture, its doesnt repeat. My goal is to have continuous strokes. Im also very new to making game, appreciate any help

I assume you’re using a Sprite2D to display the texture? In that case, this is a very similar post: How do you tile a texture in a Sprite?. Basically, using a TextureRect it’s much easier to tile a texture and unless it’s not possible at all, it would probably be the better solution.

If you’re already using a TextureRect, setting the stretch mode to “tile” should just work…

Edit: To mask the drawing to only the painted area, I would recommend using a shader.

Hi, Im using Line2D to paint, it add points if i drag the mouse, i tried apply an brush.png as the texture, set texture modenTile, enabled the texture repeat. But nothing worked.

If you have a better way to recreate the effect like Paint app, i would like to know, thank you

extends Node2D
var selected_color: Color = Color.WHITE
var draw_area := Rect2(Vector2(0,0), Vector2(0, 0))
var _pressed: bool = false
var _current_line: Line2D = null
var line_width := 10.0
func _input(event: InputEvent) -> void:
	if event is InputEventMouseButton:
		if event.pressed:
			if event.button_index == MOUSE_BUTTON_WHEEL_UP:
				line_width = clamp(line_width + 3, 6, 30)
			elif event.button_index == MOUSE_BUTTON_WHEEL_DOWN:
				line_width = clamp(line_width - 3, 6, 30)
			elif event.button_index == MOUSE_BUTTON_LEFT:
				_pressed = true
				var local_pos = get_local_mouse_pos()
				if draw_area.has_point(local_pos):
					_current_line = Line2D.new()
					_current_line.default_color = selected_color
					_current_line.width = line_width
					_current_line.texture = preload("res://assets/texture3.png")
					_current_line.texture_mode = Line2D.LINE_TEXTURE_TILE
					_lines.add_child(_current_line)
					_current_line.add_point(local_pos)
					lines_array.append(_current_line)
					
		elif event.button_index == MOUSE_BUTTON_LEFT:
			_pressed = false
	elif event is InputEventMouseMotion and _pressed:
		var local_pos = get_local_mouse_pos()
		if draw_area.has_point(local_pos) and _current_line != null:
			var point_count = _current_line.get_point_count()
			if point_count == 0 or _current_line.get_point_position(point_count - 1).distance_to(local_pos) > 5:
				_current_line.add_point(local_pos)

	elif event.is_action_pressed('redo') and _pressed == false:
		if lines_array.size() > 0:
			var last_line = lines_array.pop_back()
			last_line.queue_free()

Here is my spaghetti script if you want to know

this is only the input function, if you want the whole thing you can tell me :folded_hands:

The issue with using Line2Ds for this is that the texture will tilt and stretch in the direction of the line and as far as I know, there’s no way to change this. Here’s what I would do if I were making this:

  1. Store an Image that represents the painted area (e.g. white for painted, transparent for not painted)
  2. Update the image whenever the user paints and place a TextureRect for each different texture (assign the texture to it and set it to tile)
  3. Use a shader to mask the TextureRect according to the painted-area-Image

This is pretty complicated, I just don’t know of an easier way.

If you don’t mind the texture warping, I suppose Line2Ds are a decent way but I don’t have a solution for the original tiling problem, sorry :frowning: . Even just in the editor I couldn’t get the texture to tile properly

1 Like

Thank you so much, i really appreciate your help :smiling_face_with_three_hearts: