Saturday, March 23, 2019

Sketch: Object moves relative to another object/text in symbol


How do I make an object automatically move when I change the text preceeding/"attached to" it?


I'm trying to figure out how this default symbol works (gif included below) and replicate it.


When I type " " into the override, the wifi symbol moves next to the reception dots. When I type a longer string in (see gif), the wifi symbol automatically moves accordingly to after the text.


It's as if the wifi symbol is anchored to the END of the "Carrrier" text box (which doesn't have a fixed width), and moves according to how long the text box is. How is this done in Sketch?



Demo of changing text in a symbol with an object moving depending on the lenght of the symbol


The actual artboard doesn't have any special on it:


Artboard layers



Any solutions? Please & thanks!



Answer



Many thanks to twitter user @kieranpblack !


You must have at least 1px between the text layer and the second layer for it to work. Works on any resizing option, including default stretch!


(Can't even remember if I trialled this before the Sketch 41 update or not? Seems so simple looking at it now.)


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...