Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add zoom functionality to node editor #192

Open
wants to merge 12 commits into
base: master
Choose a base branch
from
Open

Conversation

Auburn
Copy link
Collaborator

@Auburn Auburn commented Feb 4, 2024

This is done in a different way than #134, everything between BeginNodeEditor() and EndNodeEditor() is managed through it's own ImGui context. I've found this causes less bugs with ImGui features compare to #134. I got the idea from here

In BeginNodeEditor() the second ImGui context has the input queue copied from the main context with mouse positions adjusted. Then in EndNodeEditor() the draw data is copied into the main ImGui context and transformed according to the zoom scaling.

To get it working add this after EndNodeEditor()

if( ImNodes::IsEditorHovered() && ImGui::GetIO().MouseWheel != 0 )
{
    float zoom = ImNodes::EditorContextGetZoom() + ImGui::GetIO().MouseWheel * 0.1f;
    ImNodes::EditorContextSetZoom( zoom, ImGui::GetMousePos() );
}

Having 2 ImGui contexts does cause some incorrect interactions between them both, I have fixed some of these by syncing up parts from each context but there are likely still some remaining,

nodeZoom

Auburn added 5 commits April 18, 2023 01:01
IMGUI_DEFINE_MATH_OPERATORS now needs to be defined before #include <imgui.h>
Uses second ImGui context for fully functional scaling in node editor
@Auburn Auburn mentioned this pull request Feb 4, 2024
Fixes difference between contexts due to missing config
@Fattorino
Copy link

If you are curious you can see how I implemented it viewport_wrapper.h.

This is a little helper to render other contexts as widgets. Please note that it's not complete yet, and it will change in the following days.

@Auburn
Copy link
Collaborator Author

Auburn commented Feb 4, 2024

Yes you've used the same structure code from LumixEngine as I did, there were several input and config bugs from this implementation which I've fixed in this PR

@Fattorino
Copy link

yes yes it's almost identical, the main difference being the BeginChild which in my opinion is pretty handy and makes interactions more predictable and consistent. Tha's why the mention

@Auburn
Copy link
Collaborator Author

Auburn commented Feb 18, 2024

I think this probably needs an optional flag to enable it given that it makes use of a second ImGui context. Which can cause some ImGui features to behave differently

@Nelarius
Copy link
Owner

Nelarius commented Feb 23, 2024

Thank you for implementing this @Auburn ! 🚀 It's very nice to see the state of the art in ImGui node editors advance, appreciate the pointers @Fattorino 👍

  • Regarding configuration, it looks like a runtime flag would be enough to direct draw commands at the original ImGui context? Perhaps something in ImNodesIO as it already contains a bunch of toggles, or alongside it, in the ImNodesContext.
  • I would also consider adding the zoom functionality to one of the examples 👍

@ElectroGamesDev
Copy link

ElectroGamesDev commented Mar 22, 2024

I tried this fork but the node editor was no longer visible. Any idea why?

@Auburn
Copy link
Collaborator Author

Auburn commented Mar 22, 2024

It doesn't currently work with multiple node editor instances which I need to look into. I have tested it works in the examples, but I don't know what your setup is like

// Nav (tabbing) needs to be disabled otherwise it doubles up with the main context
// not sure how to get this working correctly
ImGuiWindowFlags windowFlags = ImGuiWindowFlags_NoDecoration | ImGuiWindowFlags_NoSavedSettings |
ImGuiWindowFlags_NoScrollWithMouse | ImGuiWindowFlags_NoMove;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Need ImGuiWindowFlags_NoBackground for docking feature

GImNodes->NodeEditorImgCtx->IO.ConfigInputTrickleEventQueue = false;
GImNodes->NodeEditorImgCtx->IO.DisplaySize = ImMax(canvas_size / editor.ZoomScale, ImVec2(0, 0));
GImNodes->NodeEditorImgCtx->Style = GImNodes->OriginalImgCtx->Style;

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Scaled(Zoom) context does not need viewport option, nor docking.
So, we have to disable (only if a user enabled these flags).
Otherwise assertion failur in ImGui::ErrorCheckNewFrameSanityChecks()

GImNodes->NodeEditorImgCtx->IO.ConfigFlags -= ImGuiConfigFlags_ViewportsEnable;
GImNodes->NodeEditorImgCtx->IO.ConfigFlags -= ImGuiConfigFlags_DockingEnable;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants