App Inventor 2 Tutorials for Beginners – 06 Random Color Generator

Hola a todos, soy Leo y bienvenidos de nuevo a nuestros tutoriales de App Inventor, ya que hemos pasado como cinco lecciones y creo que ustedes deberían tener una comprensión básica de App Inventor, así que creo que es hora de que pasemos a más. aplicaciones complicadas y es por eso que hoy haremos una aplicación complicada, haremos algo así como un botón para cambiar el color de fondo de nuestra pantalla primero, comencemos un nuevo proyecto y necesitamos cuatro componentes, necesitamos un botón, dos etiquetas de texto y un nuevo componente llamado lienzo que se puede encontrar en la pestaña de dibujo y animación, por lo que lo que hace esta aplicación es que queremos cambiar el color de este lienzo tocando el botón y generará un color aleatorio, así que primero lo que debemos hacer es cambiar algunos de las propiedades de nuestros componentes, como agrandar el texto y el lienzo, así que cambia el color y la primera etiqueta es solo tipo RGB porque estamos hablando de colores y en la computadora los colores generalmente se combinan con tres elementos los valores RGB también se denominan código de color y R significa rojo G significa verde y azul es B, por lo que solo se agota el tiempo para estar aquí y la segunda etiqueta que queremos mostrar el valor RGB, por lo que borramos el texto aquí y quiero hacer que nuestro lienzo sea más grande en el ancho de la construcción principal y también la altura llenará a nuestros padres para que cubra la pantalla restante, así que después de esto también quiero cambiar el color de fondo de nuestras etiquetas porque cuando lo hagamos simplemente lo cambiaremos a blanco, ¿de acuerdo? white ok, ahora pasamos a los bloques de ustedes ahora aquí vamos a probar algunos bloques de funciones nuevos que no hemos cubierto en lecciones anteriores, así que si no tienen idea de qué es, solo sigan las instrucciones y hablaremos sobre ellos uno por uno en nuestras lecciones futuras, hoy cubriremos muchas cosas, como números aleatorios, listas y colores, y también el lienzo, así que primero necesitamos dos variables, una es para el bucle y lo explicaré más adelante y también el segundo es el color listas ok, necesitamos dos variables diferentes, así que la lista de colores, necesitamos crear una lista, así que arrastramos el bloque de hacer lista aquí y, como mencioné, el color consta de tres componentes diferentes, los valores RGB, pero aquí solo tenemos dos, así que lo que tenemos que hacer es hacer clic en este pequeño botón azul y arrastre un nuevo elemento aquí para que la lista consista en tres elementos diferentes inicialmente y solo quiero arrastrar tres ceros es muy simple y quiero que sea 0 digamos 0 y recuerde que tenemos el botón cuando hacemos clic en el botón Primero queremos cambiar los valores en nuestra lista, así que necesitamos un ciclo for, entonces, ¿dónde está el ciclo for? tenemos tres colores del 1 al 3 aquí "por 1" significa el intervalo entonces "por 1" significa que hacemos algo de 1, 2 y 3 por lo que significa tres veces y ahora lo que queremos hacer en nuestros bucles lo que queremos hacer es generar un número aleatorio y asignarlo a nuestra lista en cada turno, así que aquí ve a variables y recuerda que tenemos este conjunto de variables a la derecha, seleccionamos nuestra lista y recordamos que tenemos la lista y reemplazamos esta.

Lo siento, no haremos un conjunto de la lista. Podemos hacer esto de una manera más conveniente, simplemente reemplace los elementos en nuestra lista. así que el primer bloque debería ser nuestra lista, así que arrastre esto para obtener nuestra lista y el índice significa qué elemento queremos cambiar sus valores, así que recuerde que tenemos un ciclo que cambiaré de 1 a 3, por lo que el índice estará bien, ahora aquí tenemos tenemos i e i globales, pero como estamos haciendo un bucle for, i solo cambia en el bucle, así que tenemos que seleccionar i y vamos a mostrar los valores con un número aleatorio que se puede encontrar debajo de la pestaña de matemáticas aquí y cuatro colores para colorear el valor RGB variará de 0 a 255 y después de cambiarlo, tenemos que cambiar dinámicamente nuestros colores, por eso vamos a Canvas y buscamos set canvas.color de fondo en nuestro número de lista aquí, la lista consta de tres diferentes artículos, recuerde, pero antes de eso también necesitamos color aquí llamado hacer color para que y Puede ver los bloques de color de creación seguidos de una lista de creación, lo que significa que vamos a crear un color a partir de tres valores diferentes en una lista, así que verificamos esto y no necesitamos la última parte, así que simplemente eliminamos y vamos a hacer el color usando nuestra lista de colores global y también quiero mostrar el número que acabamos de generar, así que vamos a la etiqueta 2 y establecemos nuestra etiqueta en .text para las listas, así que simplemente copiamos este componente y con él aquí y está bien, esto debería funcionar ahora y abramos nuestro emulador y pruébelo bien aquí, así que emulador, presiono el botón aquí y pueden ver que tenemos el valor RGB aquí y los colores aquí, está bien, eso es más o menos sobre esta lección y creo que en nuestro En futuras lecciones, cubriremos más sobre lo que acabamos de discutir hoy, incluidos los colores, los números aleatorios, la lista y también los bucles, así que nos vemos la próxima semana.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *