-
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.
