How to successfully mask a text box with "*" for every character entered?

Hello!

I remember when I attempted to do the exact same thing, when people would enter a password to continue, and then hide their input (or mask it) by having "*" instead of the characters the users had entered.

Now, I thought of the same solution as you, by changing the actual TextBox, however, it just turned up to be buggy, and after a while of thinking I got a solution where I simply had a TextLabel above the TextBox by having the TextLabel's ZIndex higher than the TextBox.

Simply:

• create TextLabel and have exact same size and position (if you want to..)
• set the TextLabel's ZIndex to one higher than the TextBox, then you won't be able to see the characters in the TextBox

Then, create a script that edits the TextLabel's text based on amount of characters in the TextBox.

A simple variant:

-- The TextBox
local PasswordInput = script.Parent.PasswordInput;
-- The TextLabel
local PasswordMask = script.Parent.PasswordMask;


PasswordInput:GetPropertyChangedSignal("Text"):Connect( function ()
	local currentPasswordInput = PasswordInput.Text;
	-- Add * based on the amount of characters in the password input
	PasswordMask.Text = ("*"):rep(#currentPasswordInput);
	-- You could alternatively use string.rep("*", #currentPasswordInput)
end)

That's a simple hacky solution, which in my opinion is better than changing the actual TextBox.

I hope this helped, if you have any questions, please ask!