Cc -2 19-10

Oct 19, 2026 13:24 · 42:40 · Dutch · Whisper Turbo · 8 Luidsprekere
Hierdie transkripsie verstrek in 9 dae. Gradeer op vir permanente berging →
Saakregister
Vertoon slegs
0:00
S… Speaker 1 (Cc -2 19-10)
We gaan eens te beginnen met wat een animatie juist is.
0:03
S… Speaker 1 (Cc -2 19-10)
Animatie is eigenlijk allemaal frames
0:07
S… Speaker 2 (Cc -2 19-10)
na elkaar.
0:08
S… Speaker 1 (Cc -2 19-10)
Ik weet niet waar jullie dat in audiovisual misschien al niet zo over gehoord hebben.
0:11
S… Speaker 1 (Cc -2 19-10)
Een aantal frames na elkaar met kleine verschilletjes,
0:14
S… Speaker 1 (Cc -2 19-10)
waardoor als je die allemaal achter elkaar afspeelt,
0:16
S… Speaker 1 (Cc -2 19-10)
dat die lijken alsof als ze geanimeerd dat dat een vloeiende
0:20
S… Speaker 1 (Cc -2 19-10)
animatie is.
0:21
S… Speaker 1 (Cc -2 19-10)
Weet je iemand hoe dat zo 'n ding noemt?
0:22
S… Speaker 3 (Cc -2 19-10)
Zo 'n silicon?
0:24
S… Speaker 1 (Cc -2 19-10)
Hebben jullie dat gezien?
0:28
S… Speaker 1 (Cc -2 19-10)
Ja, en zo 'n trope is dat.
0:30
S… Speaker 1 (Cc -2 19-10)
En dat kun je eigenlijk gewoon als een van de eerste animatiefilmpjes dat er bestond.
0:34
S… Speaker 1 (Cc -2 19-10)
We gaan eigenlijk gewoon door gaatjes gaan kijken die elkaar afwisselden.
0:38
S… Speaker 1 (Cc -2 19-10)
En zo zagen we verschillende frames op iets aan rond draaien.
0:41
S… Speaker 4 (Cc -2 19-10)
Oké,
0:42
S… Speaker 1 (Cc -2 19-10)
en dat ziet er ook weer zo uit dat je kunt door één gaatje gaan kijken.
0:46
S… Speaker 5 (Cc -2 19-10)
Nu,
0:47
S… Speaker 6 (Cc -2 19-10)
we wilden eigenlijk over verschillende frames heen.
0:52
S… Speaker 1 (Cc -2 19-10)
lichte wijzigingen hebben in hetgeen dat we zien,
0:55
S… Speaker 1 (Cc -2 19-10)
frame per frame.
0:56
S… Speaker 1 (Cc -2 19-10)
En even een schil uitleggen tussen een statisch en een actief programmaatje,
1:00
S… Speaker 1 (Cc -2 19-10)
zal het nu toe altijd statische programmaatjes geven.
1:02
S… Speaker 1 (Cc -2 19-10)
Dat wil zeggen,
1:03
S… Speaker 1 (Cc -2 19-10)
in dit geval,
1:04
S… Speaker 1 (Cc -2 19-10)
we hebben hier twee functies.
1:05
S… Speaker 1 (Cc -2 19-10)
We hebben hier twee functies,
1:10
S… Speaker 1 (Cc -2 19-10)
die worden opgeroepen,
1:11
S… Speaker 6 (Cc -2 19-10)
één voor één.
1:12
S… Speaker 1 (Cc -2 19-10)
Als die opgeroepen zijn,
1:14
S… Speaker 1 (Cc -2 19-10)
gaat het programmaatje gedaan zijn en hebben we meestal een statische tekening op ons schijn staan.
1:18
S… Speaker 1 (Cc -2 19-10)
Vanaf nu gaan we ook dynamische of actieve scriptjes
1:23
S… Speaker 7 (Cc -2 19-10)
kunnen gaan maken.
1:26
S… Speaker 1 (Cc -2 19-10)
En dat gaan we doen aan de hand van een draw loop.
1:29
S… Speaker 1 (Cc -2 19-10)
Dat is eigenlijk gewoon een magische functie,
1:31
S… Speaker 1 (Cc -2 19-10)
kunnen we dat noemen.
1:32
S… Speaker 1 (Cc -2 19-10)
Als je die function draw toevoegt,
1:34
S… Speaker 1 (Cc -2 19-10)
dat is eigenlijk een functie die je zelf gaat schrijven,
1:37
S… Speaker 1 (Cc -2 19-10)
maar die door P5 automatisch gaat gevonden worden,
1:41
S… Speaker 1 (Cc -2 19-10)
en 60 keer per seconde,
1:43
S… Speaker 1 (Cc -2 19-10)
normaal gezien,
1:43
S… Speaker 1 (Cc -2 19-10)
gaat opgeroepen worden.
1:45
S… Speaker 1 (Cc -2 19-10)
Dus vanaf dat we die function draw daarin zetten,
1:47
S… Speaker 1 (Cc -2 19-10)
wordt die 60 keer per seconde opgeroepen,
1:49
S… Speaker 1 (Cc -2 19-10)
of naar lang...
1:51
S… Speaker 1 (Cc -2 19-10)
Vanuit je refresh rate van je schermen kan dat ook meer zijn.
1:54
S… Speaker 1 (Cc -2 19-10)
Sommigen zetten dat op 160 Hz,
1:57
S… Speaker 1 (Cc -2 19-10)
sommigen zetten dat op 30 Hz,
1:58
S… Speaker 4 (Cc -2 19-10)
op 60 Hz.
1:59
S… Speaker 1 (Cc -2 19-10)
Naar gelang welke schermen je hebt,
2:00
S… Speaker 1 (Cc -2 19-10)
kan dat een beetje verschillen.
2:02
S… Speaker 1 (Cc -2 19-10)
Laten we het even doen.
2:04
S… Speaker 1 (Cc -2 19-10)
We gaan hier Function Draw inzetten.
2:08
S… Speaker 1 (Cc -2 19-10)
En ik ga hier
2:12
S… Speaker 1 (Cc -2 19-10)
Output zetten.
2:18
S… Speaker 1 (Cc -2 19-10)
En ik ga dan runnen.
2:19
S… Speaker 1 (Cc -2 19-10)
Dan ziet u hier onderaan de hele tijd,
2:22
S… Speaker 1 (Cc -2 19-10)
60 keer per seconde,
2:23
S… Speaker 1 (Cc -2 19-10)
de boodschap hallo verschijnen.
2:25
S… Speaker 1 (Cc -2 19-10)
Dus ik is nu eigenlijk de ganze tijd aan het loopen.
2:27
S… Speaker 1 (Cc -2 19-10)
Wat kan ik nu voor het gaan doen?
2:29
S… Speaker 1 (Cc -2 19-10)
Ik kan een globale variabele maken.
2:32
S… Speaker 1 (Cc -2 19-10)
LetCount is 0.
2:35
S… Speaker 1 (Cc -2 19-10)
Ik ga iedere loop count
2:39
S… Speaker 1 (Cc -2 19-10)
gaan afdrukken.
2:40
S… Speaker 1 (Cc -2 19-10)
Dus als ik dat nu zou saven,
2:42
S… Speaker 1 (Cc -2 19-10)
ziet u hier altijd 0 staan.
2:44
S… Speaker 1 (Cc -2 19-10)
Maar wat kan ik nu gaan doen?
2:45
S… Speaker 1 (Cc -2 19-10)
Ik kan binnen die functie,
2:46
S… Speaker 1 (Cc -2 19-10)
iedere drawloop opnieuw en opnieuw,
2:48
S… Speaker 1 (Cc -2 19-10)
bijvoorbeeld zeggen,
2:49
S… Speaker 1 (Cc -2 19-10)
COUNT++,
2:50
S… Speaker 1 (Cc -2 19-10)
die gaat bij de huurige waarde van COUNT eentje bijtellen,
2:54
S… Speaker 1 (Cc -2 19-10)
en dan zie je dat die gewoon blijft gaan optellen.
2:56
S… Speaker 1 (Cc -2 19-10)
Na 1 seconde zou er ongeveer 60 moeten zien staan,
2:59
S… Speaker 1 (Cc -2 19-10)
120 na 100 seconden,
3:01
S… Speaker 1 (Cc -2 19-10)
enzovoort.
3:03
S… Speaker 1 (Cc -2 19-10)
Nu, je hoeft daar niet per se zelf zo 'n globale variabele voor te
3:07
S… Speaker 1 (Cc -2 19-10)
maken, en dan telkens zelf op te tellen,
3:09
S… Speaker 1 (Cc -2 19-10)
want P5 die heeft al een variabele,
3:12
S… Speaker 1 (Cc -2 19-10)
net zoals we bijvoorbeeld die width en die height kunnen opvragen van P5,
3:16
S… Speaker 1 (Cc -2 19-10)
van hoe groot is mijn canvas,
3:17
S… Speaker 1 (Cc -2 19-10)
kan ik hier ook zeggen frame count,
3:19
S… Speaker 4 (Cc -2 19-10)
en dan gaat hij eigenlijk
3:24
S… Speaker 1 (Cc -2 19-10)
gewoon tonen aan welke frame dat we zitten sinds het begin van het programma.
3:27
S… Speaker 1 (Cc -2 19-10)
Dus vanaf dat ik play druk,
3:28
S… Speaker 1 (Cc -2 19-10)
gaat hij gewoon frames beginnen genereren,
3:30
S… Speaker 1 (Cc -2 19-10)
iedere keer die drawloop opnieuw en opnieuw uitzoeken.
3:32
S… Speaker 1 (Cc -2 19-10)
En dan zien we eigenlijk gewoon aan welke frame dat hij ondertussen zit,
3:35
S… Speaker 1 (Cc -2 19-10)
en die gaat oneindig blijven doorgaan,
3:38
S… Speaker 1 (Cc -2 19-10)
oftewel dat getalletje niet meer in onze computer past.
3:40
S… Speaker 1 (Cc -2 19-10)
Dus dat gaat wel heel erg langzijdig door.
3:43
S… Speaker 1 (Cc -2 19-10)
En nu hebben we eigenlijk een simpel drawloopje,
3:45
S… Speaker 1 (Cc -2 19-10)
waar we eender wat kunnen gaan inschrijven,
3:46
S… Speaker 1 (Cc -2 19-10)
gaan tekenen,
3:48
S… Speaker 1 (Cc -2 19-10)
en dan gaat iedere frame opnieuw en opnieuw getekend worden.
3:51
S… Speaker 1 (Cc -2 19-10)
Wat kan ik nu gaan doen?
3:53
S… Speaker 1 (Cc -2 19-10)
Bijvoorbeeld een cirkel tekenen.
4:00
S… Speaker 1 (Cc -2 19-10)
En ik ga die bijvoorbeeld op positie 50
4:05
S… Speaker 1 (Cc -2 19-10)
-50 zetten.
4:08
S… Speaker 1 (Cc -2 19-10)
En die mag 50 groot zijn.
4:10
S… Speaker 4 (Cc -2 19-10)
Oké.
4:13
S… Speaker 1 (Cc -2 19-10)
Nu krijgen we een zeer mooi geanimeerde cirkel die 60 keer per
4:17
S… Speaker 1 (Cc -2 19-10)
seconde getekend wordt,
4:18
S… Speaker 1 (Cc -2 19-10)
maar op dezelfde plaats.
4:19
S… Speaker 1 (Cc -2 19-10)
Dus die wordt handig op dezelfde plaats getekend.
4:21
S… Speaker 1 (Cc -2 19-10)
Wat kan ik bijvoorbeeld gaan doen?
4:22
S… Speaker 1 (Cc -2 19-10)
Ik ga die even op 0 zetten.
4:24
S… Speaker 1 (Cc -2 19-10)
Dan gaat die daar terechtkomen.
4:26
S… Speaker 1 (Cc -2 19-10)
En in de plaats van 0 ga ik nu framecount hier zetten.
4:32
S… Speaker 1 (Cc -2 19-10)
En gaat die eigenlijk geanimeerd worden van links naar rechts.
4:35
S… Speaker 1 (Cc -2 19-10)
Want wat gebeurt er?
4:36
S… Speaker 1 (Cc -2 19-10)
Even doorstappen.
4:38
S… Speaker 1 (Cc -2 19-10)
Iedere frame opnieuw
4:42
S… Speaker 4 (Cc -2 19-10)
en opnieuw.
4:43
S… Speaker 1 (Cc -2 19-10)
Gaat die eentje verder gaan.
4:45
S… Speaker 1 (Cc -2 19-10)
En ik ga ook even...
4:46
S… Speaker 1 (Cc -2 19-10)
Ga ik hier even output frame
4:50
S… Speaker 7 (Cc -2 19-10)
comment ook zetten.
4:51
S… Speaker 4 (Cc -2 19-10)
Voilà.
4:53
S… Speaker 4 (Cc -2 19-10)
Ik ga opnieuw beginnen.
4:55
S… Speaker 5 (Cc -2 19-10)
Oké.
4:59
S… Speaker 1 (Cc -2 19-10)
Dus we zien de eerste...
5:00
S… Speaker 1 (Cc -2 19-10)
frame, frame count is 1,
5:02
S… Speaker 1 (Cc -2 19-10)
hij wordt getekend,
5:03
S… Speaker 1 (Cc -2 19-10)
in de volgende frame wordt hij getekend,
5:06
S… Speaker 1 (Cc -2 19-10)
1 pixel verder,
5:07
S… Speaker 1 (Cc -2 19-10)
en ga gewoon die frame count variabele,
5:10
S… Speaker 1 (Cc -2 19-10)
die je daar telkens eentje omhoog ziet gaan per frame,
5:12
S… Speaker 1 (Cc -2 19-10)
gaat hij gebruiken als een x -positie om die cirkel van links naar rechts op
5:16
S… Speaker 3 (Cc -2 19-10)
te schrijven.
5:19
S… Speaker 1 (Cc -2 19-10)
Nu, ik wil eigenlijk een veel groter venstertje tekenen dan dit,
5:22
S… Speaker 1 (Cc -2 19-10)
dat is maar 100 op 100 breed standaard.
5:24
S… Speaker 1 (Cc -2 19-10)
Dus ik moet Create Canvas aanroepen met een bepaalde breedte
5:29
S… Speaker 1 (Cc -2 19-10)
en hoogte.
5:29
S… Speaker 1 (Cc -2 19-10)
Dus Create Canvas,
5:31
S… Speaker 4 (Cc -2 19-10)
bijvoorbeeld 600.
5:36
S… Speaker 4 (Cc -2 19-10)
En
5:45
S… Speaker 1 (Cc -2 19-10)
hij gaat eigenlijk de eerste dag gaan uitvoeren en dan begint hij aan die draw -rope.
5:50
S… Speaker 1 (Cc -2 19-10)
Eigenlijk vanaf nu,
5:51
S… Speaker 1 (Cc -2 19-10)
als je zo 'n draw loop maakt,
5:53
S… Speaker 1 (Cc -2 19-10)
willen we eigenlijk ook nog een andere functie sowieso maken,
5:57
S… Speaker 1 (Cc -2 19-10)
die gewoon aan het begin van het programma één keer uitgevoerd wordt.
5:59
S… Speaker 1 (Cc -2 19-10)
Dan gaan we een heel duidelijk onderscheid maken.
6:01
S… Speaker 1 (Cc -2 19-10)
Dit gebeurt één keer.
6:03
S… Speaker 1 (Cc -2 19-10)
En vanaf dan gaat je de draw loop constant gaan uitvoeren.
6:07
S… Speaker 1 (Cc -2 19-10)
En dan hebben we de setup functie.
6:08
S… Speaker 1 (Cc -2 19-10)
Function Setup.
6:11
S… Speaker 1 (Cc -2 19-10)
En die wordt ook magisch,
6:13
S… Speaker 1 (Cc -2 19-10)
helemaal automatisch,
6:14
S… Speaker 1 (Cc -2 19-10)
aan het begin van mijn programma één keer opgeroepen.
6:17
S… Speaker 1 (Cc -2 19-10)
Vanaf daarna wordt de draw altijd opgeroepen.
6:20
S… Speaker 1 (Cc -2 19-10)
En daarin ga ik alles van het setup van mijn scriptje gaan doen.
6:24
S… Speaker 1 (Cc -2 19-10)
Bijvoorbeeld de canvas een bepaalde grote geven.
6:27
S… Speaker 1 (Cc -2 19-10)
Create canvas.
6:29
S… Speaker 4 (Cc -2 19-10)
Zeg maar op 400.
6:33
S… Speaker 1 (Cc -2 19-10)
Ik ga bijvoorbeeld een background kleurtje geven.
6:36
S… Speaker 1 (Cc -2 19-10)
Ik ga ook bijvoorbeeld mijn color mode hier al
6:40
S… Speaker 1 (Cc -2 19-10)
in instellen.
6:40
S… Speaker 1 (Cc -2 19-10)
Dus eigenlijk alles wat er maar één keer moet gebeuren.
6:42
S… Speaker 1 (Cc -2 19-10)
Color mode instellen ga ik bijvoorbeeld niet iedere drawer op opnieuw en opnieuw
6:46
S… Speaker 1 (Cc -2 19-10)
doen. Want dat is niet nodig.
6:47
S… Speaker 1 (Cc -2 19-10)
Vanaf dat ik dat één keer ingesteld heb,
6:49
S… Speaker 1 (Cc -2 19-10)
gaat dat gelden voor de rest van het programma.
6:51
S… Speaker 1 (Cc -2 19-10)
Dus dat doe ik in de setup.
6:52
S… Speaker 1 (Cc -2 19-10)
Color mode HSL,
6:53
S… Speaker 1 (Cc -2 19-10)
dan ga ik hier voor de background wat licht blauw
6:58
S… Speaker 4 (Cc -2 19-10)
doen, zoiets.
7:01
S… Speaker 1 (Cc -2 19-10)
En daarna begin ik een intramatje te tekenen.
7:05
S… Speaker 1 (Cc -2 19-10)
Nu, je ziet met een cirkel iedere frame met 1 pixel opschuiven,
7:09
S… Speaker 1 (Cc -2 19-10)
want die frame count niet altijd omhoog.
7:10
S… Speaker 1 (Cc -2 19-10)
Dus iedere frame,
7:12
S… Speaker 1 (Cc -2 19-10)
net zoals met een loop,
7:12
S… Speaker 1 (Cc -2 19-10)
ga ik die cirkel de volgende frame eentje verder tekenen.
7:16
S… Speaker 1 (Cc -2 19-10)
Dus altijd 1 pixel verder.
7:17
S… Speaker 1 (Cc -2 19-10)
Maar je ziet hier wel zo 'n streep verschijnen.
7:20
S… Speaker 1 (Cc -2 19-10)
En dat komt omdat ik gewoon altijd bovenop mijn huidige canvas aan het verder tekenen ben.
7:23
S… Speaker 1 (Cc -2 19-10)
Dus ik teken mijn cirkel,
7:25
S… Speaker 1 (Cc -2 19-10)
daarna één pixel verder.
7:26
S… Speaker 1 (Cc -2 19-10)
Maar je ziet natuurlijk zo 'n streep,
7:28
S… Speaker 1 (Cc -2 19-10)
omdat die rand van die cirkel blijft staan.
7:30
S… Speaker 1 (Cc -2 19-10)
Ik zou natuurlijk kunnen zeggen,
7:31
S… Speaker 1 (Cc -2 19-10)
ik ga hier netjes no stroke doen.
7:33
S… Speaker 4 (Cc -2 19-10)
Oké,
7:35
S… Speaker 1 (Cc -2 19-10)
dan heb ik al geen rand van mijn cirkel niet meer.
7:37
S… Speaker 1 (Cc -2 19-10)
Maar al mijn vorige cirkels staan daar nog,
7:39
S… Speaker 1 (Cc -2 19-10)
dus ik blijf gewoon verder tekenen.
7:40
S… Speaker 1 (Cc -2 19-10)
Net hetzelfde zoals we een voorloop zouden tekenen.
7:43
S… Speaker 1 (Cc -2 19-10)
Maar nu over de tijd heen,
7:45
S… Speaker 1 (Cc -2 19-10)
in plaats van alles in één keer naar elkaar.
7:48
S… Speaker 1 (Cc -2 19-10)
Goed, wat kan ik nu eigenlijk eenvoudig weg gaan doen om een bewegende cirkel
7:52
S… Speaker 1 (Cc -2 19-10)
te krijgen die geen streep nalaat?
7:54
S… Speaker 1 (Cc -2 19-10)
Heb je iemand idee dat ik dat zou kunnen aanpakken?
7:56
S… Speaker 5 (Cc -2 19-10)
We moeten
8:04
S… Speaker 1 (Cc -2 19-10)
op een of andere manier die vorige cirkel gaan wissen.
8:06
S… Speaker 1 (Cc -2 19-10)
Je zou kunnen zeggen,
8:08
S… Speaker 1 (Cc -2 19-10)
ik teken een vakje over die vorige cirkel,
8:10
S… Speaker 1 (Cc -2 19-10)
maar eigenlijk eenvoudiger is,
8:12
S… Speaker 1 (Cc -2 19-10)
gewoon aan het begin van iedere frame,
8:15
S… Speaker 1 (Cc -2 19-10)
mijn background instellen.
8:17
S… Speaker 1 (Cc -2 19-10)
En background is eigenlijk niet heel letterlijk background,
8:20
S… Speaker 1 (Cc -2 19-10)
dat is gewoon een rectangle die getekend wordt over de breedte van mijn scherm.
8:23
S… Speaker 1 (Cc -2 19-10)
Dus als ik hier het begin van iedere frame ga resetten,
8:28
S… Speaker 1 (Cc -2 19-10)
eigenlijk background gaat gewoon alles in dat kleur gaan wissen,
8:30
S… Speaker 1 (Cc -2 19-10)
dan krijg ik daar bovenop iedere keer een nieuwe circle.
8:33
S… Speaker 1 (Cc -2 19-10)
Die background is eigenlijk net hetzelfde als rect,
8:36
S… Speaker 1 (Cc -2 19-10)
oh sorry,
8:38
S… Speaker 1 (Cc -2 19-10)
fill, en dan rect,
8:42
S… Speaker 4 (Cc -2 19-10)
nul nul,
8:43
S… Speaker 1 (Cc -2 19-10)
width en height.
8:49
S… Speaker 1 (Cc -2 19-10)
doet eigenlijk eigenlijk hetzelfde.
8:51
S… Speaker 1 (Cc -2 19-10)
Ik moet natuurlijk wel een anonieme fill doen voor mijn cirkel dan.
8:54
S… Speaker 4 (Cc -2 19-10)
Oké.
8:59
S… Speaker 1 (Cc -2 19-10)
En als ik dat stap voor stap zou uitvoeren,
9:01
S… Speaker 1 (Cc -2 19-10)
mijn canvas wordt gemaakt,
9:03
S… Speaker 1 (Cc -2 19-10)
column mode op hsl,
9:04
S… Speaker 6 (Cc -2 19-10)
no stroke.
9:06
S… Speaker 1 (Cc -2 19-10)
Daarna komt het de eerste keer in die drawloop,
9:08
S… Speaker 1 (Cc -2 19-10)
ik zal hem fillen en ik teken een rectangle over de breedte en hoogte van mijn canvas.
9:12
S… Speaker 1 (Cc -2 19-10)
Ik doe een fill wide,
9:14
S… Speaker 1 (Cc -2 19-10)
ik teken die cirkel op die plaats en de volgende loop start.
9:17
S… Speaker 1 (Cc -2 19-10)
Ik wis alles door die rectangle opnieuw te tekenen.
9:22
S… Speaker 1 (Cc -2 19-10)
Ik doe een fill en light,
9:24
S… Speaker 1 (Cc -2 19-10)
maar die frame count is ondertussen eentje hoger geworden.
9:26
S… Speaker 1 (Cc -2 19-10)
Dus ik sta nu op wersel 1.
9:27
S… Speaker 1 (Cc -2 19-10)
En zo ga ik eigenlijk iedere keer wisselen.
9:31
S… Speaker 1 (Cc -2 19-10)
Die frame count gaat eentje omhoog.
9:34
S… Speaker 1 (Cc -2 19-10)
Ik teken die cirkel op x -proces frame count.
9:37
S… Speaker 1 (Cc -2 19-10)
Dus op 2, op 3,
9:38
S… Speaker 1 (Cc -2 19-10)
op 4, op 5.
9:39
S… Speaker 1 (Cc -2 19-10)
En zo ga ik die cirkel telkens gaan opschuiven.
9:42
S… Speaker 1 (Cc -2 19-10)
En dan zie je die stap voor stap opnieuw en opnieuw
9:46
S… Speaker 1 (Cc -2 19-10)
getekend worden.
9:46
S… Speaker 1 (Cc -2 19-10)
Wat moet ik doen als ik die cirkel sneller
9:50
S… Speaker 2 (Cc -2 19-10)
wil laten bewegen?
9:54
S… Speaker 1 (Cc -2 19-10)
Je beweegt die per frame 1 pixel,
9:56
S… Speaker 1 (Cc -2 19-10)
dus na 1 seconde gaat die...
10:03
S… Speaker 1 (Cc -2 19-10)
Hier zie je trouwens ook bovenaan een
10:08
S… Speaker 1 (Cc -2 19-10)
icoontje staan,
10:09
S… Speaker 4 (Cc -2 19-10)
FPS,
10:10
S… Speaker 1 (Cc -2 19-10)
en dan kun je zien hoeveel frames per seconde dat er gaat.
10:14
S… Speaker 1 (Cc -2 19-10)
Nu, op sommige computers kan dat hoger zijn,
10:17
S… Speaker 1 (Cc -2 19-10)
of naargelang je refresh rate van je schijn.
10:19
S… Speaker 4 (Cc -2 19-10)
En ook,
10:20
S… Speaker 1 (Cc -2 19-10)
hoe meer dat er gaande is op je schijn,
10:21
S… Speaker 1 (Cc -2 19-10)
als je heel complexe tekeningen aan het maken bent,
10:23
S… Speaker 1 (Cc -2 19-10)
iedere frame opnieuw,
10:25
S… Speaker 1 (Cc -2 19-10)
gaat die frame rate naar beneden gaan.
10:26
S… Speaker 1 (Cc -2 19-10)
Dat is iets wat je bij gamers ook heel vaak ziet,
10:28
S… Speaker 1 (Cc -2 19-10)
als er van alles gebeurt en je computer is net niet krachtig genoeg,
10:31
S… Speaker 1 (Cc -2 19-10)
zie je de frame rate,
10:32
S… Speaker 1 (Cc -2 19-10)
de FPS, naar beneden gaan.
10:33
S… Speaker 1 (Cc -2 19-10)
En dat is puur daardoor omdat er iedere frame heel veel werk moet doen.
10:37
S… Speaker 1 (Cc -2 19-10)
En als je dat niet op tijd gedaan krijgt,
10:39
S… Speaker 1 (Cc -2 19-10)
binnen 61 seconde,
10:41
S… Speaker 1 (Cc -2 19-10)
dan gaat die frame wat langer duren,
10:43
S… Speaker 1 (Cc -2 19-10)
waardoor je minder frames per seconde haalt.
10:45
S… Speaker 1 (Cc -2 19-10)
En je ziet dat het ook niet altijd exact gelijk is.
10:49
S… Speaker 1 (Cc -2 19-10)
Er gaat een klein beetje verschil op zitten tussen frames hierheen.
10:51
S… Speaker 1 (Cc -2 19-10)
De ene frame gaat wat langer duren dan de andere.
10:54
S… Speaker 1 (Cc -2 19-10)
Maar dat gaat altijd rond de 60's zijn.
10:57
S… Speaker 1 (Cc -2 19-10)
Dus nu hebben we eigenlijk al een bewegend
11:01
S… Speaker 1 (Cc -2 19-10)
cirkeltje kunnen tekenen.
11:02
S… Speaker 1 (Cc -2 19-10)
Even terugkeren.
11:03
S… Speaker 1 (Cc -2 19-10)
En dan gaat dus telkens
11:08
S… Speaker 1 (Cc -2 19-10)
opnieuw en opnieuw herhaald worden.
11:11
S… Speaker 5 (Cc -2 19-10)
Enzovoort.
11:12
S… Speaker 5 (Cc -2 19-10)
Goed,
11:13
S… Speaker 1 (Cc -2 19-10)
dus, zoals ik heb juist verteld,
11:15
S… Speaker 1 (Cc -2 19-10)
de eerste setup -functie wordt automatisch opgeroepen aan het begin
11:19
S… Speaker 1 (Cc -2 19-10)
van dit programma.
11:20
S… Speaker 1 (Cc -2 19-10)
Na die setup -functie gaan we opnieuw en opnieuw die browser gaan
11:24
S… Speaker 4 (Cc -2 19-10)
uitvoeren.
11:25
S… Speaker 6 (Cc -2 19-10)
De frame -count variabele,
11:30
S… Speaker 1 (Cc -2 19-10)
hoewel dat duidelijk is,
11:31
S… Speaker 1 (Cc -2 19-10)
die start bij 0 en gaat dus ieder frame -ange omhoog gaan.
11:36
S… Speaker 1 (Cc -2 19-10)
Maar we kunnen ook andere functies gaan oproepen als we willen.
11:39
S… Speaker 1 (Cc -2 19-10)
Stel dat we iets met de tijd willen gaan doen,
11:41
S… Speaker 1 (Cc -2 19-10)
dan kunnen we de millies functie oproepen.
11:43
S… Speaker 1 (Cc -2 19-10)
En die geeft ons de tijd die gepasseerd is sinds het begin van
11:47
S… Speaker 1 (Cc -2 19-10)
de startweer.
11:48
S… Speaker 1 (Cc -2 19-10)
Dus je gaat hier gewoon een tellertje van tijd bijhouden,
11:50
S… Speaker 1 (Cc -2 19-10)
een soort van chronometer.
11:52
S… Speaker 1 (Cc -2 19-10)
En als ik wil weten hoeveel tijd er al gepasseerd is,
11:54
S… Speaker 1 (Cc -2 19-10)
kan ik millies oproepen.
11:56
S… Speaker 1 (Cc -2 19-10)
Dus dat wil zeggen als ik hier bijvoorbeeld in de plaats millies oproep,
12:00
S… Speaker 1 (Cc -2 19-10)
dan zou je hier...
12:03
S… Speaker 1 (Cc -2 19-10)
het aantal milliseconden moeten zien verschijnen.
12:05
S… Speaker 1 (Cc -2 19-10)
Dat wil zeggen 1000 is 1 seconde.
12:08
S… Speaker 1 (Cc -2 19-10)
Waarom is dat later
12:12
S… Speaker 1 (Cc -2 19-10)
handig als je animaties wilt gaan maken?
12:15
S… Speaker 1 (Cc -2 19-10)
en je doet dat gewoon per frame,
12:16
S… Speaker 1 (Cc -2 19-10)
en er gebeurt heel veel op je scherm,
12:18
S… Speaker 1 (Cc -2 19-10)
en die frames gaan naar beneden,
12:19
S… Speaker 1 (Cc -2 19-10)
dan gaan die animatie soms langer duren om een bepaald punt te
12:23
S… Speaker 1 (Cc -2 19-10)
bereiken, en dan op een andere moment te korter duren.
12:25
S… Speaker 1 (Cc -2 19-10)
Dus als je dat over de tijd heen wil spreiden,
12:27
S… Speaker 1 (Cc -2 19-10)
dan ga ik een beetje logica moeten maken die berekening op de tijd in plaats
12:31
S… Speaker 1 (Cc -2 19-10)
van het aantal frames.
12:32
S… Speaker 1 (Cc -2 19-10)
Omdat ik nooit zeker weet hoeveel frames er gaan gepanceerd zijn.
12:36
S… Speaker 1 (Cc -2 19-10)
Het is ook een truc die heel veel in games en in animaties gebruikt wordt.
12:38
S… Speaker 1 (Cc -2 19-10)
We gaan die milliseconden gebruiken om dan eigenlijk vloeiende animaties
12:43
S… Speaker 4 (Cc -2 19-10)
te gaan maken.
12:46
S… Speaker 2 (Cc -2 19-10)
Delta Time,
12:47
S… Speaker 1 (Cc -2 19-10)
dat gaan we nu nog niet zoveel gebruiken,
12:49
S… Speaker 1 (Cc -2 19-10)
maar zeker als je naar interactieve 3D applicaties
12:53
S… Speaker 1 (Cc -2 19-10)
of games gaat.
12:53
S… Speaker 1 (Cc -2 19-10)
Dat wordt iets dat heel vaak gebruikt wordt.
12:55
S… Speaker 1 (Cc -2 19-10)
En Delta Time geeft mij de tijd terug tussen de huidige frame en de vorige frame.
12:59
S… Speaker 1 (Cc -2 19-10)
Dus je weet eigenlijk ook het verschil daartussen.
13:01
S… Speaker 1 (Cc -2 19-10)
Dat gaat normaal gezien 1 zestigste van een seconde zijn,
13:03
S… Speaker 1 (Cc -2 19-10)
maar soms een beetje meer,
13:05
S… Speaker 1 (Cc -2 19-10)
soms een beetje minder.
13:05
S… Speaker 1 (Cc -2 19-10)
En daarmee,
13:06
S… Speaker 1 (Cc -2 19-10)
met die functie, kunnen we dat eigenlijk gaan oproepen.
13:08
S… Speaker 1 (Cc -2 19-10)
Dus als ik dat hier ga tonen,
13:10
S… Speaker 1 (Cc -2 19-10)
dan ga je zien als ik Delta Time oproep.
13:15
S… Speaker 1 (Cc -2 19-10)
Oeh, delta,
13:16
S… Speaker 1 (Cc -2 19-10)
is dat een function?
13:18
S… Speaker 4 (Cc -2 19-10)
Oké,
13:20
S… Speaker 4 (Cc -2 19-10)
dat is een variabele.
13:24
S… Speaker 4 (Cc -2 19-10)
Ja, het
13:29
S… Speaker 1 (Cc -2 19-10)
is een variabele.
13:30
S… Speaker 1 (Cc -2 19-10)
Dus delta time geeft mij hier altijd 16 milliseconden terug.
13:34
S… Speaker 1 (Cc -2 19-10)
Dus normaal gezien 61,
13:38
S… Speaker 4 (Cc -2 19-10)
klopt.
13:39
S… Speaker 4 (Cc -2 19-10)
Ja,
13:42
S… Speaker 1 (Cc -2 19-10)
dus iets meer dan 60 per seconde.
13:45
S… Speaker 1 (Cc -2 19-10)
We gaan dat later wel zien waarom we
13:49
S… Speaker 1 (Cc -2 19-10)
dat kunnen gebruiken.
13:50
S… Speaker 1 (Cc -2 19-10)
Maar stel bijvoorbeeld dat je het aantal 5 per seconde wilt gaan berekenen.
13:53
S… Speaker 1 (Cc -2 19-10)
Dan kun je dat voor het gaan doen door gaan
13:57
S… Speaker 1 (Cc -2 19-10)
kijken. 1 seconde.
13:59
S… Speaker 1 (Cc -2 19-10)
gedeeld door de delta time.
14:00
S… Speaker 1 (Cc -2 19-10)
Dus hoeveel tijd is er gepasseerd met deze frame.
14:03
S… Speaker 1 (Cc -2 19-10)
Als we 1 seconde delen door dat getallen,
14:04
S… Speaker 1 (Cc -2 19-10)
dan krijgen we het aantal frames dat in 1 seconde past.
14:07
S… Speaker 1 (Cc -2 19-10)
En dat ga ik gewoon even kopiëren en
14:11
S… Speaker 1 (Cc -2 19-10)
tonen wat dat doet.
14:12
S… Speaker 5 (Cc -2 19-10)
Zo.
14:15
S… Speaker 1 (Cc -2 19-10)
En dan zie je hier frames per
14:19
S… Speaker 1 (Cc -2 19-10)
seconde, 60.
14:20
S… Speaker 1 (Cc -2 19-10)
Afgrond.
14:21
S… Speaker 1 (Cc -2 19-10)
Ik ga gaan afronden.
14:23
S… Speaker 1 (Cc -2 19-10)
En de ene keer gaat dat 61 zijn,
14:25
S… Speaker 1 (Cc -2 19-10)
de andere keer gaat dat 59 zijn,
14:26
S… Speaker 1 (Cc -2 19-10)
maar meestal gaat dat die 60 proberen bereiken.
14:37
S… Speaker 1 (Cc -2 19-10)
En wat is er nu ook handig?
14:39
S… Speaker 1 (Cc -2 19-10)
We kunnen eigenlijk ook allerlei globale variabelen gaan gebruiken.
14:42
S… Speaker 1 (Cc -2 19-10)
Eentje hebben we al gezien,
14:43
S… Speaker 6 (Cc -2 19-10)
die frame count,
14:44
S… Speaker 1 (Cc -2 19-10)
die wordt automatisch ingevuld.
14:46
S… Speaker 1 (Cc -2 19-10)
Maar ook de x -position en de y -position van mijn muisschipsel.
14:49
S… Speaker 1 (Cc -2 19-10)
En dan begint het eigenlijk interessant te worden.
14:52
S… Speaker 1 (Cc -2 19-10)
Dan kunnen we het heel interactief gaan maken.
14:54
S… Speaker 1 (Cc -2 19-10)
In plaats van dat ik die cirkel van daar juist gewoon van links
14:58
S… Speaker 1 (Cc -2 19-10)
naar rechts laat bewegen,
15:00
S… Speaker 4 (Cc -2 19-10)
Ga ik,
15:01
S… Speaker 1 (Cc -2 19-10)
voor de x -positie van die cirkel,
15:04
S… Speaker 1 (Cc -2 19-10)
mijn muispositie gaan gebruiken.
15:06
S… Speaker 1 (Cc -2 19-10)
En de A
15:12
S… Speaker 1 (Cc -2 19-10)
-positie van mijn muis,
15:13
S… Speaker 4 (Cc -2 19-10)
not defined,
15:18
S… Speaker 1 (Cc -2 19-10)
dat veranderd,
15:18
S… Speaker 1 (Cc -2 19-10)
dat valt niet.
15:19
S… Speaker 1 (Cc -2 19-10)
Even kijken in de documentatie.
15:22
S… Speaker 1 (Cc -2 19-10)
Ik denk dat ik de verkeerde naam heb.
15:25
S… Speaker 1 (Cc -2 19-10)
Het zal mouse -x zijn denk ik.
15:27
S… Speaker 4 (Cc -2 19-10)
Mouse, ja,
15:28
S… Speaker 4 (Cc -2 19-10)
sorry.
15:28
S… Speaker 4 (Cc -2 19-10)
Volg je de slides.
15:30
S… Speaker 1 (Cc -2 19-10)
Mouse X en mouse Y,
15:32
S… Speaker 1 (Cc -2 19-10)
die bevat gewoon sowieso de plaats van mijn cursor.
15:35
S… Speaker 1 (Cc -2 19-10)
Dus wat kan ik doen?
15:37
S… Speaker 1 (Cc -2 19-10)
Ik kan ieder frame mijn mouse cursor bewegen,
15:40
S… Speaker 1 (Cc -2 19-10)
en ik ga alles gaan wissen,
15:42
S… Speaker 1 (Cc -2 19-10)
en dat op de plaats van mijn mouse cursor,
15:44
S… Speaker 1 (Cc -2 19-10)
ga ik die cirkel gaan tekenen.
15:47
S… Speaker 1 (Cc -2 19-10)
Dus nu heb ik eigenlijk een interactieve cirkel,
15:48
S… Speaker 1 (Cc -2 19-10)
die automatisch mijn mouse gaat volgen.
15:51
S… Speaker 1 (Cc -2 19-10)
Je kunt dat woord ook direct weg doen,
15:54
S… Speaker 1 (Cc -2 19-10)
en dan krijg je eigenlijk een heel eenvoudig tekenprogrammaatje.
15:57
S… Speaker 1 (Cc -2 19-10)
Zodat tof ik zou kunnen zeggen,
15:59
S… Speaker 1 (Cc -2 19-10)
ik ga de kleur van mijn cirkeltje laten
16:03
S… Speaker 1 (Cc -2 19-10)
veranderen over de tijd heen.
16:05
S… Speaker 1 (Cc -2 19-10)
Wat kan ik dan gaan doen?
16:06
S… Speaker 1 (Cc -2 19-10)
Ik kan die fill,
16:07
S… Speaker 1 (Cc -2 19-10)
in plaats van white,
16:09
S… Speaker 1 (Cc -2 19-10)
ga ik de hue laten variëren,
16:14
S… Speaker 1 (Cc -2 19-10)
frame count.
16:14
S… Speaker 1 (Cc -2 19-10)
Dus die gaat bij 0 beginnen en die gaat optellen tot 360
16:19
S… Speaker 1 (Cc -2 19-10)
en dan gewoon terug verder blijven die cirkel afgaan.
16:22
S… Speaker 6 (Cc -2 19-10)
Frame count,
16:23
S… Speaker 1 (Cc -2 19-10)
bijvoorbeeld zo.
16:24
S… Speaker 4 (Cc -2 19-10)
En
16:30
S… Speaker 1 (Cc -2 19-10)
dan zie je eigenlijk over de tijd heen,
16:32
S… Speaker 1 (Cc -2 19-10)
Gaat die constant verkleuren?
16:34
S… Speaker 1 (Cc -2 19-10)
Want die frame count verandert over alle frames telkens omhoog en
16:38
S… Speaker 1 (Cc -2 19-10)
omhoog en omhoog.
16:39
S… Speaker 1 (Cc -2 19-10)
Als je dat duidelijk wilt maken,
16:41
S… Speaker 1 (Cc -2 19-10)
zou je wel een variabele zelf kunnen maken.
16:44
S… Speaker 1 (Cc -2 19-10)
Let hue color is
16:49
S… Speaker 1 (Cc -2 19-10)
0. En dan hier hue color meegeven.
16:53
S… Speaker 1 (Cc -2 19-10)
Dan zie je die is nu altijd rood.
16:55
S… Speaker 1 (Cc -2 19-10)
Maar als ik iedere frame opnieuw hue color plus
17:00
S… Speaker 1 (Cc -2 19-10)
plus doe,
17:01
S… Speaker 1 (Cc -2 19-10)
gaat die telkens eentje omhoog gaan,
17:04
S… Speaker 1 (Cc -2 19-10)
iedere frame.
17:05
S… Speaker 1 (Cc -2 19-10)
En dat verandert hier,
17:06
S… Speaker 1 (Cc -2 19-10)
ook al kom ik er niet aan,
17:07
S… Speaker 1 (Cc -2 19-10)
je ziet die constant veranderen.
17:08
S… Speaker 1 (Cc -2 19-10)
Ieder frame gaat daar eentje omhoog.
17:10
S… Speaker 1 (Cc -2 19-10)
En dan kan ik daar eigenlijk mee gaan tekenen als ik wil.
17:13
S… Speaker 1 (Cc -2 19-10)
Maar zo kun je eigenlijk eender welke variabele,
17:18
S… Speaker 1 (Cc -2 19-10)
eender welke waarde,
17:19
S… Speaker 1 (Cc -2 19-10)
gaan animeren over de tijd heen dat je wilt.
17:21
S… Speaker 1 (Cc -2 19-10)
Als ik wil dat dat sneller van kleur verandert.
17:23
S… Speaker 1 (Cc -2 19-10)
Nu hier zie ik wel,
17:24
S… Speaker 1 (Cc -2 19-10)
maar als ik aan 360 zit,
17:26
S… Speaker 1 (Cc -2 19-10)
blijf ik rood hebben.
17:28
S… Speaker 1 (Cc -2 19-10)
Want dat gaat niet verder kunnen op die cirkel.
17:29
S… Speaker 1 (Cc -2 19-10)
En daar kunnen we eigenlijk iets handig doen.
17:31
S… Speaker 1 (Cc -2 19-10)
In plaats van...
17:33
S… Speaker 1 (Cc -2 19-10)
hue color te blijven gebruiken plus plus,
17:35
S… Speaker 1 (Cc -2 19-10)
kan ik vooruit gaan zeggen,
17:36
S… Speaker 1 (Cc -2 19-10)
als hue color gelijk is aan
17:40
S… Speaker 4 (Cc -2 19-10)
360,
17:41
S… Speaker 1 (Cc -2 19-10)
zet hue color dan op
17:46
S… Speaker 1 (Cc -2 19-10)
0. En zo hebben we eigenlijk ieder frame dat we gaan controleren,
17:51
S… Speaker 1 (Cc -2 19-10)
is die 0,
17:52
S… Speaker 1 (Cc -2 19-10)
is die 1,
17:53
S… Speaker 1 (Cc -2 19-10)
is die 2, is die 3,
17:54
S… Speaker 1 (Cc -2 19-10)
als die 360 is,
17:55
S… Speaker 1 (Cc -2 19-10)
zet ik die terug op 0,
17:56
S… Speaker 1 (Cc -2 19-10)
waardoor hij terug aan het begin begint,
17:57
S… Speaker 1 (Cc -2 19-10)
en dan gaat hij terug beginnen optellen.
17:59
S… Speaker 1 (Cc -2 19-10)
Dus dat is een mogelijkheid om te doen.
18:01
S… Speaker 1 (Cc -2 19-10)
Gewoon zelf een if statement schrijven,
18:03
S… Speaker 1 (Cc -2 19-10)
en dan die telkens gaan resetten.
18:05
S… Speaker 1 (Cc -2 19-10)
Of, wat kan je ook in principe doen,
18:08
S… Speaker 1 (Cc -2 19-10)
hier onze fill,
18:10
S… Speaker 4 (Cc -2 19-10)
nee,
18:12
S… Speaker 1 (Cc -2 19-10)
sorry, deze fill,
18:13
S… Speaker 1 (Cc -2 19-10)
uw color,
18:13
S… Speaker 1 (Cc -2 19-10)
modulo 360 doen.
18:15
S… Speaker 4 (Cc -2 19-10)
En dan gaat
18:19
S… Speaker 1 (Cc -2 19-10)
hij eigenlijk de reststelling pakken,
18:22
S… Speaker 1 (Cc -2 19-10)
dus alles tot 360 geeft het getalletje zelf,
18:24
S… Speaker 1 (Cc -2 19-10)
alles boven de 360 wordt dan telkens terug naar 0,
18:27
S… Speaker 1 (Cc -2 19-10)
1, 2, 3,
18:28
S… Speaker 8 (Cc -2 19-10)
4, enzovoort gezet.
18:30
S… Speaker 1 (Cc -2 19-10)
Ik denk dat is een mogelijkheid,
18:31
S… Speaker 1 (Cc -2 19-10)
maar de andere oplossing is iets beter.
18:33
S… Speaker 1 (Cc -2 19-10)
Waarom?
18:33
S… Speaker 1 (Cc -2 19-10)
Omdat dit getalletje wel blijft stijgen.
18:36
S… Speaker 1 (Cc -2 19-10)
Terwijl als je het zelf gaat resetten en je hebt meer controle over,
18:40
S… Speaker 1 (Cc -2 19-10)
dat dat elke keer terug naar vol gaat.
18:41
S… Speaker 5 (Cc -2 19-10)
Dat
18:47
S… Speaker 1 (Cc -2 19-10)
va? Je zou ook kunnen zeggen,
18:48
S… Speaker 1 (Cc -2 19-10)
ik ga dat over de tijd heen bijvoorbeeld mijn size laten vergroten.
18:52
S… Speaker 1 (Cc -2 19-10)
Dus ik kan hier bijvoorbeeld zeggen frame count.
18:54
S… Speaker 1 (Cc -2 19-10)
En mijn cirkeltje wordt altijd maar groter en groter.
18:59
S… Speaker 1 (Cc -2 19-10)
Of je maakt daar terug een led size
19:03
S… Speaker 1 (Cc -2 19-10)
variante van.
19:05
S… Speaker 1 (Cc -2 19-10)
En size is...
19:06
S… Speaker 1 (Cc -2 19-10)
Ik ga beginnen bij 10.
19:07
S… Speaker 1 (Cc -2 19-10)
Ik geef hier size mee.
19:09
S… Speaker 1 (Cc -2 19-10)
En ik kan door iedere loop plus plus doen met
19:13
S… Speaker 1 (Cc -2 19-10)
die size.
19:16
S… Speaker 1 (Cc -2 19-10)
Als ik aan een bepaalde size kom,
19:19
S… Speaker 1 (Cc -2 19-10)
kan ik die terug gaan resetten als ik wil.
19:21
S… Speaker 1 (Cc -2 19-10)
Kan ik die terug kleiner laten worden.
19:23
S… Speaker 8 (Cc -2 19-10)
Enzovoort.
19:28
S… Speaker 1 (Cc -2 19-10)
We hebben gezien, dus als je wilt dat je canvas iedere frame gekleerd wordt,
19:32
S… Speaker 1 (Cc -2 19-10)
kun je background gebruiken of zelf een rectangle tekenen.
19:35
S… Speaker 1 (Cc -2 19-10)
Je kunt ook in principe deeltjes van je canvas gaan missen
19:39
S… Speaker 1 (Cc -2 19-10)
en andere deeltjes laten staan,
19:41
S… Speaker 8 (Cc -2 19-10)
in sommige gevallen.
19:41
S… Speaker 5 (Cc -2 19-10)
Goed.
19:44
S… Speaker 1 (Cc -2 19-10)
Maar nu gaan we ook een beetje interactie toevoegen.
19:47
S… Speaker 1 (Cc -2 19-10)
Dus we hebben al wat interactie door die x - en y -positie van de muis te gaan gebruiken.
19:51
S… Speaker 1 (Cc -2 19-10)
Maar we kunnen eigenlijk allerlei andere dingen aan doen.
19:53
S… Speaker 1 (Cc -2 19-10)
We kunnen ook gaan reageren op muiskliks,
19:56
S… Speaker 1 (Cc -2 19-10)
op mouse release,
19:57
S… Speaker 1 (Cc -2 19-10)
op muisbewegingen.
20:00
S… Speaker 1 (Cc -2 19-10)
op drags en op de muiswiel.
20:01
S… Speaker 1 (Cc -2 19-10)
Dus er zijn allemaal events,
20:03
S… Speaker 1 (Cc -2 19-10)
noemen we dat.
20:03
S… Speaker 1 (Cc -2 19-10)
Dingen die gebeuren waar wij op kunnen gaan reageren.
20:07
S… Speaker 1 (Cc -2 19-10)
En dat is eigenlijk vrij eenvoudig te doen,
20:09
S… Speaker 1 (Cc -2 19-10)
net zoals dat we de
20:14
S… Speaker 1 (Cc -2 19-10)
function setup en function draw kunnen toevoegen,
20:17
S… Speaker 1 (Cc -2 19-10)
en dat dat automatisch opgeroepen wordt met P5,
20:20
S… Speaker 1 (Cc -2 19-10)
kunnen we ook een mouse -clicked functie maken,
20:23
S… Speaker 1 (Cc -2 19-10)
en die wordt automatisch opgeroepen op het moment dat je klikt.
20:25
S… Speaker 1 (Cc -2 19-10)
Dus wat kan ik nu gaan doen?
20:27
S… Speaker 1 (Cc -2 19-10)
Je kan voor iets zeggen...
20:31
S… Speaker 1 (Cc -2 19-10)
En daarvoor heb ik zelf niet per se de function,
20:33
S… Speaker 1 (Cc -2 19-10)
de draw loop,
20:34
S… Speaker 1 (Cc -2 19-10)
nodig.

Hierdie transkripsie is deur K- enkrities spraakerkenning voortgebring. Kan foute bevat takies wat teen die oorspronklike oudio vir kritiese gebruik bevestig is. Kunsmatige inteligensie beleid

❤️ Love STT.ai? Vertel jou vriende!
Opsomming
Kliek opsomming na genereer 'n kunsmatige opsomming van hierdie transkripsie.
Ter opsomming...
Vra Kunsmatige inteligensie oor hierdie teks
Vra enigiets oor hierdie transkripsie 0°) die kunsmatige dele en antwoord.
Skryf nog'n inteken