I am having issues with transparency

Hello, I am trying to make a transparency system for my drawing and it works fine if it is 0 or 100% but anything between it doesn’t look right. I believe it may be because multiple things are placing there on top of eachother? How can I fix this?

What it looks like:

Code:

rs.RenderStepped:connect(function()
	if isInFrame and isClicking and isDrawing == true then
		local selectedColor = bg:GetAttribute("Color")
		local DrawCircle = CircleBrush:Clone()
		DrawCircle.ZIndex = layer 
		selectedSize = WidthSlider:WaitForChild("Number").Value
		if selectedSize == 0 then
			selectedSize = 5
		end
		DrawCircle.Size = UDim2.new(0,selectedSize, 0, selectedSize)
		DrawCircle.Parent = Canvas
		local X = mouse.X - Canvas.AbsolutePosition.X
		local Y = mouse.Y - Canvas.AbsolutePosition.Y
		DrawCircle.Position = UDim2.fromOffset(X, Y)
		local selectedTransparency = TransparencySlider:WaitForChild("Number").Value
		if selectedTransparency == nil then
			selectedTransparency = 0
		end
		print(selectedTransparency)
		DrawCircle.Transparency = selectedTransparency
		DrawCircle.ZIndex = layer
		if isDrawing then
			DrawCircle.Name = "DrawCircle"..numberthing
			DrawCircle.BackgroundColor3 = selectedColor
			numberthing += 1
			if oldDot then
				if selectedTransparency > 0 then
					local startX, startY = oldDot.Position.X.Offset, oldDot.Position.Y.Offset
					local endX, endY = DrawCircle.Position.X.Offset, DrawCircle.Position.Y.Offset
					local line = circleLineBrush:Clone()
					line.Name = "line"..numberthing
					line.AnchorPoint = Vector2.new(0.5,0.5)
					line.Size = UDim2.new(0,(oldDot.AbsolutePosition - DrawCircle.AbsolutePosition).Magnitude,0, selectedSize)
					line.Position = UDim2.new(0, (startX + endX) / 2, 0, (startY + endY) / 2)
					line.Rotation = math.atan2(endY - startY, endX - startX) * (180 / math.pi)
					line.BackgroundColor3 = selectedColor
					line.BackgroundTransparency = selectedTransparency
					line.ZIndex = layer
					line.Parent = Canvas
					local whiteOldDot = oldDot:Clone()
					whiteOldDot.Transparency = selectedTransparency
					whiteOldDot.BackgroundColor3 = selectedColor
					whiteOldDot.ZIndex = layer
					whiteOldDot.Parent = Canvas
					local newOldDot = whiteOldDot:Clone()
					newOldDot.Transparency = selectedTransparency
					newOldDot.BackgroundColor3 = selectedColor
					newOldDot.ZIndex = layer
					newOldDot.Parent = Canvas
				elseif selectedTransparency == 0 then
					local startX, startY = oldDot.Position.X.Offset, oldDot.Position.Y.Offset
					local endX, endY = DrawCircle.Position.X.Offset, DrawCircle.Position.Y.Offset
					line = circleLineBrush:Clone()
					line.Name = "line"..numberthing
					line.AnchorPoint = Vector2.new(0.5,0.5)
					line.Size = UDim2.new(0,(oldDot.AbsolutePosition - DrawCircle.AbsolutePosition).Magnitude,0,selectedSize)
					line.Position = UDim2.new(0, (startX + endX) / 2, 0, (startY + endY) / 2)
					line.Rotation = math.atan2(endY - startY, endX - startX) * (180 / math.pi)
					line.BackgroundColor3 = selectedColor
					line.BackgroundTransparency = 0
					line.ZIndex = layer
					line.Parent = Canvas
				end
			end
			oldDot = DrawCircle
		end
1 Like

Yeah I mean not a ton you can do here, unless you change your system.

The easiest and best solution in my opinion is to just always make things 100% opaque and don’t give the transparency option.

Some other possible options:

  • make your drawing pixel-based instead
  • fill in your corners with exactly-placed triangles instead of circles so there is no overlap (but also requires more objects and math to get rounded corners)
2 Likes