Wracamy do Winstona.
Teraz mamy dwie zmienne,
„x” i „y”, określające jego pozycję.
Możemy kazać, żeby skakał.
Możemy zrobić Winstonową imprezę!
Bardzo ładnie.
Przypomnijmy sobie, jak działa ten program.
U góry mamy zmienne „x” i „y”,
wyznaczające środek twarzy Winstona.
Korzystamy z nich, rysując elipsę - jego twarz.
Następnie pozycjonujemy oczy i usta względem środka twarzy.
Zwiększamy lub zmniejszamy „x” i „y”,
żeby oczy były oddalone o 50 i 100 pikseli.
Np. usta znajdują się o 50 pikseli w prawo od środka twarzy
i o 40 pikseli poniżej.
Zobaczmy, co jeszcze można przechowywać jako zmienne.
Przejrzę wszystkie wiersze programu
i poszukam pewnych liczb.
Będą to po prostu liczby
użyte w parametrach funkcji, niezależące od zmiennych.
Zobaczmy. W pierwszej elipsie
mamy 300 i 300 - szerokość i wysokość.
Możemy zastąpić je zmienną, np. „faceSize” (rozmiar twarzy).
Zatem „faceSize” wynosi 100.
Gdy wstawimy „faceSize” tutaj,
od razu podstawi się wartość 300.
Świetnie.
Przejdźmy dalej.
Wszystko tutaj używa „x”, „y” albo „eyeSize”,
a przy ustach znów mamy po 150 dla szerokości i wysokości.
Możemy zrobić zmienną „mouthSize” (rozmiar ust).
Powiedzmy, że to 150.
I wstawimy „mouthSize” tutaj.
Od razu podstawi się 150, bo temu jest równa zmienna.
Teraz możemy z łatwością
zmienić „faceSize” tutaj,
i bez trudu zmienimy „mouthSize”.
Możemy to przesunąć i jeszcze raz zmienić „eyeSize”.
W porządku.
Ale coś mi się tu nie podoba:
kiedy zmieniam „faceSize”,
chcę, żeby cała reszta zmieniała się względem tego.
Jeśli zrobię bardzo małą twarz,
to niech oczy i usta też będą małe.
Jeśli „faceSize” zmniejszę o połowę,
oczy i usta powinny zmaleć o tyle samo.
Inaczej Winston wyglądałby głupio
z oczami i ustami za dużymi do twarzy.
Nawet się nie łączą!
Chcemy, żeby te zmienne,
„mouthSize” i „eyeSize”
zależały od tej - „faceSize”.
Zmieńmy z powrotem.
Możemy to zrobić,
uzależniając te wartości
od wartości „faceSize”.
Możemy powiedzieć, że „mouthSize” to „faceSize/2”.
Będzie to ułamek twarzy.
Każemy komputerowi wziąć połowę rozmiaru twarzy.
Jeśli nie znacie się na ułamkach,
w Khan Academy znajdziecie filmiki
wyjaśniające, co i jak.
No dobrze. Teraz „eyeSize”. Wynosi jakieś „faceSize/4”.
Nie jest idealnie, ale całkiem nieźle.
Och, 7. Już. Tak lepiej.
Jeśli wybierzecie zły ułamek, później możecie to poprawić.
Zmieniajcie tę liczbę do skutku.
Znów zmienimy rozmiar twarzy.
Widzicie, jak zmieniają się oczy i usta?
Fajnie!
Ale wciąż coś jest nie tak.
Oczy i usta
nadal są obok twarzy, gdy robimy ją małą.
Wielkości - w porządku, to kwestia ustawienia.
Chodzi o to,
że gdy rozmieszczamy elipsy,
mamy „x-50” i „y-50”,
a potem „x+100” i „y-60”.
Nawet jeśli rozmiar twarzy wynosi tylko 50 pikseli,
oko wyświetli się o 50 pikseli od środka,
czyli poza twarzą.
Potrzebujemy czegoś do 50 i 100.
To również powinny być ułamki wartości „faceSize”,
żeby przy zmianie „faceSize”
współrzędne oczu oraz ust
także się zmieniły.
Dla przykładu zróbmy jedno oko.
„x-50”. To znaczy „x” minus 50 pikseli.
Oko ma być o 50 pikseli w lewo od środka twarzy.
Chcemy tu użyć ułamka,
więc będzie to „faceSize/6”.
Jedna szósta rozmiaru twarzy.
Super! A zamiast 50 też pojawi się „faceSize/6”.
Teraz gdy zmienimy rozmiar,
zauważcie, że oko jest w doskonałej pozycji.
Dobre masz oko, Winstonie!
Drugie potrzebuje pomocy.
Zamiast stu damy „faceSize/3”.
Jedna trzecia wielkości twarzy.
A 60 to jedna piąta tej wielkości,
czyli „faceSize/5”.
Super! Zmieńmy wielkość, dobrze.
Jest tylko problem z ustami.
Zajmijmy się tym.
To będzie znowu „faceSize/6”,
a to pewnie „faceSize/7”.
Wszystko zrobiliśmy proporcjonalnie. Zobaczmy.
Możemy zmniejszyć Winstona,
a jego oczy i usta nadal będą w twarzy.
Winston na pewno się cieszy.
W porządku! Tak!
Powtórzmy, co robiliśmy.
U góry są zmienne.
Zaczynamy od tej, która ma tylko liczbę: 200.
Definiujemy zmienne „mouthSize” i „eyeSize”,
jako ułamki tej liczby.
Jeśli więc „faceSize” wynosi 200,
to „mouthSize” będzie równe 100.
Jeśli jednak zmienimy „faceSize” na 300,
to „mouthSize” przybierze wartość 150.
Zmiany są proporcjonalne.
Tutaj, gdy obliczamy przesunięcie,
także używamy ułamków.
Chcemy, by przesunięcie zmieniało się
proporcjonalnie do „faceSize”.
Chcemy zrobić tak, żeby od jednej zmiennej
zależne było wszystko.
Można to robić ze zmiennymi i wyrażeniami ze zmiennymi.
Teraz, gdy umiemy uzależniać jedne zmienne od wartości innych,
możemy programować lepiej.
Uczcijmy to, powiększając Winstona.
Dalej, Winston, jeszcze! Jeszcze!
Nie przestawaj! Rośnij!