Using RichText slightly offsets all text except for first line

When using richtext for a syntax highlighter, the highlight text label slightly offsets the 2nd through however many lines I have.
Here is the code I’m using, and a screenshot of the offset.
I’ve tried splitting the strings by newlines and subbing a space at the beginning, if there is, out, but that didn’t work. Also, the lexer functions do work as expected, no extra spaces at the beginning or end. It only happens on the 2nd-End lines also, which is what puzzles me.
I’ve searched the dev forum, to the best of my ability, looks like no one else has the problem, so it could be me forgetting or not understanding something. If so, I apologize.

local highlights = {
	["Comments"] = "#393E41";
	["Strings"] = "#85FFC7";
	["Numbers"] = "#F18F01";
	["Globals"] = "#5BC0EB";
	["Keywords"] = "#FF8552";
}
function format(text, color)
	return string.format("<font color=\"%s\">%s</font>", color, text)
end
texbox:GetPropertyChangedSignal("Text"):Connect(function()
	lexer.setstring(texbox.Text)
	local str = ""
	while lexer() do
		local curTok = lexer.peek()
		if highlights[curTok.type] then
			print(curTok)
			str ..= format(curTok.value, highlights[curTok.type])
		else
			str..= curTok.value
		end
	end
	
	texbox.Highlight.Text = str
end)

6 Likes

Hmm. You could use the lua debugger to step through and make certain all your tokens are what you expect. I don’t know what your lexer functions are exactly.

But maybe it’s just an issue with roblox.

Can you reproduce the same thing in a TextBox manually?

Yes they are what I expect, i’ve even compared the length of the text, with the final index my lexer gives, and they’re the same. Though i’d add that the textbox and highlight are parented under something else, with an added offset. But that shouldn’t have impacted it. I’ll try it without richtext after lunch, just to check that.

Update Definitely is rich text, once i turned it off in-game, it no longer offset the text. Might create a bug report in the morning.

1 Like

Also encountered this issue today with RichText. All text besides the first line is slightly offset/indented. Hopefully this gets addressed

This happens for all RichText-enabled instances from what I’ve seen (not just TextBox instances). You can reproduce this (all studio beta features off) by placing any text element in a GUI, inserting text that contains newlines, and toggling the RichText property. The below gif is a TextLabel with its text set to test\ntest\ntest.
2021-07-16_20-06-39
I have also been running into this issue trying to create a syntax highlighter, same as OP. This has been an issue since RichText was released afaik (amost a year ago now), it’d be nice to see some kind of confirmation this is known/being looked into.


Edit: A temporary (and probably unreliable) workaround for this is to offset your actual text input box to the right by 4 to align it with this indentation, move your visible text label up by your text size, and ensure that whenever the visible text label is updated, a newline is inserted at the very beginning of the text. I also made my input text box a TextTransparency of 0.5 as it removed a bit of the distortion/cursor and selection looked nicer imo.

5 Likes

The problem seems to be solved now.

Nevermind.

has someone found a fix for this ?

A pretty hacky workaround was mentioned earlier by offsetting all the text by ~4 pixels and moving the ui itself up by the text size. For now, it’s what i’ve been using.

i tried it and it seems to work. the only problem i have is that the text looks bold because there are 2 texts.
image image
on the left you can see it with the two texts visible. on the right i made the text of the textbox invicible. that seems to fix it. but by doing it that way i cant see the cursor or the select box. do you have the sale problem ?

also wich font are u using i cant seem to find it

Yes I do have the same problem, I’ve also been usin RobotoMono or the Code font.

Same happens with my in-game script editor. Without RichText it looks really bad. Hopefully this will be fixed.

I was having the same problem in my game and it was really annoying me so I found a way around. Put a really thin whitespace character infront of every first line. The one I used was " " but you can pick any from this website which I use all the time: Whitespace Characters — Copy and Paste Invisible Characters
Hope this was helpful to you or anyone else finding this post in the future!

5 Likes