Separate curveRadius center from anchorX
lxfschr opened this issue · comments
Is it possible to have the curve radius center point separate from the anchorX value. My use case is I want the anchor to be on the top left, so the text expands out to the right as you type, but I'd also like to control the curveRadius such that the text curves around the bounding box center, rather than the left edge.
Hmm... I'm having trouble envisioning the exact behavior you'd like, but I think you're maybe just wanting the text to be rotated around the anchor point to keep the left/right edges sitting on a consistent plane? If that's correct then you could apply that rotation yourself after the sync completes by using the returned bounds and some math...?
Thanks for your quick response! You're right about what I am envisioning, and your advice helps in that I would be able to accomplish what I want via a custom transform after the sync. As I was trying it out however I found that the sync callback is not triggered when updating the curveRadius parameter. I found the spot in the code where it is not included in the syncable props
https://github.com/protectwise/troika/blob/main/packages/troika-three-text/src/Text.js#L55
Is there a reason for this? If not I can fork the repo and add it and perhaps make a PR back here?
Also is there any value in adding this custom transform directly into troika-three-text, rather than having to wait for the sync to complete?
Ah, that makes sense -- the curveRadius is strictly a shader parameter and therefore takes effect immediately, it doesn't require a reprocessing of the text layout.
Oh yup that worked. I can get the bounds directly after updating curveRadius and do the transform I need. Thanks for all your help! I am more and more impressed with the library the more I dig. Thanks for all your hard work!
Great! Thank you for the kind words. :)