Así que estamos en buena forma aquí.
Lo que queremos hacer ahora es hacerlo de modo que no usemos los mismos seis colores cada vez.
En su lugar, queremos generar seis colores aleatorios y llenar esta matriz con esos seis colores aleatorios
y luego elegir uno para generar esos colores.
De hecho, voy a escribir otra función para ayudarnos.
Así que nuestra función Nener nuestra raza la matriz codificada y voy a establecer colores iguales a
nuestra llamada de función que llamaremos generar colores aleatorios y todavía no existe y va a tomar un único
argumento que decide cuántos colores para generar en la matriz.
Entonces, si queremos una matriz con tres elementos que querremos eventualmente cuando lleguemos al modo fácil
versus modo difícil, queremos 6.
Entonces comenzaremos con 6.
Eso es lo que queremos cuando se carga la página.
Luego tenemos que crear la función generar colores aleatorios que toma un número y devuelve un número X
de colores aleatorios en lugar de una matriz.
Así que lo haré aquí abajo.
función genera colores aleatorios y debería tomar el argumento de que simplemente llamaremos a entumecido y luego en lugar de aquí.
La
De acuerdo, mi pseudo código.
Así que voy a hacer una matriz.
Voy a agregar algunos colores aleatorios a la matriz y luego voy a devolver esa matriz al final.
Entonces, comenzar esta es la parte más fácil.
Haz una matriz simplemente vacía.
Así que lo llamaremos simplemente una matriz vacía y luego, en la parte inferior, devolveremos
la misma matriz.
La parte difícil es la lógica que está en el medio.
Entonces, aquí tenemos que agregar colores aleatorios conocidos.
Entonces, ¿qué significa eso? Necesitamos repetir algo saber varias veces.
Entonces seis o tres veces
Entonces usaremos un bucle para hacer eso.
Entonces comenzaremos con nuestro bucle de nuestro igual a cero.
Estoy menos entumecido I plus plus.
vamos a usar I, es solo una forma de recorrer tres veces seis veces Nahm veces.
Y no importa si comenzamos en cero o si comenzamos en 1 y hacemos esto igual o menor porque en
realidad no
Y luego aquí vamos a obtener el color aleatorio y presionar en la matriz.
Así que esta línea es en realidad simplemente repetir tiempos entumecidos.
Así que voy a hacer una función separada que generará el color aleatorio para
nosotros y voy a llamar a ese color aleatorio.
Así que funciona al azar y lo que está viendo es que tengo una función aquí.
llamando a otra función que simplemente se llama color aleatorio y eso es solo para romper un código.
Genero colores aleatorios que llamo dentro de ese. Estoy
Deje en claro que lo que hace modular todo lo que podríamos tener sin ninguna función en absoluto podría ser lo que
la gente llamaría código de espagueti que está por todos lados.
Así que vamos a agregar algunas funciones aquí para agregar algo de estructura.
Y nuevamente al final de este proyecto cuando lo tenemos completo se ve bien, toda la funcionalidad
está ahí.
Tendré un video opcional sobre la refacturación y hablaré sobre cómo puede cambiar las cosas para que
sean un poco más limpias, un poco más bonitas, pero funcionarán exactamente de la misma manera.
Entonces, para empezar colores aleatorias para hacer un color aleatorio, tendremos que elegir una lectura de 0 a 5 5 repeticiones de 0 2 a 5 5 y
luego tenemos que elegir un verde de cero a 2 5 5 y luego un azul .
Y para elegir cualquier número del 0 al 255 también necesitamos usar matemáticas no al azar.
Entonces, las matemáticas no serán aleatorias.
Eso nos da entre 0 y 1.
No incluye uno.
Necesitamos multiplicar por 256 porque recuerde que estamos redondeando hacia abajo.
número posible para que muchos multipliquen por uno más 256 y luego tenemos que plantar ese piso de matemáticas.
Entonces queremos que 255 sea el mayor
Así que vaya a mi consejo y pegue este código que puede ver si obtenemos un número aleatorio entre 0 y 255
y probablemente no verá que realmente va a 255.
Tendremos que confiar en mí en eso.
Pero puedes ver que al menos se acerca.
Creo que vimos 253.
Eso es suficiente por ahora.
que todos los cuadrados se volvieron púrpuras y eso es porque nuestra generación de colores aleatorios no devuelve nada.
Y también ves
Entonces solo devuelve una cadena vacía.
Entonces, realmente no estamos dando vueltas y dando un color a cada uno.
Así que es solo tomar el morado predeterminado de C Ss solo una nota al margen.
Entonces esto generará un número de 0 a 255.
Lo guardaremos en una variable llamada R y luego haremos lo mismo para el verde y el azul, así como
este espacio correctamente y cambiaremos los nombres, así que G y B nos darán tres números del
0 al 255.
Y la peor parte es sintetizarlos en esta gran cadena que sigue el formato de R. GRAMO. B paréntesis y luego los
números dentro de R G y B.
Y eso significa una gran cantidad de cadenas de apertura y cierre y signos más.
Empecemos con lo que se parece a esto.
Vamos a tener nuestro G-B y luego abrir el paréntesis y luego el canal rojo.
Este número de 0 a 2 5 5 más una coma más el valor de G más otra coma más el valor de B más
nuestros paréntesis de cierre.
Y deberíamos estar listos para irnos ahora.
Esta gran cuerda.
Y lo que queremos hacer es devolver esa cadena así.
Así que devuelve esta cadena grande y eso generará colores aleatorios.
Entonces, es mucho trabajo para un color.
Tres números diferentes 0 2 2 5 5.
Los ponemos juntos con comas entre ellos paréntesis a su alrededor las letras R. GRAMO. SEGUNDO.
Y luego regresamos para que podamos usarlo aquí.
página, diríjase a nuestro cónsul y simplemente intente llamar al azar y eso se ve bien para mí.
Y si solo queremos probar si funciona, vamos a continuar y actualizar la
Estamos obteniendo un color aleatorio.
Los paréntesis son correctos.
Las comas son todas buenas.
Vámonos ahora y use eso aquí.
Así que vamos a llamar a ese color aleatorio y vamos a insertar eso en nuestra matriz.
Aquí están.
Entonces nuestro DOT push y no tenemos que usar push, pero eso va a hacer aquí.
Y esto ahora nos construirá una buena variedad de colores.
Así que genera colores aleatorios 6.
Llamamos a esto repeticiones seis veces cada vez.
Impulsa un color aleatorio a la matriz.
Así que voy a mover nuestro comentario aquí.
Aquí vamos.
Y para verificar que eso funciona si actualizamos.
colores aleatorios y no solo eso son colores aleatorios que elegimos el color que elegimos de la matriz también cambia.
Puedes ver ahora que obtenemos seis
Entonces no rompimos eso.
Todo sigue funcionando o lo hace.
Veamos.
Entonces, si hago clic en algunos de estos colores, inténtalo de nuevo, inténtalo de nuevo, inténtalo de nuevo, tal vez solo tengo un libro
realmente malo, pero no pasa nada.
Entonces el problema es un poco complicado.
al error que mencioné cuando hicimos el juego de anotador cuando estábamos comparando cosas aquí.
Es un poco similar
Si estamos comprobando si el usuario tiene razón si escogen el color correcto, algo va mal antes de que
tengamos un número.
Y lo estábamos comparando con una cadena.
En este caso, es un poco diferente.
Déjame mostrarte que vas a hacer otra estafa. el registro de correa hace clic para colorear y luego elige el color.
Y veamos qué aspecto tienen, tal vez sean ligeramente diferentes.
Vamos a actualizar la página y abrir la estafa. Y empecemos a hacer clic.
Esta es una cantidad mediana de Fred, un poco verde y bastante azul.
Hagamos clic en algunos.
Y observe los números a la izquierda, la cadena RGV y la de la derecha.
Y, por supuesto, estos no coinciden.
Pero si haces clic en el de la derecha, puedes ver que cuando coinciden, aún cree que estamos equivocados.
Dice intentarlo de nuevo.
Y si compara las dos cadenas aquí, esta es el color cliqueado.
Esto es lo que regresa
Cuando hacemos clic en un elemento, pedimos este fondo marcado por puntos y este es el color que
elegimos de la matriz.
Entonces de alguna manera son un poco diferentes.
Y lo que sucede es que cuando realmente establecemos el color de fondo de un elemento, el SS
automáticamente agrega en el dormitorio automáticamente agregue 10 espacios entre ellos.
Entonces, para arreglar que lo que queremos hacer es solo agregar espacios aquí entre nuestros números, así que después de los cometas y si
hacemos eso, entonces se compararán y serán iguales entre sí.
Entonces eso es una especie de error complicado.
Simplemente tiene que ver con la forma en que estamos comparando cosas con triples iguales y no es que el
doble igual lo arregle de todos modos.
Duplicar las llamadas no ignora espacios ni nada, pero es solo un problema con la forma en
que generamos los colores.
Entonces, si intentamos esto de nuevo y refrescamos.
Ahora hagamos clic aquí.
Puedes ver que nuestros espacios están aquí y estos definitivamente coincidirán.
Una vez que hacemos clic en el color correcto, que es el último y obtenemos nuestro correcto.
Así que definitivamente es un error complicado para terminar.
Intentemos jugar un juego y una pantalla completa y deshacernos de la consola y actualizar y
admirar nuestros colores aleatorios.
Lo último que podemos hacer es que, cuando lo solucionemos correctamente, también podamos cambiar el fondo H-1 como lo
hice aquí.
Entonces, cuando adivinas el color correcto, también cambia el color de fondo.
Y ese es un cambio simple.
Todo lo que tenemos que hacer es seleccionar el H-1.
Así que H-1 y podemos simplemente seleccionarlo como el único H-1 en la página.
Así que aquí solo voy a seleccionar en la parte inferior var H-1 es igual al documento que el
selector de consultas H-1 guarda eso.
Y luego, cuando el usuario adivine correctamente cuál es el correcto aquí, vamos a cambiar el fondo del H-1 DOD
o al estilo de ese fondo.
Y eso ahora debería ser igual a recoger el color y guardaremos eso para ir a la versión correcta de la actualización de nuestro
juego e intentemos hacer clic.
tenemos un camino por recorrer con nuestro estilo en comparación con esto, pero estamos llegando allí con la lógica.
Y ahí vamos definitivamente,
Entonces, adivinas incorrectamente que desaparecen simplemente cambiando el color de fondo.
Y si lo adivinaste correctamente, todos cambian de color y el H-1 también cambia.
En el siguiente video vamos a agregar la funcionalidad de reproducción nuevamente y agregaremos un poco más de estilo.