GUI Text Gradient Not Working

Hello, I am designing a GUI that displays text when a button is pressed. However, the text updates, but the gradient inside the text does not.

The text I’m trying to have the gradient on
image

The code:

local rarityText = script.Parent.RarityText
local rarityDisplay = script.Parent
local rarityName = rarityDisplay.Parent.RarityName
local name = ""

while task.wait() do
	if rarityName.Value ~= "" then
		rarityText.Text = rarityName.Value
		rarityText:WaitForChild(rarityName.Value).Enabled = true
	end
end

The gradients are inside the text
image

1 Like

You need to disable all the other gradients (.Enabled = false), otherwise they conflict.

So every time the text updates, do something like

for _, gradient in rarityText:GetChildren() do
	gradient.Enabled = false
end
rarityText:WaitForChild(rarityName.Value).Enabled = true

Edit: Also make sure the text color is pure white, otherwise the colors will kind of mix. But I think that’s just the common gradient displaying.

All the gradients are disabled before I click the button. The text color is 255, 255, 255 (white).

I’ve updated my code so that only one gradient shows at a time, but it still doesn’t work. It does print out the gradient text name.

rarityText.Text = rarityName.Value
		
for _, gradient in rarityText:GetChildren() do
	if gradient.Name ~= rarityName.Value then
		gradient.Enabled = false
	else
		print(gradient)
		gradient.Enabled = true
	end
	
end
``
1 Like

If you do while task.wait(), then it will loop through all the gradients very quickly. Try using while task.wait(1) and it might work. Not 100% sure though.

Also check the transparency of the gradients, make sure its 0.

Yes, I am using a while task.wait() loop, and the transparency is set to 0 for all of the gradients.

Edit: I believe it’s an accessing issue. I tested the gradient change in another local script and it worked. However, when I try to change it in the loop it doesn’t do it?

Try using RunService?

I don’t think you are supposed to have more than 1 UIGradient under a UI element. To fix your issue, your could either place all the UIGradient’s in a folder under the RarityDisplay frame, and clone or just parent the specific UI Gradient under the RarityText, or create a new UIGradient within the script (I find the first one to be more simple).

Your updated LocalScript:

local rarityText = script.Parent:WaitForChild("RarityText")
local rarityDisplay = script.Parent
local rarityName = rarityDisplay.Parent:WaitForChild("RarityName")
local name = ""

local GradientRarityFol = rarityDisplay:WaitForChild("RarityGradients") -- assuming that's the name of the folder
local rarityTable = { -- list of all rarities in string format
	"Common",
	"Uncommon",
	"Rare",
	"Epic",
	"Legendary",
	"Mythical"
}

rarityName.Changed:Connect(function()
	if rarityName.Value ~= "" then
		rarityText.Text = rarityName.Value

		for _, rarityStrings in pairs(rarityTable) do
			if rarityText:FindFirstChild(rarityStrings) then -- if any UIGradient is found under 'rarityText'
				rarityText:FindFirstChild(rarityStrings):Destroy() -- destroys it so we could add another UIGradient without complications
			end
		end

		local cloneGradient = GradientRarityFol:FindFirstChild(rarityName.Value):Clone()
		cloneGradient.Parent = rarityText -- parents the cloned UIGradient
	end
end)
2 Likes

This seems to be the issue. In fact, it worked when I tested with 1 UI gradient inside the Text. Much thanks.

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.