pythongosssss / ComfyUI-Custom-Scripts

Enhancements & experiments for ComfyUI, mostly focusing on UI features
MIT License
1.38k stars 104 forks source link

show guide lines/boxes for nodes #228

Open choey opened 3 months ago

choey commented 3 months ago

Hi,

This PR adds a quality-of-life improvement for keeping nodes neatly aligned in a workflow.

Problem

Consider the current behavior when organizing a node (snap to grid turned on):

https://github.com/pythongosssss/ComfyUI-Custom-Scripts/assets/83140/b7e40ebc-3796-45b2-8e4c-11897d57a5a0

Except for the faint preview box, indicating where the node will snap to, it's difficult to align a node with others (especially if they are far apart in the workflow).

Solution

  1. Display orthogonal guide lines that extend across the canvas. This helps align a node with other nodes.
  2. Customize the preview box for improved visibility.

https://github.com/pythongosssss/ComfyUI-Custom-Scripts/assets/83140/862d9482-040a-472d-a26e-9c7144e500c6