Skip to content

Commit

Permalink
Redesigned style editor.
Browse files Browse the repository at this point in the history 
Redesigned the style editor with a clearer layout and better information. Added a font section to modify the font used by Iris.
  • Loading branch information
@SirMallard
SirMallard committed Aug 13, 2024
1 parent c632d8f commit a56b043
Show file tree
Hide file tree
Showing 2 changed files with 106 additions and 39 deletions.
2 changes: 1 addition & 1 deletion lib/API.lua
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1579,7 +1579,7 @@ return function(Iris: Types.Iris)
Iris.ComboEnum = function(arguments: Types.WidgetArguments, states: Types.WidgetStates?, enumType: Enum)
local defaultState
if states == nil then
defaultState = Iris.State(enumType[1])
defaultState = Iris.State(enumType:GetEnumItems()[1])
else
defaultState = states
end
Expand Down
143 changes: 105 additions & 38 deletions lib/demoWindow.lua
View file
Original file line number Diff line number Diff line change
Expand Up @@ -742,22 +742,28 @@ return function(Iris: Types.Iris)
function()
local UpdatedConfig = Iris.State({})

if Iris.Button({ "Update Config" }).clicked() then
Iris.UpdateGlobalConfig(UpdatedConfig:get())
UpdatedConfig:set({})
Iris.SameLine()
do
if Iris.Button({ "Update" }).clicked() then
Iris.UpdateGlobalConfig(UpdatedConfig.value)
UpdatedConfig:set({})
end

helpMarker("Update the global config with these changes.")
end
Iris.End()

local function SliderInput(input: string, arguments: { any })
local Input = Iris[input](arguments, { number = Iris.WeakState(Iris._config[arguments[1]]) })
if Input.numberChanged() then
UpdatedConfig:get()[arguments[1]] = Input.number:get()
UpdatedConfig.value[arguments[1]] = Input.number:get()
end
end

local function BooleanInput(arguments: { any })
local Input = Iris.Checkbox(arguments, { isChecked = Iris.WeakState(Iris._config[arguments[1]]) })
if Input.checked() or Input.unchecked() then
UpdatedConfig:get()[arguments[1]] = Input.isChecked:get()
UpdatedConfig.value[arguments[1]] = Input.isChecked:get()
end
end

Expand Down Expand Up @@ -786,11 +792,10 @@ return function(Iris: Types.Iris)
SliderInput("SliderVector2", { "SeparatorTextPadding", nil, Vector2.zero, Vector2.one * 36 })
SliderInput("SliderUDim", { "ItemWidth", nil, UDim.new(), UDim.new(1, 200) })
SliderInput("SliderUDim", { "ContentWidth", nil, UDim.new(), UDim.new(1, 200) })
SliderInput("SliderNum", { "TextSize", 1, 4, 20 })
SliderInput("SliderNum", { "ImageBorderSize", 1, 0, 12 })
local TitleInput = Iris.ComboEnum({ "WindowTitleAlign" }, { index = Iris.WeakState(Iris._config.WindowTitleAlign) }, Enum.LeftRight)
if TitleInput.closed() then
UpdatedConfig:get().WindowTitleAlign = TitleInput.index:get()
UpdatedConfig.value["WindowTitleAlign"] = TitleInput.index:get()
end
BooleanInput({ "RichText" })
BooleanInput({ "TextWrapped" })
Expand All @@ -808,25 +813,23 @@ return function(Iris: Types.Iris)
function()
local UpdatedConfig = Iris.State({})

if Iris.Button({ "Update Config" }).clicked() then
Iris.UpdateGlobalConfig(UpdatedConfig:get())
UpdatedConfig:set({})
end

local color3s = { "BorderColor", "BorderActiveColor" }

for _, vColor in color3s do
local Input = Iris.InputColor3({ vColor }, { color = Iris.WeakState(Iris._config[vColor]) })
if Input.numberChanged() then
Iris.UpdateGlobalConfig({ [vColor] = Input.color:get() })
Iris.SameLine()
do
if Iris.Button({ "Update" }).clicked() then
Iris.UpdateGlobalConfig(UpdatedConfig.value)
UpdatedConfig:set({})
end
helpMarker("Update the global config with these changes.")
end
Iris.End()

local color4s = {
"Text",
"TextDisabled",
"WindowBg",
"PopupBg",
"Border",
"BorderActive",
"ScrollbarGrab",
"TitleBg",
"TitleBgActive",
Expand Down Expand Up @@ -862,45 +865,107 @@ return function(Iris: Types.Iris)
transparency = Iris.WeakState(Iris._config[vColor .. "Transparency"]),
})
if Input.numberChanged() then
UpdatedConfig:get()[vColor .. "Color"] = Input.color:get()
UpdatedConfig:get()[vColor .. "Transparency"] = Input.transparency:get()
UpdatedConfig.value[vColor .. "Color"] = Input.color:get()
UpdatedConfig.value[vColor .. "Transparency"] = Input.transparency:get()
end
end
end,
},
{
"Fonts",
function()
local UpdatedConfig = Iris.State({})

Iris.SameLine()
do
if Iris.Button({ "Update" }).clicked() then
Iris.UpdateGlobalConfig(UpdatedConfig.value)
UpdatedConfig:set({})
end

helpMarker("Update the global config with these changes.")
end
Iris.End()

local fonts: { [string]: Font } = {
["Code (default)"] = Font.fromEnum(Enum.Font.Code),
["Ubuntu (template)"] = Font.fromEnum(Enum.Font.Ubuntu),
["Arial"] = Font.fromEnum(Enum.Font.Arial),
["Highway"] = Font.fromEnum(Enum.Font.Highway),
["Roboto"] = Font.fromEnum(Enum.Font.Roboto),
["Roboto Mono"] = Font.fromEnum(Enum.Font.RobotoMono),
["Noto Sans"] = Font.new("rbxassetid://12187370747"),
["Builder Sans"] = Font.fromEnum(Enum.Font.BuilderSans),
["Builder Mono"] = Font.new("rbxassetid://16658246179"),
["Sono"] = Font.new("rbxassetid://12187374537"),
}

Iris.Text({ `Current Font: {Iris._config.TextFont.Family} Weight: {Iris._config.TextFont.Weight} Style: {Iris._config.TextFont.Style}` })
Iris.SeparatorText({ "Size" })

local TextSize = Iris.SliderNum({ "Font Size", 1, 4, 20 }, { number = Iris.WeakState(Iris._config.TextSize) })
if TextSize.numberChanged() then
UpdatedConfig.value["TextSize"] = TextSize.state.number:get()
end

Iris.SeparatorText({ "Properties" })

local TextFont = Iris.WeakState(Iris._config.TextFont.Family)
local FontWeight = Iris.ComboEnum({ "Font Weight" }, { index = Iris.WeakState(Iris._config.TextFont.Weight) }, Enum.FontWeight)
local FontStyle = Iris.ComboEnum({ "Font Style" }, { index = Iris.WeakState(Iris._config.TextFont.Style) }, Enum.FontStyle)

Iris.SeparatorText({ "Fonts" })
for name: string, font: Font in fonts do
font = Font.new(font.Family, FontWeight.state.index.value, FontStyle.state.index.value)
Iris.SameLine()
do
Iris.PushConfig({
TextFont = font,
})

if Iris.Selectable({ `{name} | "The quick brown fox jumps over the lazy dog."`, font.Family }, { index = TextFont }).selected() then
UpdatedConfig.value["TextFont"] = font
end
Iris.PopConfig()
end
Iris.End()
end
end,
},
}

local window = Iris.Window({ "Style Editor" }, { isOpened = showStyleEditor })
Iris.Window({ "Style Editor" }, { isOpened = showStyleEditor })
do
Iris.Text({ `Clicked close: {window.closed()}` })
Iris.Text({ "Customize the look of Iris in realtime." })
Iris.SameLine()
do
if Iris.SmallButton({ "Light Theme" }).clicked() then

local ThemeState = Iris.State("Dark Theme")
if Iris.ComboArray({ "Theme" }, { index = ThemeState }, { "Dark Theme", "Light Theme" }).closed() then
if ThemeState.value == "Dark Theme" then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.colorDark)
elseif ThemeState.value == "Light Theme" then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.colorLight)
end
if Iris.SmallButton({ "Dark Theme" }).clicked() then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.colorDark)
end

local SizeState = Iris.State("Classic Size")
if Iris.ComboArray({ "Size" }, { index = SizeState }, { "Classic Size", "Larger Size" }).closed() then
if SizeState.value == "Classic Size" then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.sizeDefault)
elseif SizeState.value == "Larger Size" then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.sizeClear)
end
end
Iris.End()

Iris.SameLine()
do
if Iris.SmallButton({ "Classic Size" }).clicked() then
if Iris.Button({ "Revert" }).clicked() then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.colorDark)
Iris.UpdateGlobalConfig(Iris.TemplateConfig.sizeDefault)
end
if Iris.SmallButton({ "Larger Size" }).clicked() then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.sizeClear)
end
end
Iris.End()

if Iris.SmallButton({ "Reset Everything" }).clicked() then
Iris.UpdateGlobalConfig(Iris.TemplateConfig.colorDark)
Iris.UpdateGlobalConfig(Iris.TemplateConfig.sizeDefault)
helpMarker("Reset Iris to the default theme and size.")
end
Iris.Separator()
Iris.End()

Iris.SameLine()
do
Expand All @@ -910,6 +975,8 @@ return function(Iris: Types.Iris)
end
Iris.End()

Iris.Separator()

styleList[selectedPanel:get()][2]()
end
Iris.End()
Expand Down

0 comments on commit a56b043

Please sign in to comment.