Share
In deze snelle tip laat ik je een heel eenvoudige manier zien om opvulling en ruimte toe te voegen aan je ontwerpen in Sketch.
Om te beginnen laat ik u een probleem zien dat u vaak tegenkwam bij het werken met Sketch. Laten we zeggen dat u een eenvoudige knop wilt maken; je zou beginnen met een rechthoekige vorm op het tekengebied, het een geschikte kleur geven, dan zou je er tekst aan toevoegen op een andere laag. Ten slotte zou u de objecten uitlijnen, groeperen en klaar zijn.
Laten we ons nu voorstellen dat je nog een knop wilt maken; vergelijkbaar, maar met andere tekst. U zou waarschijnlijk de reeds gemaakte kopie dupliceren en vervolgens de tekst wijzigen.
Ervan uitgaande dat u dezelfde zijvulling op elke zij wilt behouden, kunt u de breedten van de rechthoeken aanpassen, afhankelijk van hoe u ze wilt laten verschijnen. Een handmatig proces:
Dit lijkt misschien een eenvoudige taak, maar als je dit steeds opnieuw moet doen, kan het echt heel veel tijd kosten.
Dus laat me Paddy introduceren; een plug-in voor Sketch die u tijdwinst oplevert.
Begin met het installeren van de plug-in en ga met een tekst geselecteerd op je tekengebied naar Plug-ins> Paddy> Vul padding in voor selectie. In het dialoogvenster dat verschijnt, kunt u de padding instellen zoals u dat in CSS zou doen. Bijvoorbeeld het invoeren van een waarde van 10 20 geeft je 10px padding aan de boven- en onderkant, met 20px naar rechts en links.
Paddy maakt dan automatisch een backround-rechthoek, precies zo groot als je wilde. Maar hier is het coole gedeelte: wanneer u de tekst wijzigt, behoudt de achtergrondrechthoek de opvullende metingen die u eerder hebt ingesteld.
De laagnaam bewerken van Achtergrond (10 20) zeggen, Achtergrond (20 20) zal de opvulling veranderen om de nieuwe waarden weer te geven.
Dit werkt ook bij het toevoegen van ruimte tussen objecten. Stel je voor dat we twee knoppen hebben en we willen 50px ruimte tussen hen toevoegen. We selecteren beide knoppen en gaan dan naar Plug-ins> Paddy> Afstand voor selectie en we kunnen dan de gewenste waarde invoeren. We zouden gebruiken v eenheden om verticale afstand te definiëren, of h eenheden voor horizontaal.
In dit geval hebben we gebruikt 50v om onze twee knoppen precies 50px uit elkaar te plaatsen, verticaal.
Zoals u kunt zien, zijn de knopgroepen ingepakt in een andere groep, die de spatiewaarde vasthoudt. Als we binnen deze groep nog een knop zouden toevoegen, zou deze ook dezelfde spatiëring overnemen. En als we de opvullingswaarden of de tekstlengte binnen een van deze knoppen zouden veranderen, zou het hele ding opnieuw worden berekend en voor ons worden geherpositioneerd.
Paddy is een geweldige plug-in; Ik raad u aan het te downloaden en een kijkje te nemen naar enkele andere dingen die het kan doen. Het zal je zeker tijd besparen!
Accentsconagua