[Feat] Allow end user to enable Smart guides, grid and layout overlay

[munirkamal]

First of all thank you so much for this awesome project. I've been playing with it and got a suggestion/feature request which I think will make this tool much more user-friendly.

The suggestion is to integrate smart guides functionality so that the user moves an element it gets smart guides to easily place the elements where needed, similar to sketch app.

And also if there would be option(s) to allow the users to enable Grid/Layout grid overlays that would be super useful too. Again similar to how it works in Sketch app.

I've recorded a little screencast to explain what I mean, you may watch it here. https://cl.ly/r48V

Looking forward.

Regards, Munir

[manirikhi]

Indeed, smart lines, grids are most required feature of every editor library.

[alxpez]

@munirkamal @manirikhi thanks for the input!

I believe adding grid and layout overlays to be fairly simple and straight forward, so it won't be a problem for me to add these features in near-future releases.

However, I don't have any idea on how to implement the smart lines (I honestly haven't even researched it), I would be more than happy to hear any thoughts/ideas on this matter.

[625781186]

@alxpez I think QT designer's smart layout is excellent.

I found some vue designers with different characteristics , and my final goal is to make a vue designer similar to qt designer.

[laurensiusadi]

Found something that might be helpful https://github.com/lf2com/magnet.js

Demo here: https://lf2com.github.io/magnet.js/demo/demo_types.html