pthom / imgui_bundle

Dear ImGui Bundle: an extensive set of Ready-to-use widgets and libraries, based on ImGui. Start your first app in 5 lines of code, or less. Whether you prefer Python or C++, this pack has your back!
https://pthom.github.io/imgui_bundle/
MIT License
590 stars 62 forks source link

How to change application window background color? #173

Open phong-phuong opened 5 months ago

phong-phuong commented 5 months ago

Despite setting the background color manually via

self.backgroundColor = (0, 0, 0, 0.0)

# Main render function
def gui(self):
        gl.glClearColor(*self.backgroundColor)
        gl.glClear(gl.GL_COLOR_BUFFER_BIT)

immapp.run(app.gui)

This imgui implementation seems to have its background color painted outside of the user's defined render loop. In the sample code, I set the application background to fully transparent, yet the result has a grayish tranparent background. How to adjust that background color that is hidden from the user? I could not find examples on how to do this.

image

from imgui_bundle import immapp
import glfw
import OpenGL.GL as gl

class App:
    def __init__(self):
        self.backgroundColor = (0, 0, 0, 0.0)

    def gui(self):
        gl.glClearColor(*self.backgroundColor)
        gl.glClear(gl.GL_COLOR_BUFFER_BIT)

# Main function
def main():
    if not glfw.init():
        print("Could not initialize OpenGL context")
        exit(1)

    # Transparent window
    glfw.window_hint(glfw.TRANSPARENT_FRAMEBUFFER, glfw.TRUE)

    app = App()
    immapp.run(app.gui, with_implot=True, with_markdown=True, window_size=(1000, 800))

# Run the main function
if __name__ == "__main__":
    main()
pthom commented 5 months ago

See backgroundColor inside imguiwindowparams

    runner_params = hello_imgui.RunnerParams()
    runner_params.imgui_window_params.background_color = (0.0, 0.0, 0.0, 1.0)

    addons = immapp.AddOnsParams()
    addons.with_markdown = True

    immapp.run(runner_params, addons)

You should not use gl calls inside the gui functions. If you want to draw a custom background with OpenGL, see https://pthom.github.io/imgui_bundle/quickstart.html#_custom_3d_background

phong-phuong commented 5 months ago

Thanks for the response. I am not trying to draw a custom background, the goal is to have complete control the background, in my use case, the goal is to have a completely transparent background.

Updating the example code to use the code you have provided, I'm still at square one. It still produces a grayish transcluent background.

from imgui_bundle import immapp, hello_imgui
import glfw
import OpenGL.GL as gl

class App:
    def show_gui(self):
        # gl.glClearColor(*self.backgroundColor)
        # gl.glClear(gl.GL_COLOR_BUFFER_BIT)
        pass

def main():
    if not glfw.init():
        print("Could not initialize OpenGL context")
        exit(1)

    # Transparent window
    glfw.window_hint(glfw.TRANSPARENT_FRAMEBUFFER, glfw.TRUE)

    app = App()
    runner_params = hello_imgui.RunnerParams()
    runner_params.imgui_window_params.background_color = (0.0, 0.0, 0.0, 0.0)
    runner_params.callbacks.show_gui = app.show_gui

    addons = immapp.AddOnsParams()
    addons.with_markdown = True
    addons.with_implot = True

    immapp.run(runner_params, addons)

if __name__ == "__main__":
    main()

image

This is the result I am after (which can be achieved using pyimgui): image

phong-phuong commented 5 months ago

Nevermind, I modified the custom 3d background example and it gave me the result I was after, thank you again :)

pthom commented 5 months ago

Now, I understand the issue better: by default Hello ImGui will provide a default ImGui Window that occupies the full Application Window. This differs from ImGui's default behavior, but can be changed.

See below:

from imgui_bundle import imgui, hello_imgui

def gui():
    imgui.text("Hello world")

def main():
    runner_params = hello_imgui.RunnerParams()
    # Tell Hello ImGui to not create a default window
    runner_params.imgui_window_params.default_imgui_window_type = hello_imgui.DefaultImGuiWindowType.no_default_window

    # Change the background color
    runner_params.imgui_window_params.background_color = (0, 0.5, 0.5, 0.3)
    runner_params.callbacks.show_gui = gui

    hello_imgui.run(runner_params)

if __name__ == "__main__":
    main()
image

And for a transparent application window:

from imgui_bundle import imgui, hello_imgui, ImVec4
import glfw  # Always import glfw after imgui_bundle

def gui():
    imgui.text("Hello world")

def main():
    # Tell glfw to use a transparent application window, before running Hello ImGui
    if not glfw.init():
        exit(1)
    glfw.window_hint(glfw.TRANSPARENT_FRAMEBUFFER, glfw.TRUE)

    runner_params = hello_imgui.RunnerParams()
    # Tell Hello ImGui to not create a default window
    runner_params.imgui_window_params.default_imgui_window_type = (
        hello_imgui.DefaultImGuiWindowType.no_default_window)

    # Change the background color
    runner_params.imgui_window_params.background_color = (0, 0.5, 0.5, 0.5)
    runner_params.callbacks.show_gui = gui

    # Also make ImGui windows transparent
    runner_params.callbacks.setup_imgui_style = \
        lambda : imgui.get_style().set_color_(imgui.Col_.window_bg, ImVec4(1.0, 0.0, 0.0, 0.6))

    hello_imgui.run(runner_params)

if __name__ == "__main__":
    main()
image