question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Modal does not render correctly when using multiple `begin`

See original GitHub issue

Describe the bug When using multiple windows, i.e. ImGui.begin... the offsets for rendering are incorrect and cause modals to not have the correct background, the background faded color becomes the windows foreground.

To Reproduce Chapter 15, create multiple ImGui windows in the gui render.
Create a popup modal.

Expected behavior The popup modal should render correctly.

See https://github.com/ocornut/imgui/issues/4845 for more information.

I have a modified snippet from a vulkan test rendering engine I wrote that shows a working implementation using imgui offsets from the render data, I have modified it to be similar to the implementation here for ease of implementation.

            ImVec4 imVec4 = new ImVec4();
            VkRect2D.Buffer rect = VkRect2D.calloc(1, stack);

            int numCmdLists = imDrawData.getCmdListsCount();
            int offsetIdx = 0;
            int offsetVtx = 0;
            for (int i = 0; i < numCmdLists; i++) {

                int cmdBufferSize = imDrawData.getCmdListCmdBufferSize(i);
                for (int j = 0; j < cmdBufferSize; j++) {

                    imDrawData.getCmdListCmdBufferClipRect(i, j, imVec4);
                    rect.offset(it -> it
                            .x((int) Math.max(imVec4.x, 0))
                            .y((int) Math.max(imVec4.y, 1))
                    );
                    rect.extent(it -> it
                            .width((int) (imVec4.z - imVec4.x))
                            .height((int) (imVec4.w - imVec4.y))
                    );
                    vkCmdSetScissor(cmdHandle, 0, rect);

                    int numElements = imDrawData.getCmdListCmdBufferElemCount(i, j);

                    //Get texture info
                    int textureId = imDrawData.getCmdListCmdBufferTextureId(i, j);
                    if (textureId > 0) {
                        //Bind texture
                        //OVkTexture texture = pipeline.getBufferCache().getVkTexture(ImGuiUtil.getTexture(textureId));
                        //if (!texture.isTransitionRecorded()) {
                        //    continue; //We will wait until the texture is recorded
                        //}
                        //shaderPipeline.setParameter("textureSampler", texture); //TODO: We cannot set this here
                    } else {
                        //Set texture
                        //shaderPipeline.setParameter("textureSampler", fontsTexture); //TODO: We cannot set this here
                    }

                    OVkDebug.debugCommandBuffer(commandBuffer, "Draw Indexed Count=" + numElements + ". Size=" + rect.extent().width() + "x" + rect.extent().height());
                    vkCmdDrawIndexed(
                            cmdHandle, 
                            numElements,
                            1, 
                            offsetIdx + imDrawData.getCmdListCmdBufferIdxOffset(i, j), 
                            offsetVtx + imDrawData.getCmdListCmdBufferVtxOffset(i, j), 
                            0
                    );
                    OVkDebug.debugInsertLabel(commandBuffer, "Draw Indexed Count=" + numElements + ". Size=" + rect.extent().width() + "x" + rect.extent().height(), new Vector4f(.5f, .6f, 1f, 1f));
                }
                offsetIdx += imDrawData.getCmdListIdxBufferSize(i);
                offsetVtx += imDrawData.getCmdListVtxBufferSize(i);
            }
            OVkDebug.debugEndLabel(commandBuffer); //END Drawing ImGui

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
lwjglgamedevcommented, Jul 23, 2022

Nope. Not sure if graying out the background was correct or not. Ok, Fixed then. I will review the text and update next chapters. Thanks!

0reactions
tlf30commented, Jul 23, 2022

Yep, that looks correct for what a popup modal should do (graying out the background). Is there some other behavior you were expecting, or something that does not look correct?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Modal not rendering correctly in IE - reactjs - Stack Overflow
I found a way to sort this out. Inside this modal I am actually rendering another div (which has different composition of text...
Read more >
Multiple modals not working in react native · Issue #30 - GitHub
When tapping on first modal window i need to open a second modal to the user. i implemented the same but the second...
Read more >
How to render modals in React - freeCodeCamp
One strategy is to use ReactDOM portals, and put the modal in a div that is a sibling component to the div with...
Read more >
The Dialog element - HTML: HyperText Markup Language
showModal () methods to render dialogs, rather than the open attribute. If a <dialog> is opened using the open attribute, it will be ......
Read more >
Common problems - The jQuery replacement for select boxes
Select2 does not function properly when I use it inside a Bootstrap modal. ... This issue occurs because Bootstrap modals tend to steal...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found