D'ACCORD.
Nous saluons le retour.
Donc, comme je l'ai mentionné dans cette vidéo va effectivement commencer à travailler sur un clone d'attaque pour animaux de compagnie ici.
Donc, la première chose que nous voulons faire est de trouver comment ajouter un cercle que nous avons effectivement déjà vu, mais nous voulons faire quelques choses à un cercle lorsque l'utilisateur touche n'importe quelle touche en fait dans mon cas je le fais seulement Pour ses enfants.
Il fonctionne de la même manière pour toute autre clé.
Donc, quand un utilisateur frappe la clé à un cercle, puis nous avons également besoin de comprendre l'animation de ce cercle.
Et enfin, nous voulons ajouter ce cercle à une coordonnée aléatoire.
Donc, pour commencer, nous allons juste frapper une clé et ajouter un cercle au milieu de l'écran.
Donc allons-y au papier japes docs et jetez un oeil à l'interaction et regardez l'interaction du clavier.
Et je sais qu'il semble bien que je ne savais pas où chercher ici, mais la première fois que je suis venu ici, il m'a pris beaucoup plus de temps pour trouver que je viens de passer par la plupart de ces et recherché clavier essaient essentiellement de dire que très probablement Si je faisais cela de nouveau par moi-même et je n'avais pas préparé pour cette vidéo, il aurait pris moi beaucoup plus de temps pour trouver que je pourrais avoir fait une recherche de toute façon, c'est le défilement vers le bas et juste regarder certains des exemples.
Ce premier rapide ici pour se concentrer, puis appuyez sur certaines touches et il vous indique quelle touche a été pressé et quand il a été libéré ainsi.
Donc, en ce moment, je presse K et puis le libérer.
Et si vous regardez le code, il est vraiment facile juste sur la touche vers le bas et Anchia.
Il n'y a donc pas de document sur l'auditeur de l'événement il n'y a pas d'auditeurs Jay queery événement derrière les scènes il est documenté à l'écoute des événements se passe.
Mais pour le script papier, nous avons juste à écrire cette ligne super simple pour que nous puissions prendre en fait simplement copier cela fera la clé vers le bas pour notre application.
Nous voulons que le son joue immédiatement.
Alors que j'appuie sur la touche pas quand je suis sorti en pensant que c'est un peu plus lent, c'est comme un piano que lorsque vous frappez un piano ou le bruit, le son qui est généré est généré juste lorsque vous appuyez sur la touche ou juste après, pas quand Vous libérez.
Donc Will fermer.
J'ai copié cela et nous allons commencer par faire un nouveau cercle donc nous avons besoin de ce code.
Mais nous voulons juste un alors nous n'avons plus besoin des boucles.
Débarrassez-vous de cela et nous allons faire ce nouveau cercle sur clé vers le bas.
Donc, ce processus est assez réaliste où vous prenez des morceaux différents et vous êtes juste genre de les assembler ensemble.
Donc j'ai trouvé cela dans les documents sur la touche vers le bas.
Vous pouvez vous en débarrasser.
Et j'ai trouvé cela dans les documents aussi bien et nous avons besoin de changer ce X et Y ne sont pas définis.
Alors faisons-le à 100 virgule 100 et faisons Phil couleur orange.
Donc sur le bas exécuter ce code.
Et encore, c'est très différent de ce que nous avons vu ou nous avons documenté un auditeur d'événement.
Et puis nous devrions ajouter quelque élément.
Donc, nous devrions faire comme le document point de sélecteur de requête un élément comme un point div ajouter l'écouteur d'événement et puis nous aurions à lui dire cliquez ou appuyez sur les touches ou clé.
C'est beaucoup plus de code.
Ceci est fait pour nous avec Paperchase vraiment simple.
Alors, à la clé, voyons ce qui se passe.
Je vais appuyer sur la touche et nous finissons avec un cercle et chaque fois que j'appuie sur 1, je reçois un autre cercle.
Vous ne pouvez pas le voir.
Maintenant, nous allons travailler sur ceci afin que nous ajoutons un cercle à un endroit aléatoire sur l'écran.
Et la façon dont nous faisons cela m'a pris un peu de travail pour trouver que nous pourrions le faire nous-mêmes où nous générons deux nombres essentiellement de zéro jusqu'à la largeur maximale de notre écran, puis l'autre nombre de zéro jusqu'à Jusqu'à la hauteur maximale de notre écran.
Et ce n'est pas trop de travail, mais nous devons trouver la largeur et la hauteur et les dimensions que si vous allez à Paperchase et si nous regardons où vous faites référence.
Et puis quand c'est ouvert regardez en vue.
Et encore une fois, je viens de trouver cela il ya quelques jours, j'ai pris un peu.
Mais si nous vous regardons et nous regardons les limites et peut-être que c'est la taille de la zone visible et les coordonnées du projet.
Donc, si nous avons fait quelque chose comme consul que la taille de la vue du journal que je viens de trouver ici et rafraîchir la page et de voir ce que nous obtenons, nous obtenons la hauteur et la largeur de sorte que nous pouvons prendre cette hauteur et la largeur.
Donc, vous n'êtes pas la hauteur de point de taille et puis annuler que vous connecter que la taille commence avec et nous pourrions utiliser cette actualisation et je prosequi.
Actuellement la vue que la taille est six cent quatre-vingt-douze par sept cents.
Mais si je redimensionner, vous verrez que les changements la prochaine fois.
Persécuteurs.
Donc nous pouvons utiliser cela pour générer les deux points dont nous avons besoin.
Mais l'autre chose que nous pouvons faire est qu'il ya effectivement une méthode intégrée que j'ai trouvé qui va nous faire des points aléatoires, donc je vais vous montrer que aussi.
Donc plutôt que d'avoir à faire des mathématiques au hasard qui nous donne quelque chose entre 1 0 et 1 non inclusif et puis nous devons multiplier cela et le déplacer vers le haut ou vers le bas.
C'est une sorte de douleur.
Alors ce que nous allons faire à la place est d'utiliser ce joli papier J S chemin que j'ai trouvé ressemble à ceci.
Donc, je vais faire un maximum de points de sorte que le point maximum que nous pouvons ajouter un cercle à va être nouveau point de vue taille de point.
Et puis nous voulons avec une virgule que la hauteur de point de taille.
Alors x et y sont maximum X ou maximum y.
Donc, cela fait que nos points max et je vais vous montrer si nous faisons un constant alt log Max point là, nous allons et nous allons réellement ajouter notre cercle au point max.
Donc au lieu de faire un nouveau point ici à 100 Kamo 100, nous allons juste lui donner le point Max.
D'ACCORD.
Alors essayons-le maintenant et débarrassez-vous de ceux pour rafraîchir la page.
J'ai frappé une clé.
Voyons, on en a un ici en bas à droite.
Et si je redimensionner et de le faire à nouveau et j'ai frappé une clé, nous obtenons maintenant notre point maximum ici.
Donc c'est bien parce que comme cette fenêtre change comme la zone visible sur cette toile change nos changements de points maximum, nous ne sommes pas toujours générer un nombre aléatoire entre vous connaissez nos dimensions d'écran ou même la taille de la fenêtre parce que dès que la zone visible Ce n'est pas même la fenêtre entière mais seulement la zone visible sur la toile change nos changements de point maximum.
OK, nous avons cela.
Maintenant, ce que nous voulons faire est de prendre ce point maximum et nous allons générer un point aléatoire.
Donc, nous allons juste appeler le point aléatoire et il ya un point méthode point aléatoire et qui nous donnera un point aléatoire entre 0 et 1 non inclusif tout comme la mascotte Rande sauf avec une ligne.
Nous obtenons un objet point.
C'est donc essentiellement le cas.
De nouveaux points maths point aléatoire virgule mathématique aléatoire de point et alors nous voulons prendre que font une autre variable que nous appelerons juste le point et elle est égale à des points max points le point aléatoire juste comme cela.
Nous multiplions ces deux points ensemble.
C'est une sorte de calculs bizarres, mais nous sommes en train de générer un point entre 0 0 et 1 1 mais techniquement ce serait 9 9 9 9 et ainsi de suite.
Alors disons que nous générons un point comme point cinq point cinq, puis la prochaine chose que nous faisons est que nous avons notre point max qui sera toujours le maximum que nous pourrions faire.
Donc quelque chose comme 12 80 par 720 ou quelle que soit notre taille de fenêtre est de 600 par 300 et ensuite nous les multiplier ensemble et nous finissons avec un nouveau point qui est dans ce cas 300 virgule 150.
C'est ainsi que nous pouvons générer un maximum ou un point aléatoire qui existe sur la zone visible.
Sont-ils actuellement zone visible de la toile.
OK, maintenant, nous allons juste changer cela pour qu'il va à des points.
Jetons un coup d'oeil maintenant rafraîchir.
Frappez n'importe quelle touche et nous nous retrouvons avec des cercles aléatoires.
Chaque fois que vous appuyez sur une touche.
Oups.
Et si je redimensionne la fenêtre, faisons-la à mi-chemin.
Chaque fois que j'appuie sur la touche, nous la voyons toujours.
Donc ce n'est pas générer des points ici plus ce qui est agréable.
De sorte que si la fenêtre se produit pour redimensionner l'utilisateur n'a pas à rafraîchir pour obtenir une nouvelle zone visible pour obtenir une sorte de nombres calculés.
D'accord! Super.
C'est ainsi que nous générons un cercle que vous voyez déjà, mais c'est la façon dont nous générons un cercle lorsque l'utilisateur touche une touche n'importe quelle touche.
Et nous avons parlé de comment faire un point aléatoire dans la prochaine vidéo.
Nous allons voir comment nous pouvons faire des animations simples en changeant d'abord les couleurs de ces points et en les faisant fondre à différentes teintes de différentes couleurs.
Et puis aussi en les rétrécissant.
Donc, nous allons voir que la prochaine vidéo, puis nous allons revenir en arrière et ajouter dans le son.