DEV Community

Cover image for Released a cool update for love-imgui.
Rose Noll Crimmins - Golden
Rose Noll Crimmins - Golden

Posted on

Released a cool update for love-imgui.

So I adopted a new project that I need for my game development, love-imgui. It's an immediate mode graphical user interface lua module. You can write GUI really really fast in Lua with it. Recently however imgui implemented Gamepad navigation but the love-imgui forks on GitHub lacked support... So I took it upon myself and added it. Then shared that.

And I did just that... I updated the version of dear IMGUI to 1.75. Added Gamepad Navigation and fixed it for Keyboard Navigation as well. I even got style colours and variables working so the theme can be customized from lua/love. I still want to work on it some more and improve what is there. I was really happy to find that someone was maintaining a version more up to date with IMGUI, MikuAuahDark/love-imgui. Because the original author doesn't really touch the project anymore, slages/love-imgui. They (Miku) had the fork that had docking support but I had to remove that function to get it more up to date. I'm not sure what you should do if you really need docking support unless you're building an editor like Unity... and I'm not. I'm integrating the editor into my game instead.

It was imperative that I had a good GUI for my game I'm developing, RED2D, a private development that I want to keep more or less a mystery until I can get more of the game fleshed out. That being said, I will share screenshots of the GUI and a little bit of the development build of my game... to prove it more or less works.

It builds on Manjaro Linux, other OSes are unknown. I have not made any new releases. It's really easy to compile and add it to your project anyway.

Tip: Hook up your love-imgui build directory with love.filesystem.setCRequirePath, for faster development. When you want to package the game, get the appropriate library files manually and add them next to your love client executable. Along with your assets.

local cPath = love.filesystem.getCRequirePath( )
cPath = cPath..";3rdParty/build/??"
love.filesystem.setCRequirePath(cPath)
Enter fullscreen mode Exit fullscreen mode

Here's some example code so you can see why I love imgui/love-imgui...

local imgui = require "imgui"

local showTestWindow = false
local showAnotherWindow = false
local floatValue = 0;
local sliderFloat = { 0.1, 0.5 }
local clearColor = { 0.2, 0.2, 0.2 }
local comboSelection = 1
local textValue = "text"

--
-- LOVE callbacks
--
function love.load(arg)
    -- I added Init as a function to better setup styles
    imgui.Init()

    -- Hope you like synthwave...
    imgui.SetStyleColorV4(imgui.ImGuiCol_TabActive, 0.00, 0.44, 1.00, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TabHovered, 0.26, 0.42, 0.98, 0.80)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Tab, 0.00, 0.07, 0.79, 0.86)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ResizeGripActive, 0.44, 0.26, 0.98, 0.95)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ResizeGripHovered, 0.26, 0.98, 0.87, 0.67)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ResizeGrip, 0.29, 0.26, 0.98, 0.25)
    imgui.SetStyleColorV4(imgui.ImGuiCol_SeparatorActive, 0.01, 0.00, 1.00, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_SeparatorHovered, 0.01, 0.00, 1.00, 0.78)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Separator, 1.00, 1.00, 1.00, 0.50)
    imgui.SetStyleColorV4(imgui.ImGuiCol_HeaderActive, 0.98, 0.31, 0.26, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_HeaderHovered, 0.98, 0.10, 0.10, 0.80)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Header, 1.00, 0.07, 0.00, 0.45)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ButtonActive, 0.98, 0.06, 0.30, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ButtonHovered, 0.98, 0.26, 0.50, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Button, 1.00, 0.00, 0.46, 0.40)
    imgui.SetStyleColorV4(imgui.ImGuiCol_SliderGrabActive, 0.98, 0.86, 0.26, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_SliderGrab, 0.88, 0.79, 0.24, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_CheckMark, 0.98, 0.90, 0.26, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ScrollbarGrabActive, 0.00, 0.91, 0.90, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ScrollbarGrabHovered, 1.00, 0.43, 0.00, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ScrollbarGrab, 0.81, 1.00, 0.00, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ScrollbarBg, 0.97, 0.48, 0.00, 0.09)
    imgui.SetStyleColorV4(imgui.ImGuiCol_MenuBarBg, 0.45, 0.00, 0.18, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TitleBgCollapsed, 1.00, 0.00, 0.00, 0.51)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TitleBgActive, 1.00, 0.00, 0.27, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TitleBg, 0.64, 0.00, 0.19, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_FrameBgActive, 0.98, 0.26, 0.57, 0.67)
    imgui.SetStyleColorV4(imgui.ImGuiCol_FrameBgHovered, 0.98, 0.26, 0.74, 0.40)
    imgui.SetStyleColorV4(imgui.ImGuiCol_FrameBg, 0.00, 0.48, 0.39, 0.54)
    imgui.SetStyleColorV4(imgui.ImGuiCol_BorderShadow, 0.00, 0.02, 1.00, 0.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Border, 0.00, 1.00, 0.98, 0.50)
    imgui.SetStyleColorV4(imgui.ImGuiCol_PopupBg, 0.27, 0.28, 0.15, 0.23)
    imgui.SetStyleColorV4(imgui.ImGuiCol_ChildBg, 0.28, 0.15, 0.26, 0.23)
    imgui.SetStyleColorV4(imgui.ImGuiCol_WindowBg, 0.23, 0.12, 0.28, 0.23)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TextDisabled, 0.39, 0.39, 0.39, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_Text, 0.00, 0.95, 1.00, 1.00)
    imgui.SetStyleColorV4(imgui.ImGuiCol_TextSelectedBg, 0.14, 0.16, 0.00, 1.00)

    --- Style name is not case sensitive... pretty extra.
    --- A y argument can be added optionally
    --- imguiDirs are converted from integers to enum.
    imgui.SetStyleValue("windowRounding", 0);
    imgui.SetStyleValue("windowBorderSize", 1.5);
    imgui.SetStyleValue("childRounding", 0);
    imgui.SetStyleValue("childBorderSize", 1.5);
    imgui.SetStyleValue("popupRounding", 0);
    imgui.SetStyleValue("popupBorderSize", 1.5);
    imgui.SetStyleValue("frameRounding", 0);
    imgui.SetStyleValue("frameBorderSize", 0.5);
    imgui.SetStyleValue("scrollbarRounding", 0);
    imgui.SetStyleValue("grabRounding", 0);
    imgui.SetStyleValue("tabRounding", 0);
    imgui.SetStyleValue("antiAliasedLines", 1); --- Boolean
    imgui.SetStyleValue("antiAliasedFill", 1);
end

function love.update(dt)
    -- Connect a controller or check before running the next line... else it will crash.
    imgui.UseGamepad(1)
    imgui.NewFrame()
end

function love.draw()
    -- Menu
    if imgui.BeginMainMenuBar() then
        if imgui.BeginMenu("File") then
            imgui.MenuItem("Test")
            imgui.EndMenu()
        end
        imgui.EndMainMenuBar()
    end

    -- Debug window
    imgui.Text("Hello, world!");
    clearColor[1], clearColor[2], clearColor[3] = imgui.ColorEdit3("Clear color", clearColor[1], clearColor[2], clearColor[3]);

    -- Sliders
    floatValue = imgui.SliderFloat("SliderFloat", floatValue, 0.0, 1.0);
    sliderFloat[1], sliderFloat[2] = imgui.SliderFloat2("SliderFloat2", sliderFloat[1], sliderFloat[2], 0.0, 1.0);

    -- Combo
    comboSelection = imgui.Combo("Combo", comboSelection, { "combo1", "combo2", "combo3", "combo4" }, 4);

    -- Windows
    if imgui.Button("Test Window") then
        showTestWindow = not showTestWindow;
    end

    if imgui.Button("Another Window") then
        showAnotherWindow = not showAnotherWindow;
    end

    if showAnotherWindow then
        imgui.SetNextWindowPos(50, 50, "ImGuiCond_FirstUseEver")
        showAnotherWindow = imgui.Begin("Another Window", true, { "ImGuiWindowFlags_AlwaysAutoResize", "ImGuiWindowFlags_NoTitleBar" });
        imgui.Text("Hello");
        -- Input text
        textValue = imgui.InputTextMultiline("InputText", textValue, 200, 300, 200);
        imgui.End();
    end

    if showTestWindow then
        showTestWindow = imgui.ShowDemoWindow(true)
    end

    love.graphics.clear(clearColor[1], clearColor[2], clearColor[3])
    imgui.Render();
end

function love.quit()
    imgui.ShutDown();
end

--
-- User inputs
--
function love.textinput(t)
    imgui.TextInput(t)
    if not imgui.GetWantCaptureKeyboard() then
        -- Pass event to the game
    end
end

function love.keypressed(key)
    imgui.KeyPressed(key)
    if not imgui.GetWantCaptureKeyboard() then
        -- Pass event to the game
    end
end

function love.keyreleased(key)
    imgui.KeyReleased(key)
    if not imgui.GetWantCaptureKeyboard() then
        -- Pass event to the game
    end
end

function love.mousemoved(x, y)
    imgui.MouseMoved(x, y)
    if not imgui.GetWantCaptureMouse() then
        -- Pass event to the game
    end
end

function love.mousepressed(x, y, button)
    imgui.MousePressed(button)
    if not imgui.GetWantCaptureMouse() then
        -- Pass event to the game
    end
end

function love.mousereleased(x, y, button)
    imgui.MouseReleased(button)
    if not imgui.GetWantCaptureMouse() then
        -- Pass event to the game
    end
end

function love.wheelmoved(x, y)
    imgui.WheelMoved(y)
    if not imgui.GetWantCaptureMouse() then
        -- Pass event to the game
    end
end
Enter fullscreen mode Exit fullscreen mode

This is also my first post on Dev.to! I really think the platform is cool and I can't wait to sink my teeth into it some more. If you have any questions or stuff you want to ask, you can contact me whenever and however.

Top comments (0)