Better strokes tab

[PierrickP]

I just saw your new update. I think, we can go further.

I really like the stroke on this app https://play.google.com/store/apps/details?id=com.yodesoft.android.hanzi_handwriting

• Grid background (very useful for learners like me 😂 )
• Each step below
• A bit slower
• Radical color (?)

[ph0ngp]

Hi, so here is the documentation for the Hanzi Writer library, which I use for stroke animation, and KanjiEntry.tsx is the place where I use that library (the part with HanziWriter.create(). You can tinker with it.

• Grid background: Can you tell me why you think this feature is very useful? I haven't tried but it's mentioned in the Hanzi Writer documentation link above, in the "Custom backgrounds" part, looks like it can be done by replacing the svgContainerRef.current with a pre-drawn background svg in the KanjiEntry.tsx file.
• Each step below: the pop up is currently too small to display all steps like that app 😂 I think what we can do is create a "forward 1 step" and "backward 1 step" button to step-by-step animate the stroke order. From the Hanzi Writer documentation, we can use writer.animateStroke(strokeNum, options = {}) to achieve this.
• A bit slower: very easy, you can modify delayBetweenStrokes to fit your pace
• Radical color: is already supported

If I have time, I will try to implement these to see if they look good, but in the meantime, you can try modify the code as I say and see if it fits you 😀 I think the step-by-step stroke order is a nice feature to add 😀

[ph0ngp]

Regarding this issue, since version 1.1.4, I have adjusted the animation speed to be slightly slower and now you can play/pause during the animation