OK.
Welkom terug.
Dus zoals ik in deze video genoemd ook daadwerkelijk gaan werken aan een huisdier aanval kloon hier.
Dus het eerste wat we willen doen is erachter te komen hoe je een cirkel, die we hebben eigenlijk al gezien toe te voegen, maar we willen een paar dingen te doen in een cirkel wanneer de gebruiker een toets raakt eigenlijk in mijn geval Ik doe het alleen voor haar kinderen.
Het werkt op dezelfde manier voor een andere toets.
Dus wanneer een gebruiker raakt de sleutel in een cirkel en dan moeten we ook te achterhalen van de animatie van die cirkel.
En tot slot willen we aan toevoegen dat cirkel naar een willekeurig te coördineren.
Dus om te beginnen we gewoon raakte een sleutel en voeg een cirkel naar het midden van het scherm.
Dus laten we naar het papier japes docs en neem een ​​kijkje op interactie en kijken naar het toetsenbord interactie.
En ik weet dat het lijkt alsof goed wist ik niet waar u hier kijken, maar de eerste keer dat ik hier kwam het kostte me een stuk langer te vinden dat ik ging gewoon door de meeste van deze en zocht naar het toetsenbord eigenlijk probeert te zeggen dat de meest waarschijnlijke als ik dit opnieuw deed door mezelf en ik was niet voorbereid op deze video zou hebben genomen me een stuk langer te vinden dat ik een onderzoek zou hebben gedaan in ieder geval zo dat de scroll naar beneden en kijk maar naar enkele van de voorbeelden.
Deze eerste één snelle hier om scherp te stellen en druk vervolgens op enkele toetsen en het vertelt je welke toets werd ingedrukt en wanneer het ook werd uitgebracht.
Dus nu ben ik te drukken K en vervolgens los te laten.
En als je kijkt naar de code het is echt gemakkelijk gewoon op de toets ingedrukt en Anchia up.
Dus het is niet dat er geen document op ten evenement luisteraar er geen Jay queery gebeurtenis luisteraars achter de schermen zijn er gedocumenteerd op event listeners gebeurt.
Maar voor papier script hoeven we alleen maar om deze super eenvoudige lijn te schrijven, zodat we kunnen nemen die eigenlijk alleen maar naar beneden te kopiëren zal dit doen sleutel voor onze app.
We willen dat het geluid meteen te spelen.
Dus als ik druk op de toets niet wanneer ik vrijgegeven denken dat is een beetje langzamer het is een beetje als een piano dat wanneer je een piano of het geluid het geluid dat wordt gegenereerd wordt direct gegenereerd wanneer u op de toets of rechts achteraf niet wanneer hit je loslaat.
Dus Zal ik doen toets ingedrukt.
Ik kopieerde dat en we beginnen door gewoon het maken van een nieuwe kring, zodat we deze code nodig.
Maar we willen gewoon een, zodat we niet de lussen meer nodig.
Te ontdoen van die en wij zullen die nieuwe cirkel op toets ingedrukt te maken.
Dus dit proces is vrij realistisch, waar je het nemen van verschillende stukken en u ze gewoon een soort bij elkaar passend.
Dus vond ik dit in de documentatie op de toets ingedrukt.
U kunt zich te ontdoen van dat.
En ik vond dit in de documentatie zo goed en we nodig hebben om dit te veranderen X en Y zijn niet gedefinieerd.
Dus laten we het gewoon doen op 100 komma 100 en laten we Phil kleur oranje.
Zo op run down deze Code.
En nogmaals, het is heel anders dan wat we hebben gezien of hebben we een event listener gedocumenteerd.
En dan zouden we moeten toe te voegen in een element.
Dus zouden we moeten doen als document dot-query selector een element zoals een div dot toe te voegen event listener en dan zouden we moeten zeggen dat het klikken of druk op de toets of omhoog.
Het is een stuk meer code.
Dit wordt gedaan voor ons met Paperchase heel eenvoudig.
Zo op toets ingedrukt laten we eens kijken wat er gebeurt.
Ik ga op de toets en we eindigen met een cirkel en elke keer als ik druk op 1 ik krijg een andere cirkel.
Je kan het gewoon niet zien.
Dus nu laten we werken aan dit, zodat we het toevoegen van een cirkel naar een willekeurige plaats op het scherm.
En de manier waarop we die eigenlijk kostte me een beetje werk te vinden dat we het zelf zouden kunnen doen waar we twee nummers te genereren in principe van nul helemaal tot aan de maximale breedte van ons scherm en dan de andere getal van nul tot tot de maximale hoogte van ons scherm.
En dat is niet te veel werk, maar we hebben te achterhalen van de breedte en hoogte en de afmetingen die als je naar Paperchase en als we kijken waar je referentie.
En als dat is open blik in het oog.
En nogmaals, ik heb net dit een paar dagen geleden nam ik een beetje.
Maar als we kijken naar je en we kijken naar de grenzen en of misschien is de grootte van de grootte van het zichtbare gebied en het project coördineert.
Dus als we zoiets consul deed dat log view grootte die ik weer gewoon hier te vinden en vernieuw de pagina om te zien wat we krijgen we hoogte en breedte, zodat we die hoogte en breedte kan nemen.
Dus je bent niet de grootte stip hoogte en vervolgens annuleert dat log je dat formaat te beginnen en we konden dat refresh gebruiken en ik prosequi.
Momenteel is de opvatting dat de grootte is 692 door zevenhonderd.
Maar als ik het formaat van dit zul je zien dat verandert de volgende keer.
Persecutee.
Dus we kunnen gebruiken om deze twee punten die we nodig hebben te genereren.
Maar de andere ding dat we kunnen doen is er eigenlijk een ingebouwde methode die ik vond dat zal ons een willekeurige punten, dus ik zal je laten zien dat ook.
Dus in plaats van om wiskunde te doen in willekeurige volgorde, die ons iets tussen 1 0 en 1 non-inclusive geeft en dan hebben we te vermenigvuldigen dat en verschuiving naar boven of naar beneden.
Het is een soort van een soort van pijn.
Dus wat we zullen doen in plaats daarvan is het gebruik maken van deze mooie papieren J S manier die ik vond ziet er als volgt.
Dus ik zal een maximale punten te maken, zodat het maximale punt dat we een cirkel kan toevoegen aan gaat naar nieuw punt view dot grootte.
En dan willen we met komma's die grootte dot hoogte.
Dus x en y maximale X of maximum y.
Dus dat maakt onze max punten en ik zal je laten zien als we een constante alt log Max punt daar gaan we en laten we eigenlijk onze kring toe te voegen aan max punt.
Dus in plaats van het maken van een nieuw punt hier bij 100 Kamo 100 we zullen gewoon geef het Max punt.
OK.
Dus laten we proberen dat nu uit en te ontdoen van die naar de pagina te vernieuwen.
Ik raakte een sleutel.
Zien we krijgen een recht naar beneden hier in de rechter benedenhoek.
En als ik het formaat en het opnieuw doen en ik raakte een sleutel krijgen we nu onze hoogste punt hier.
Dus dit is mooi, want als die venster verandert als het zichtbare gebied op dit doek verandert ons maximale punt verandert dus we zijn niet altijd het genereren van een willekeurig getal tussen jij ons scherm dimensies of zelfs het raam grootte want zodra het zichtbare gebied het is zelfs niet de hele raam, maar slechts het zichtbare gebied op het doek verandert ons maximale punt verandert.
OK dus hebben we dat.
Nu wat we willen doen is dat de maximale punt en we gaan naar een willekeurig punt te genereren.
Dus we noemen het willekeurig punt en er is een methode punt dot willekeurige en dat zal ons een willekeurig punt te geven tussen 0 en 1 non-inclusive net als mascotte Rande, behalve met één lijn.
We krijgen een punt object.
Dus het is eigenlijk om dit te doen.
Nieuwe punten math dot willekeurige komma wiskunde dot willekeurig en dan willen we nemen dat een andere variabele die we gewoon punt bel te maken en het is gelijk aan max wijst keer willekeurig punt, net als dat.
Dus we deze twee punten met elkaar te vermenigvuldigen.
Het is een soort van een heleboel rare wiskunde maar in principe zijn we het genereren van een punt tussen 0 0 en 1 1, maar technisch gezien zou zijn punt 9 9 9 9 en ga zo maar door.
Dus laten we zeggen dat we het genereren van een punt als uitgangspunt vijf komma vijf dan het volgende ding dat we doen is dat we onze max punt dat altijd de maximum dat we konden maken zal zijn.
Dus zoiets als 12 80 720 of wat ons raam grootte is 600 bij 300 en dan vermenigvuldigen we ze bij elkaar en we eindigen met een nieuw punt, dat is in dit geval 300 komma 150.
Dus dit is hoe we een max of een willekeurig punt dat bestaat op het zichtbare gebied kan genereren.
Zijn ze op dit moment zichtbare gedeelte van het doek.
OK dus nu laten we dit gewoon te veranderen, zodat het gaat om punten.
Laten we nu eens een kijkje nemen vernieuwen.
Hit een willekeurige toets en we eindigen met willekeurige cirkels.
Elke keer dat u een toets indrukt.
Whoops.
En als ik het formaat van het venster laten we het halverwege over.
Elke keer als ik druk op de toets we nog steeds zien.
Dus het is geen punten meer dan hier het genereren van meer wat leuk is.
Zodat als het venster gebeurt met de gebruiker formaat niet hoeft te vernieuwen nieuwe nieuwe zichtbare gebied naar soort berekende getallen.
Oke geweldig.
Dus dat is hoe we het genereren van een cirkel, die je al zien, maar het is hoe we het genereren van een cirkel, wanneer de gebruiker een toets een toets raakt.
En we spraken over hoe je een willekeurig punt te maken in de volgende video.
We zullen zien hoe we enkele eenvoudige animaties kunnen doen door eerst de kleuren van deze punten en het hebben van hen verdwijnen om verschillende tinten verschillende kleuren.
En dan ook nog door het krimpen ze naar beneden.
Dus we zullen zien dat de volgende video en dan gaan we terug te gaan en toe te voegen aan het geluid.