disjukr / croquis.js

HTML5 drawing tool library
https://croquisjs.0xabcdef.com/example/common-brush
216 stars 34 forks source link

common vs simple #19

Closed KaelanRichards closed 3 years ago

KaelanRichards commented 3 years ago

I am trying to implement a photoshop brush experience in the browser. This seems like a great tool. I am having trouble getting the hang of how to use this library. I would like to have similar data control like the common example. Maybe a bit more documentation would help.

what is the difference between the simple and common examples?

Thanks for creating this!

disjukr commented 3 years ago

The common brush and the simple brush have a similar interface, and the difference between the two brushes is the way they draw.

The common brush draws by calling ctx.drawImage multiple times from the start point to the end point, whereas the simple brush draws lines using the canvas vector drawing function.

So, what can be expressed with a common brush may be difficult to express with a simple brush.

KaelanRichards commented 3 years ago

So, if I were to want photoshop like features such as flow, opacity on pen pressure, etc. I would use common brush?

disjukr commented 3 years ago

Right. Using common brush only is enough.

KaelanRichards commented 3 years ago

Thanks!

KaelanRichards commented 3 years ago

Is there a way to implement undo with common brush? Seems tough since it continuously draws the image

disjukr commented 3 years ago

In the old version(https://github.com/disjukr/croquis.js/tree/v0.3.2), croquis.js supported a bit more scope such as layers and history functions, but now only brush implementation is left.