2D Drawing Canvas

I'm relatively new to rust, currently building a desktop app where I'd like to create a simple 2D canvas that can detect mouse events by the user and draw vectors, similar to the figma canvas for example.

Are there any recommended crates? I've looked at minifb and nannou, however, can't find any good examples of a '2d draw canvas' being implemented with these crates that I can use as a starting reference/helper.

Any open source repos or similar anyone can suggest?

Could you tell us more about the context of what you are trying to build? I.e. some desktop app or a website? Also the scope would be interesting, like is your project going to be a simple program you are going to use once or are you trying to build a full-fledged editor for vector graphics like figma? Have you looked at the nannou examples? Why is rust your language of choice? I.e. JS has a much more mature ecosystem of canvas drawing libraries and UI capabilities.

For everything great about javascript and made much better by typescript, everything that is messy, bloated, slow and unsafe about js is a big part of the reason to embrace Rust as the future. All the usual reasons why anyone would pick up Rust are why I did. I know it's early in many ways and there are a lot of libraries that don't exist yet that do in js or for that matter php, python, you name it. But I think that the Rust way is a better overall methodology and in the longterm will win out.

As far as the project, I'm starting with a minimalist desktop app to provide the tools necessary for what creators want to accomplish without all of the extra legacy bloat. For similar tools that have existed for a long time they're are usually built in c++ or electron or something else where the tradeoffs in the architecture build up to the point where it limits what's possible with the user experience. I'd rather build it well from the start to minimize maintenance over the long term. The most important feature is the streamlining the experience of the user interacting with the 2D canvas.

I had a look at the Nannou examples and it feels like it is exactly what I'd want to use, but I didn't see any examples of vector drawing from a user's mouse events on a canvas. I'm wondering if you could point me to a good example of how it can be done?

Thanks for your detailed answer and helping me understand what you are trying to accomplish. That is an ambitious project!

Have you checked the simple UI example? It shows how you can use the WindowEvent to update the underlying model and how to render it. While the model in the example is just a few settings, you'd probably wish to keep some sort of representation of your vector graphic here, something that you can pass to Nannou's Draw struct in order to render it to a Frame. You could listen to mouse events, update your internal state (the representation of your vector graphic and other state-related data you wish to keep, like an event buffer, metadata, or whatever else you need) and render your vector graphic in the view function.

Cool! I got it working, also learnt some glium in the processs... will share the repo when i have it more developed! :slight_smile: thanks for ur help

1 Like