Handle text layer scaling by adjusting fontSize and maxWidth#11
Open
prabhatexit0 wants to merge 3 commits into
Open
Handle text layer scaling by adjusting fontSize and maxWidth#11prabhatexit0 wants to merge 3 commits into
prabhatexit0 wants to merge 3 commits into
Conversation
Text layers now resize by changing fontSize and maxWidth instead of scaleX/scaleY, preventing glyph distortion when stretching or shrinking. Click-to-create text no longer sets a default maxWidth of 200px, so the bounding box fits the actual text content. https://claude.ai/code/session_01R44b9C3iAQZZLpvJefkVMb
✅ Deploy Preview for vizpix ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
- Text now spawns at cursor position instead of (0,0) when clicking to create. The rect is always passed to addTextLayer; maxWidth is only set when the drag width > 0. - Resize only changes maxWidth (wrapping area), never fontSize. Font size is controlled exclusively via the properties panel. Vertical handles are no-ops for text since height is content-driven. - Fix measureTextLayer to account for letterSpacing, matching how text is rendered and improving hit test accuracy. https://claude.ai/code/session_01R44b9C3iAQZZLpvJefkVMb
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR modifies the transform handle behavior for text layers to convert scale transformations into fontSize and maxWidth adjustments, keeping the scale values at 1. This ensures text layers are resized through their text-specific properties rather than generic scale transforms.
Key Changes
Implementation Details
isTextLayer,textFontSize, andtextMaxWidthto the DragState interface to track text-specific properties during drag operationsstore.updateTextProperties()while transform is updated viastore.setTransform()https://claude.ai/code/session_01R44b9C3iAQZZLpvJefkVMb