when I click either button, nothing appears. I also don’t know if it’s possible to get working without the .story on the modules.
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local Players = game:GetService("Players")
local Fusion = require(ReplicatedStorage.Fusion)
local New = Fusion.New
local Children = Fusion.Children
local gui = New "ScreenGui" {
Parent = Players.LocalPlayer.PlayerGui,
Name = "MyFirstGui",
ResetOnSpawn = false,
ZIndexBehavior = "Sibling",
[Children] = {
New "TextLabel" {
Position = UDim2.fromScale(.5, .5),
AnchorPoint = Vector2.new(.5, .5),
Size = UDim2.fromOffset(200, 50),
Text = "Fusion is fun :)"
},
New "TextLabel" {
Position = UDim2.new(.5, 0, .5, 50),
AnchorPoint = Vector2.new(.5, .5),
Size = UDim2.fromOffset(200, 50),
Text = "Two is better than one!"
}
}
}
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local Fusion = require(ReplicatedStorage.Fusion)
local New = Fusion.New
local State = Fusion.State
local Computed = Fusion.Computed
local OnEvent = Fusion.OnEvent
local function ToggleButton(props)
local isButtonOn = State(false)
return New "TextButton" {
BackgroundColor3 = Computed(function()
if isButtonOn:get() then
return Color3.new(0, 1, 0) -- green when toggled on
else
return Color3.new(1, 0, 0) -- red when toggled off
end
end),
TextColor3 = Color3.new(0, 0, 0),
Text = props.message,
[OnEvent "Activated"] = function()
isButtonOn:set(not isButtonOn:get())
end
}
end
return ToggleButton
My apologies for the bump on this few months old topic, but I couldn’t help but contribute my solution whilst I was searching about the same problem I had and if you don’t use Fusion anymore or silently found the solution, oh well. If you look at Hoarcekat’s example .story script here you can see the entire modulescript returns a single function with a ‘target’ parameter (which acts like the PlayerGui for previews). Simply set the parent of your ScreenGui to the target and it will work.
Here is what my solution would’ve been:
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local Fusion = require(ReplicatedStorage.Fusion)
local New = Fusion.New
local Children = Fusion.Children
return function(target)
local gui = New "ScreenGui" {
Parent = target
Name = "MyFirstGui",
ResetOnSpawn = false,
ZIndexBehavior = "Sibling",
[Children] = {
New "TextLabel" {
Position = UDim2.fromScale(.5, .5),
AnchorPoint = Vector2.new(.5, .5),
Size = UDim2.fromOffset(200, 50),
Text = "Fusion is fun :)"
},
New "TextLabel" {
Position = UDim2.new(.5, 0, .5, 50),
AnchorPoint = Vector2.new(.5, .5),
Size = UDim2.fromOffset(200, 50),
Text = "Two is better than one!"
}
}
}
end
Does that mean I need to create a screengui for every single element tho? I want all my elements to be under a single HUD gui, but I wanna be able to view each element individually in hoarcekat
No, you can create multiple ‘stories’. If you’re using components for your HUD gui, you will have to create a modulescript ‘story’ for each component resulting in something like this:
