Protože už jsme se naučili používat text,
pojďme si s ním trochu pohrát.
Nejprve použijeme „string"
neboli česky "řetězec“.
Možná si pomyslíte:
"A co je to ten řetězec?".
Je to název
pro text v kódu.
Je to vlastně řetězec znaků.
Vaše jméno je řetězec,
název vaší školy je taky řetězec.
Každá textová zpráva,
kterou jste kdy poslali, je také řetězec.
Jednoduše řečeno
řetězec se rovná text.
Řetězce jsme již dříve
používali k malování.
Ale mohli bychom použít proměnné
s řetězci?
Samozřejmě!
Stejně jako byste
vložili číslo do proměnné,
můžete do proměnné
dát i řetězec.
Napíšeme tedy:
var myName rovná se a vaše jméno.
Já napíšu "Sophia".
a nezapomeneme na uvozovky.
A teď do funkce místo „Sophia“
napíšeme myName.
Přestože to
vypadá stejně,
můžeme to nyní
napsat třeba několikrát.
A můžeme být i víc kreativní.
Stačí pouze
změnit tuto proměnnou.
Můžu tam napsat třeba "Your name",
tedy anglicky "Vaše jméno".
Nyní to tu máme
dokonce třikrát.
Teď si to zase vratím zpátky,
a co když si s tím zkusíme
ještě pohrát?
Můžeme třeba
řetězce spojovat?
Vzpomínáte, jak jsme
dříve spojovali proměnné?
To samé můžeme udělat i teď.
Počítač prostě spojí
oba řetězce dohromady.
Tyhle řádky si už smažu.
Nechám tu jméno jen jednou a
vytvořím proměnnou nazvanou message.
Ta bude obsahovat proměnnou myName
plus třeba několik vykřičníků.
Pokud teď message vložíme do funkce text,
tak proměnnou nakreslí.
Místo jména
vidíme jméno s vykřičníky.
Příkaz přidal k našemu
jménu vykřičníky.
Můžeme to dokonce udělat
ještě zajímavější.
Třeba tuto proměnnou
necháme vypsat dvakrát.
To vlastně dává celkem smysl.
Sečtení řetězců znamená nalepit druhý
řetězec k zadní části prvního řetězce.
Možná přemýšlíte, co jiného
můžeme s řetězci provádět.
Můžeme je násobit nebo dělit
nebo odečítat?
Ne, to nejde.
Řetězce můžeme pouze spojovat.
Mohli jsme dělit
a odečítat číselné proměnné.
Řetězcové proměnné nám
umožňují jenom spojování.
To jsem ale zvědavá, co?
Ale jenom zvědavostí se člověk
dozvídá víc.
Zkusme si teď ukázat animaci, a to
interakci myši s textovými řetězci.
Vytvoříme si řetězec,
který sleduje kurzor myši,
a to pouhým přilepením do cyklu.
Jak bychom to udělali...
Vytvoříme funkci var draw,
a poté vše dáme přímo do ní.
Vypadá to povědomě,
to už jsme používali, když jsme se učili animovat.
Pokud má řetězec sledovat kurzor myši, tak
určitě potřebujeme použít mouseX a mouseY.
A máme hotovo.
Je to vlastně takové malování
naším jménem.
A samozřejmě, pokud bychom chtěli,
mohli bychom snadno nastavit pozadí.
Například nastavit
nějakou pěknou světle modrou.
A teď vidíme text,
který sleduje kurzor myši.
Úplně stejně jako jsme to
dřív dělali s objekty.
A na závěr si pojďme
vyzkoušet použití animace.
Chceme, aby velikost textu
rostla.
Tady nastavujeme
výchozí velikost textu na 30.
Ale protože už známe proměnné,
tak místo 30 bychom mohli říci:
var howBig se rovná 30.
A teď tuto proměnnou použijeme
místo toho, abychom psali přímo 30.
To je úplně to samé.
Musíme ale něco měnit,
aby se jednalo o animaci.
Můžeme to udělat třeba tak, že řekneme:
howBig se rovná howBig plus jedna.
To bude určovat,
jak se proměnná howBig mění.
Vezmeme původní hodnotu howBig a
přičteme jedna, aby to bylo o trochu větší.
A nyní stačí restartovat program.
Když pohybujeme myší,
velikost textu roste.
To vše díky tomuto řádku kódu.
No a dál je to jen na vás.
Můžete si zkusit animaci
třeba zrychlit.
Tak a tím jsme se naučili, nejen jak
manipulovat s tvary pomocí kódu,
ale i jak používat s kódem text.