Resizing shapes with variable expressions | Computer Programming | Khan Academy

Summary

En este guion, se explora cómo controlar la posición y tamaño de un personaje llamado Winston utilizando variables en un programa. Se explica cómo establecer variables para el tamaño de los ojos, la posición del rostro y cómo hacer que el tamaño de la boca y los ojos se ajusten automáticamente en relación con el tamaño del rostro. Además, se abordan los problemas que surgen cuando los elementos gráficos exceden los límites del rostro y cómo solucionarlos mediante la creación de variables que dependen de fracciones de otras variables. Finalmente, se celebra el aprendizaje con una demostración de cómo hacer que Winston crezca enorme.

Takeaways

• 😀 El script trata sobre cómo controlar la posición y el tamaño de un personaje llamado Winston usando variables en un programa.
• 🎮 Se introducen variables 'x' e 'y' para mover a Winston hacia los lados y hacia arriba y abajo en la pantalla.
• ⚙️ Se establecen variables 'eyeSize', 'faceSize' y 'mouthSize' para controlar el tamaño de los ojos, la cara y la boca respectivamente.
• 🔄 Se resalta la importancia de reemplazar los números codificados de forma rígida (hard-coded numbers) con variables para mayor flexibilidad en el programa.
• 🔲 Se explica cómo calcular el tamaño de los ojos y la boca como fracciones del tamaño de la cara para mantener las proporciones.
• 🔄 Se sugiere la utilización de fracciones para determinar la posición de los ojos y la boca dentro de la cara en relación con el tamaño de esta.
• 📏 Se enfatiza la necesidad de ajustar los desplazamientos (offsets) de los elementos faciales basándose en el tamaño de la cara para evitar que se salgan del límite de la cara.
• 🤖 Se demuestra cómo hacer que los ojos y la boca se redimensionen proporcionalmente con el tamaño de la cara al cambiar la variable 'faceSize'.
• 🎉 Se celebra el logro de hacer que las variables dependan del valor de otras variables para ampliar las capacidades del programa.
• 🌟 Se concluye con un ejemplo de cómo cambiar el tamaño de Winston haciendo que la variable 'faceSize' sea mucho más grande.

Q & A

¿Qué variables se utilizan para mover a Winston de lado a lado y arriba y abajo?

Se utilizan las variables 'x' y 'y' para posicionar a Winston en el eje horizontal y vertical respectivamente.

¿Cuál es el propósito de la variable 'eyeSize' en el programa?

La variable 'eyeSize' se utiliza para controlar el tamaño de los ojos, ya que todos tienen un ancho y alto de 40 píxeles.

¿Cómo se posiciona el rostro de Winston en el programa?

El rostro de Winston se posiciona en el centro usando las variables 'x' y 'y', que se aplican en el comando 'ellipse' para dibujar el círculo amarillo.

¿Qué es un 'hard-coded number' y cómo afecta el programa?

Un 'hard-coded number' es un número literal en el código que no depende de variables. Estos números fijos pueden limitar la flexibilidad del programa al no permitir cambios dinámicos en el tamaño o posición de los elementos.

¿Qué variables nuevas se crean para reemplazar los 'hard-coded numbers' en el programa?

Se crean las variables 'faceSize' y 'mouthSize' para reemplazar los números literales en el tamaño del rostro y la boca respectivamente.

¿Cómo se calcula el tamaño de la boca ('mouthSize') en relación con el tamaño del rostro ('faceSize')?

El tamaño de la boca se calcula como la mitad del tamaño del rostro, es decir, 'mouthSize' se establece como '0.5 * faceSize'.

¿Cuál es la relación matemática entre 'faceSize' y 'eyeSize'?

El tamaño de los ojos ('eyeSize') se establece como '2/15 * faceSize', lo que significa que es aproximadamente el 13.33% del tamaño del rostro.

¿Por qué es importante calcular las posiciones de los ojos y la boca como fracciones de 'faceSize'?

Calcular las posiciones como fracciones de 'faceSize' asegura que los elementos del rostro se posicionen correctamente dentro del rostro, incluso cuando se cambia el tamaño del rostro.

¿Cómo se resuelve el problema de los ojos y la boca saliendo del rostro cuando se reduce el tamaño del rostro?

Se ajustan las posiciones de los ojos y la boca basándose en fracciones de 'faceSize', como '1/6 * faceSize' para los ojos y '1/3 * faceSize' para la boca, para que se mantengan dentro del rostro.

¿Qué se celebra al final del guion tras entender cómo hacer que las variables dependan de otros valores?

Se celebra al final del guion con la capacidad de hacer que Winston sea enorme, mostrando la flexibilidad y el poder del uso de variables interdependientes en el programa.