DWilliames / paddy-sketch-plugin

Automated padding, spacing and alignment for your Sketch layers
MIT License
2.17k stars 61 forks source link

Unexpected sizing results when applying text overrides to symbols #89

Open tschmeisser opened 6 years ago

tschmeisser commented 6 years ago

Bug report

Sketch 49.1 + Paddy 1.0.7

I'm having unexpected sizing results when applying text overrides to symbols. Image below.

For context, I'm using the pink spacer rectangles to narrow down the issue. I'm not applying padding to the background or spacing between elements as seen in the layer settings. Ideally, I would use Paddy to create the spacing around the text instead of spacers. I've been doing this with the Autolayout plugin for a while, but using one plugin would be even better. The idea is the maintain exact spacing between the elements as text grows from one to many lines as then re-pad the background shape so that I don't have to manually make the symbol/group taller to see all of the content.

In the below example, both groups are the exact same. The second just has more copy in the text boxes and produces the desired result (the box grows vertically).

Happy to add more info if needed. Thanks!

Expected behavior:

The padding, alignment and spacing of a symbol should be maintained when text is overridden.

Actual behavior:

The symbol jumps to the left and resizes. Also does not maintain the centering setting.

example

Steps to reproduce:

Place a clean symbol, override the symbol text and it will jump sideways and grow.

Paddy-Test-031918.sketch.zip

Thanks for your time!

ghaneshrs commented 6 years ago

Same issue here.... any solutions ?

mischugo commented 6 years ago

I have a similar problem and it matches the title of this issue. The background of my symbol just jumps away completely...

Don't know what i can further do :-( paddybackgroundjump

Thanks a lot

zethussuen commented 6 years ago

+1 seeing this issue as well while building tooltips. Seems like when an instance of a symbol is being changed, the base symbol itself is running into issues restoring originalProperties and originalPositions?

iamhenry commented 6 years ago

I am also running into this issue.

kium-one commented 6 years ago

Similar (or same) issue here... button

kium-one commented 6 years ago

Also it's mentioned that the plugin does not modify what's inside symbols, it only resizes symbols themselves, so how come it's being resized? I checked and there are no nested rules in the symbols below that.

zethussuen commented 6 years ago

@najiglass it’s not supposed to. If you peek into the source code for symbols.js, you’ll see there is modifications to the base symbol. There just exists a bug where original calculations are not being correctly made I believe.

DWilliames commented 6 years ago

Thanks all. That's correct @zethussuen. Right now, it sets the overrides in the symbol master itself, then resizes to find the correct size. Then sets all the values back.

I don't think this is a very good approach; so I'm looking into a different way of doing it – which will hopefully mitigate all these issues.

Thanks all for your patience.

chunkitdesign commented 6 years ago

yes, I have the same issue. It works fine if this is only a group. When I resize the group the text will flow automatically. However, if I turn the Group into a symbol, and override it with a long text, it will be expanded into one line. Anyway, thank you for the awesome add-on.