adamwulf / JotUI

OpenGL based drawing view built for and used by Loose Leaf for iPad
http://getlooseleaf.com/opensource/
MIT License
268 stars 28 forks source link

Problems when customizing a pen style #39

Open CoderMaurice opened 5 years ago

CoderMaurice commented 5 years ago

Hello adam, Thank you for JotUI , it has helped me a lot. I want to customize a pen and I made a style based on the pen of other apps. But the result is not satisfactory, through the picture you can see that my strokes are unnatural and not round enough, the worst thing is the pixel sawtooth on the stroke, I constantly changing the stepWidth and smoothness properties, but maybe the problem is not here. Really hope to get your opinion.

my stroke: img_0036

other app: fullsizerender

adamwulf commented 5 years ago

Two thoughts - the first is something that JotView can't fix easily. Some other writing tools smooth previous parts of the stroke as you're writing. Notes does this as I recall. If you record it, and play it back frame by frame, previous parts of a letter will adjust ever so slightly to smooth the entire stroke as it's being written. This is easier to do with vector based writing, but since JotView is rasterized as you write, it would need to draw+erase+draw as you're writing, instead of only drawing the newest portion of the stroke. That was too high a performance cost at the time I wrote this.

the second thought is solvable, and uses widthForCoalescedTouch:. The current algorithm has a thicker width when writing slowly, and a thinner width when writing quickly. Also though, when the pen is slower on the screen, you'll have more points closer together, and when faster they'll be spread apart. When the velocity changes it can sometimes make for very sudden changes in the width of a stroke, which I think is causing the bulges here:

delta-width-too-fast

One thing you can try there, is to also track the previous point and previous width, then in widthForCoalescedTouch: find the distance between the current and previous points, and then make sure to only change up to X pts in width over a given distance. that should smooth the width transitions better than the more naive algorithm i have in Pen.m