[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:01.11,0:00:03.19,Default,,0000,0000,0000,,Sok módja van annak, hogy valami animáltnak látszódjon,
Dialogue: 0,0:00:03.19,0:00:05.24,Default,,0000,0000,0000,,az alapelv mégis mindig ugyan az:
Dialogue: 0,0:00:05.24,0:00:07.13,Default,,0000,0000,0000,,Ha van egy köteg rajzod vagy képed
Dialogue: 0,0:00:07.13,0:00:09.73,Default,,0000,0000,0000,,és mindegyik csak egy kicsit tér el a másiktól
Dialogue: 0,0:00:09.73,0:00:11.46,Default,,0000,0000,0000,,és elég gyorsan pörgeted őket
Dialogue: 0,0:00:11.46,0:00:13.27,Default,,0000,0000,0000,,mozgóképnek fog látszódni.
Dialogue: 0,0:00:13.27,0:00:16.17,Default,,0000,0000,0000,,A régi időkben ezeket a rajzokat kézzel készítették
Dialogue: 0,0:00:16.17,0:00:19.70,Default,,0000,0000,0000,,és NAGYON sokáig tartott egy három másodperces animáció elkészítése.
Dialogue: 0,0:00:19.70,0:00:22.88,Default,,0000,0000,0000,,Szerencsénkre mi a jövőben élünk.
Dialogue: 0,0:00:22.88,0:00:26.13,Default,,0000,0000,0000,,Nagyon könnyű kódolással egy egyszerű animációt elkészíteni.
Dialogue: 0,0:00:26.13,0:00:27.100,Default,,0000,0000,0000,,Meg is mutatom, hogyan kell!
Dialogue: 0,0:00:27.100,0:00:31.47,Default,,0000,0000,0000,,A jobb oldalon látsz egy édes kisautót szép sárga háttérben.
Dialogue: 0,0:00:31.47,0:00:34.96,Default,,0000,0000,0000,,És igen, én magam terveztem ezt az autót, köszi!
Dialogue: 0,0:00:34.96,0:00:38.58,Default,,0000,0000,0000,,Mindegy, itt állítottuk be ezt a szép hátteret
Dialogue: 0,0:00:38.58,0:00:42.53,Default,,0000,0000,0000,,és az autónak nincsenek körvonalai, azaz noStroke() parancsot használunk.
Dialogue: 0,0:00:42.53,0:00:47.47,Default,,0000,0000,0000,,Azután készítünk egy új változót (x) az autó pozíciójának, és adunk neki egy értéket, ez 10 lesz.
Dialogue: 0,0:00:47.47,0:00:49.46,Default,,0000,0000,0000,,Ha ezt az értéket megváltoztatjuk,
Dialogue: 0,0:00:49.46,0:00:52.10,Default,,0000,0000,0000,,akkor az autó előre-hátra mozogni fog.
Dialogue: 0,0:00:52.10,0:00:53.53,Default,,0000,0000,0000,,Legyen 10
Dialogue: 0,0:00:53.53,0:00:57.59,Default,,0000,0000,0000,,Itt beállítjuk az autó kitöltési színét és két négyszöget rajzolunk testnek.
Dialogue: 0,0:00:57.59,0:01:00.06,Default,,0000,0000,0000,,Az első négyszög lesz az alja
Dialogue: 0,0:01:00.06,0:01:02.48,Default,,0000,0000,0000,,a második a teteje.
Dialogue: 0,0:01:02.48,0:01:05.03,Default,,0000,0000,0000,,Itt a kerekekkel ugyanezt csináljuk
Dialogue: 0,0:01:05.03,0:01:06.98,Default,,0000,0000,0000,,Beállítjuk a kitöltő színt és rajzolunk két ellipszist:
Dialogue: 0,0:01:06.98,0:01:08.65,Default,,0000,0000,0000,,egy az x+25-nél,
Dialogue: 0,0:01:08.65,0:01:10.19,Default,,0000,0000,0000,,és egy az x+75-nél
Dialogue: 0,0:01:10.19,0:01:12.83,Default,,0000,0000,0000,,Végre rátérünk az újdonságra.
Dialogue: 0,0:01:12.83,0:01:15.17,Default,,0000,0000,0000,,Ezt a dolgot itt úgy hívják, hogy funkció definíció
Dialogue: 0,0:01:15.17,0:01:16.69,Default,,0000,0000,0000,,Erről később még fogsz tanulni.
Dialogue: 0,0:01:16.69,0:01:19.57,Default,,0000,0000,0000,,Most csak nézzünk rá és jegyezzük meg, hogy fest.
Dialogue: 0,0:01:19.57,0:01:24.29,Default,,0000,0000,0000,,Ami a fontos, az a "draw" és ezek a zárójelek.
Dialogue: 0,0:01:24.29,0:01:25.19,Default,,0000,0000,0000,,Ez a nyitó zárójel
Dialogue: 0,0:01:25.19,0:01:26.75,Default,,0000,0000,0000,,Ez a záró.
Dialogue: 0,0:01:26.75,0:01:30.53,Default,,0000,0000,0000,,Ezt az egész dolgot együtt rajzolási, vagy animációs ciklusnak hívjuk.
Dialogue: 0,0:01:30.53,0:01:35.30,Default,,0000,0000,0000,,Minden, amit a zárójelek közé teszel ismétlődni fog, úgymond lefut újra meg újra nagyon gyorsan
Dialogue: 0,0:01:35.30,0:01:36.70,Default,,0000,0000,0000,,Ezért hívjuk ciklusnak (angolul loop)
Dialogue: 0,0:01:36.70,0:01:41.79,Default,,0000,0000,0000,,Minden, ami a zárójeleken kívül van csak egyszer fut le, a program kezdetén.
Dialogue: 0,0:01:41.79,0:01:45.53,Default,,0000,0000,0000,,Első lépés tehát, hogy a rajzainkat betesszük a zárójelek közé
Dialogue: 0,0:01:45.53,0:01:47.83,Default,,0000,0000,0000,,Így a képeket újra és újra rajzolja a program.
Dialogue: 0,0:01:47.83,0:01:51.66,Default,,0000,0000,0000,,Ezt csináljuk meg. Ezt kijelölöm
Dialogue: 0,0:01:51.66,0:01:54.26,Default,,0000,0000,0000,,és lehúzom a ciklusomba.
Dialogue: 0,0:01:54.26,0:02:02.47,Default,,0000,0000,0000,,Hogy jól látszódjon, hogy ez a kód a zárójelben van, egy behúzással beljebb viszem, kijelölöm és megnyomom a tab gombot
Dialogue: 0,0:02:02.47,0:02:05.75,Default,,0000,0000,0000,,Már tudom, hogy a zárójelben van a kódom.
Dialogue: 0,0:02:05.75,0:02:10.21,Default,,0000,0000,0000,,Minden ugyanolyan maradt, semmi nem változott.
Dialogue: 0,0:02:10.21,0:02:17.79,Default,,0000,0000,0000,,Amikor először fut le a kód, a gép azt mondja: "oké, legyen egy új változónk x, legyen 10, rajzolj két négyszöget és két ellipszist".
Dialogue: 0,0:02:17.79,0:02:24.29,Default,,0000,0000,0000,,Aztán visszamegy az elejére és azt mondja: "oké, legyen egy új változónk x, legyen 10, rajzolj két négyszöget és két ellipszist".
Dialogue: 0,0:02:24.29,0:02:28.21,Default,,0000,0000,0000,,Aztán azt mondja: "oké, legyen egy új változónk x, legyen 10, rajzolj két négyszöget és két ellipszist". Teljesen ugyanazt.
Dialogue: 0,0:02:28.21,0:02:31.15,Default,,0000,0000,0000,,Semmi sem változott, ezért nem is fogsz animációt látni.
Dialogue: 0,0:02:31.15,0:02:34.66,Default,,0000,0000,0000,,Csak ugyanazokat a négyszögeket és ellipsziseket fogja egymásra rajzolni.
Dialogue: 0,0:02:34.66,0:02:40.40,Default,,0000,0000,0000,,Ne feledd, ha valamit animáltnak szeretnénk látni, időnként apróságokat változtatni kell rajta.
Dialogue: 0,0:02:40.40,0:02:42.76,Default,,0000,0000,0000,,Szóval ha azt szeretném, hogy az autóm előre mozogjon,
Dialogue: 0,0:02:42.76,0:02:45.36,Default,,0000,0000,0000,,az x értékét kell változtatnom, igaz?
Dialogue: 0,0:02:45.36,0:02:48.05,Default,,0000,0000,0000,,Oké, akkor legyen 11.
Dialogue: 0,0:02:48.05,0:02:51.12,Default,,0000,0000,0000,,De akkor minden alkalommal 11 lesz!
Dialogue: 0,0:02:51.12,0:02:57.56,Default,,0000,0000,0000,,Hogy kellene megoldanom, hogy az x értéke változzon minden alkalommal, amikor a kód újra lefut?
Dialogue: 0,0:02:57.56,0:02:59.71,Default,,0000,0000,0000,,Nézd ezt a bűvös trükköt:
Dialogue: 0,0:02:59.71,0:03:02.79,Default,,0000,0000,0000,,Emlékszel, a var x egy új változót készít.
Dialogue: 0,0:03:02.79,0:03:08.06,Default,,0000,0000,0000,,Ha a cikluson belül hagyjuk, minden egyes alkalommal készít egy új x nevű változót
Dialogue: 0,0:03:08.06,0:03:13.47,Default,,0000,0000,0000,,Nekünk az kell, hogy a változót a cikluson kívül hozzuk létre. Így csak egyszer készül el.
Dialogue: 0,0:03:13.47,0:03:22.77,Default,,0000,0000,0000,,Minden alkalommal, mikor a kód lefut, és látja a gép, hogy az x már létezik és azt az értékét fogja használni, amelyet mi adunk neki.
Dialogue: 0,0:03:22.77,0:03:31.30,Default,,0000,0000,0000,,Tehát az lesz, hogy a változót kitesszük a cikluson kívülre, így csak egyszer "gyártódik" le
Dialogue: 0,0:03:31.30,0:03:38.29,Default,,0000,0000,0000,,és minden alkalommal mikor az x-szel találkozik, ugyanazt az egy változót fogja használni és az értéke is az lesz, amit utoljára adtunk, azaz 11
Dialogue: 0,0:03:38.29,0:03:41.76,Default,,0000,0000,0000,,azaz ezentúl mindig 11 lesz.
Dialogue: 0,0:03:41.76,0:03:52.98,Default,,0000,0000,0000,,valahol a rajzolás ciklusban megváltoztatjuk az x értékét, mondjuk legyen az x az x előző értéke +1
Dialogue: 0,0:03:52.98,0:03:54.93,Default,,0000,0000,0000,,Juhé! Működik!
Dialogue: 0,0:03:54.93,0:04:02.82,Default,,0000,0000,0000,,Kivéve hogy.. valahogy furcsa. Ha szeretnéd tudni, azért ilyen, mert a hátteret elfelejtettük a cikluson belülre tenni.
Dialogue: 0,0:04:02.82,0:04:07.15,Default,,0000,0000,0000,,Tehát lerajzolja az autót újra meg újra, de az összes eddigi autót is látod a mostani alatt.
Dialogue: 0,0:04:07.15,0:04:12.19,Default,,0000,0000,0000,,Ezért ha ezt a sort ide húzom a ciklusom elejére,
Dialogue: 0,0:04:12.19,0:04:15.98,Default,,0000,0000,0000,,és megnyomom az újraindítás gombot, látom az autómat...
Dialogue: 0,0:04:15.98,0:04:18.27,Default,,0000,0000,0000,,Hurrá! Tökéletes!
Dialogue: 0,0:04:18.27,0:04:22.39,Default,,0000,0000,0000,,És ha szeretnénk, hogy az autónk gyorsabban menjen, növelhetjük az x szorzóját,
Dialogue: 0,0:04:22.39,0:04:28.86,Default,,0000,0000,0000,,ha 10, húha! Lement a képről! Állíthatom negatívra is, így x-10, és...
Dialogue: 0,0:04:28.86,0:04:34.55,Default,,0000,0000,0000,,Itt jön! Legyen pozitív, upsz... ott megy!
Dialogue: 0,0:04:34.55,0:04:36.55,Default,,0000,0000,0000,,Tehát ezekre kell emlékeznünk:
Dialogue: 0,0:04:36.55,0:04:43.51,Default,,0000,0000,0000,,Ezt itt rajzolási ciklusnak hívjuk. Tedd bele a rajzolási kódodat és újra és újra megrajzolja.
Dialogue: 0,0:04:43.51,0:04:52.02,Default,,0000,0000,0000,,Azután a változóidat a cikluson kívül definiáld, ez nagyon fontos, így tudjuk ugyanazt a változót újra és újra használni.
Dialogue: 0,0:04:52.02,0:04:55.85,Default,,0000,0000,0000,,Azután a ciklusban megváltoztatjuk a változó értékét egy picit
Dialogue: 0,0:04:55.85,0:05:02.32,Default,,0000,0000,0000,,általában hozzáadunk az eredeti számhoz, vagy elveszünk belőle egy számot
Dialogue: 0,0:05:02.32,0:05:07.93,Default,,0000,0000,0000,,És végül a változókat használjuk a rajzolási kódon belül, így a rajzunk változni fog időről időre.
Dialogue: 0,0:05:08.48,0:05:10.01,Default,,0000,0000,0000,,És kész!