ColorRect draws outside the its borders.

kuligs2 · 2 Jan

Hello again. Problems arise when you do things. This time im confused on how to deal with it.

The problem is that the ColorRect has defined size(x,y) yet it draws pixels outside its size.

Im calling draw function to draw pixels onto the rect. And the result is like this.

What you see in the picture is a screenshot of grayish colorrect with yellow pattern on it (waveform). It was drawn on the rect. At the mouse pointer you see a vertical lighter pixel, this is another colorrect object that is placed at the x == 0 position of the grayish colorrect. And now you see, that the yellow pattern is on the left of the supposed x ==0 value of the colorrect.

Scene:

Script part where it draws:

func _draw():
	if preview:
		var rect = get_rect()
		var rectSize = rect.size
		var previewLen = preview.get_length() #audio length in seconds
		for i in range(0, rectSize.x):
			var ofs = (0+i) * previewLen / rectSize.x
			var ofs_n = (0+(i+1)) * previewLen / rectSize.x
			var max_v = preview.get_max(ofs, ofs_n) * 0.5 + 0.5
			var min_v = preview.get_min(ofs, ofs_n) * 0.5 + 0.5
			draw_line(Vector2(i,  min_v * rectSize.y), 
			Vector2(i, max_v * rectSize.y), Color(1, 1, 0, 1), 1, false) # Yellow waveform

How can i mitigate this?

EDIT:

The 0+i thing i added recently so ignore that.. i was testing to see if the offset would help but it does not

xyz · 2 Jan

kuligs2 Custom drawing is implemented in canvas item base class. This class has no concept of size or bounding box, therefore it can't do clipping against that.

kuligs2 · 2 Jan

xyz Through trial and error, found a "fix" i guess..

func _draw():
	if preview:
		var rect = get_rect()
		var rectSize = rect.size
		var previewLen = preview.get_length() #audio length in seconds
		for i in range(1, rectSize.x): # < ------------------------------------------ Start range from 1 instead of 0
			
			var ofs = (0+i) * previewLen / rectSize.x
			var ofs_n = (0+(i+1)) * previewLen / rectSize.x
			var max_v = preview.get_max(ofs, ofs_n) * 0.5 + 0.5
			var min_v = preview.get_min(ofs, ofs_n) * 0.5 + 0.5
			#if i>5:
			draw_line(Vector2(i,  min_v * rectSize.y),Vector2(i, max_v * rectSize.y), Color(1, 1, 0, 1), 1, false)

So i guess fist line will be lost, but atleast visually it will look correct.

xyz · 2 Jan

kuligs2 If you want to do proper clipping you can draw into any canvas item child of this rect and use "clip children" mechanism.

kuligs2 · 2 Jan

xyz but the draw function draws pixels, so idk if pixels are "nodes/children" in that sense.

I havent tried it because the method above i described worked. Ill try it later to see if its any better.

xyz · 2 Jan

kuligs2 "Clip children" clips pixels. It's an alpha mask.

kuligs2 · 11 Jan

xyz i experimented, while it does the job, it makes the thing more transparent/dark Is there a way not to make it more transparent?

Standard:

panel_container.clip_children = CanvasItem.CLIP_CHILDREN_AND_DRAW

xyz · 11 Jan

kuligs2 Check mask's alpha

kuligs2 · 11 Jan

xyz not sure where to find this property

xyz · 11 Jan

kuligs2 Whatever is masking its children, its modulate and self modulate alphas as well as modulate alphas of all of its parents.