TEXT NA KŘIVCE V APLIKACI SKETCH

Dřív nebo později dojde k situaci, kdy budete v aplikaci Sketch potřebovat přichytit text k určitému tvaru. V dnešním rychlém tipu se dozvíme, jak na to.

Přichycení textu k vlnovce v aplikaci Sketch

Jak přichytíme text k vlnovce tak jak je znázorněno v obrázku výše? V artboardu si připravíme text a vlnovku. Důležité je pořadí obou prvků v artboardu (pořadí vrstev). Výše v artboardu musí být text a pod ním tvar, ke kterému chceme text přichytit.

Text umístíme k vlnovce (v podstatě text “položíme” na vlnovku), označíme text i vlnovku a v menu navigujeme na Type a zvolíme Text On Path. V případě, že máme štěstí, bude vše vypdat jako na obrázku výše. Pokud jste nedostali očekávaný výsledek, označte pouze text a upravujte jeho pozici vzhledem ke křivce. Po chvíli se se určitě podaří získat správný výsledek.

Text vně a uvnitř kružnice?

Velmi často je potřeba text přichytit ke kružnici. Postup je podobný jako v příkladě nahoře.

Přichycení textu ke kružnici v aplikaci Sketch

Nezapomeňte, že je důležité pořadí prvků. Po umístění textu na kružnici bude výsledek pravděpodobně opět trošku divný, stačí o několik pixelů (zpravidla po ose x) posunout text a vše by mělo vypadat jako na ukázce v obrázku výše vlevo.

Co je trošku neintuitivní (alespoň pro mě) je, jak vytvořit text který bude obalovat kružnici zvenku. Řešení je velmi jednoduché a rychlé. Stači označit kružnici a horizontálně ji překlopit (vpravo v sekci Flip druhá možnost).

Ve velkém množství případu si pravděpodobně nebudete přát, aby křivka byla viditelná. Vyřešit to lze hned několik způsoby. Jedním je, že pouze křivce nepřiřadíte atribut border, nebo atribut border bude mít hodnotu 0px (thickness). Nebo nastavte hodnotu opacity na 0 % (cmd+shift+h). Lepším řešením je převést text na křivky a následně stačí jen odstranit kružnici (či jiný tvar, ke kterému jste text přichytili).

Posledních pár poznámek

  • Vector ke kterému chceme text přichytit musí být “flat” tedy na něm musí být aplikovaná funkce Flatten, jinak to nebude fungovat.
  • Pokud se zdá, že text na křivce zmizel, nebo je přerušovaný, postačí provést zoom in nebo zoom out a náhled by měl být opět v pořádku.
  • Rozestupy mezi jednotlivými písmeny můžeme upravit zvětšením mezer (v pravé části Spacing->Character).

15. 10. 2016

-DM-