[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.88,0:00:06.00,Default,,0000,0000,0000,,Estamos de regreso en nuestro programa para dibujar a "Winston", y he añadido algo de texto en él. Dialogue: 0,0:00:06.00,0:00:11.07,Default,,0000,0000,0000,,Lo que quiero hacer es posicionar a "Winston" debajo de cada una de estas etiquetas, Dialogue: 0,0:00:11.07,0:00:13.21,Default,,0000,0000,0000,,para mostrarlo en cada etapa de la vida. Dialogue: 0,0:00:13.21,0:00:15.20,Default,,0000,0000,0000,,Por ahora él está por todos lados. Dialogue: 0,0:00:15.20,0:00:20.45,Default,,0000,0000,0000,,Eso es porque estamos asignando a "faceX" y "faceY" números aleatorios dentro de la función. Dialogue: 0,0:00:20.45,0:00:26.71,Default,,0000,0000,0000,,En lugar de eso, lo que queremos hacer es decir: "Oye, aquí está la posición exacta en la que quiero dibujar a 'Winston'" Dialogue: 0,0:00:26.71,0:00:31.05,Default,,0000,0000,0000,,Y luego quiero poder especificar esta posición cada vez que llame a la función,\N Dialogue: 0,0:00:31.05,0:00:34.05,Default,,0000,0000,0000,,de la misma manera que hicimos con "ellipse()" y con "rect()". Dialogue: 0,0:00:34.05,0:00:40.46,Default,,0000,0000,0000,,¿Está bien? Quiero poner un "Winston" aquí, y un "Winston" aquí, y un" Winston" aquí y un "Winston" aquí, Dialogue: 0,0:00:40.46,0:00:44.62,Default,,0000,0000,0000,,y no sólo en lugares aleatorios cada vez \Nque llamo la función. Dialogue: 0,0:00:44.62,0:00:49.05,Default,,0000,0000,0000,,Así que para hacer eso, tenemos que especificar "parámetros" para la función, Dialogue: 0,0:00:49.05,0:00:53.72,Default,,0000,0000,0000,,tanto en nuestra definición de la función - aquí en la parte superior - Dialogue: 0,0:00:53.72,0:00:58.03,Default,,0000,0000,0000,,como en la llamada a la función, aquí abajo, cuando en realidad llamamos a la función. Dialogue: 0,0:00:58.03,0:01:03.26,Default,,0000,0000,0000,,Así que para la función "drawWinston()", vamos a pasar "faceX" y "faceY", Dialogue: 0,0:01:03.26,0:01:10.35,Default,,0000,0000,0000,,para que use los valores que pasamos en lugar de generarlos aleatoriamente. Dialogue: 0,0:01:10.35,0:01:15.21,Default,,0000,0000,0000,,Comencemos por pensar en los parámetros que vamos a enviar en estas llamadas a la función aquí abajo. Dialogue: 0,0:01:15.21,0:01:20.07,Default,,0000,0000,0000,,Queremos posicionar a "Winston" debajo de cada texto, así que probablemente queremos que la "x" y "y" Dialogue: 0,0:01:20.07,0:01:25.13,Default,,0000,0000,0000,,de cada "Winston" sea muy similar a los números que pasamos en la función "text()". Dialogue: 0,0:01:25.13,0:01:37.71,Default,,0000,0000,0000,,Probablemente, sólo unos 10 pixeles más abajo en la "y". Así que la primera podría ser 10 y 30, y luego 200, 30... Dialogue: 0,0:01:37.71,0:01:43.44,Default,,0000,0000,0000,,10, 230... 200, 230. Son las mismas coordenadas que las del texto. Dialogue: 0,0:01:43.44,0:01:49.60,Default,,0000,0000,0000,,Sólo estoy aumentando 10 en cada "y", porque quiero que quede un poco más abajo. Dialogue: 0,0:01:49.60,0:01:55.55,Default,,0000,0000,0000,,Ok, pero "Winston" no se ha movido. Esto es porque no le hemos dicho a nuestra función aquí arriba Dialogue: 0,0:01:55.55,0:02:00.13,Default,,0000,0000,0000,,que le estamos pasando los parámetros, así que sigue usando los valores aleatorios. Dialogue: 0,0:02:00.13,0:02:04.37,Default,,0000,0000,0000,,Entonces con el fin de decirle a esta función: "Oye te vamos a pasar esta información", Dialogue: 0,0:02:04.37,0:02:09.21,Default,,0000,0000,0000,,tenemos que dar los nombres de los parámetros dentro de estos paréntesis. Dialogue: 0,0:02:09.21,0:02:17.38,Default,,0000,0000,0000,,Así que los llamaremos "faceX" y "faceY", y los separamos por una coma, y los vamos a llamar así porque Dialogue: 0,0:02:17.38,0:02:21.19,Default,,0000,0000,0000,,así es como los estábamos usando para referirnos a ellos dentro de la función. Dialogue: 0,0:02:21.19,0:02:25.46,Default,,0000,0000,0000,,¿Ok? De esta manera no tenemos que reescribir el resto de nuestro código. Dialogue: 0,0:02:25.46,0:02:29.33,Default,,0000,0000,0000,,Pero sigue sin pasar nada; "Winston" está por todos lados. Dialogue: 0,0:02:29.33,0:02:35.87,Default,,0000,0000,0000,,Bueno, si observamos aquí arriba en nuestra función, estamos sobreescribiendo "faceX" y "faceY" con valores aleatorios. Dialogue: 0,0:02:35.87,0:02:39.79,Default,,0000,0000,0000,,Así que todo lo que tenemos que hacer \Nes borrar estas líneas... Dialogue: 0,0:02:39.79,0:02:50.33,Default,,0000,0000,0000,,¡Tan tan!, Ahora estamos pasando "faceX" y "faceY" a la función y la función está usando los valores que le estamos asignando aquí. Dialogue: 0,0:02:50.33,0:02:55.18,Default,,0000,0000,0000,,Ahora, como puedes ver, no posicioné correctamente a "Winston", porque olvidé Dialogue: 0,0:02:55.18,0:02:58.79,Default,,0000,0000,0000,,que el texto se posiciona a partir de la esquina superior izquierda, Dialogue: 0,0:02:58.79,0:03:06.77,Default,,0000,0000,0000,,y la cara se posiciona a partir del centro. Entonces sólo tengo que jugar un poco con mis números aquí, ¿de acuerdo? Dialogue: 0,0:03:06.77,0:03:13.24,Default,,0000,0000,0000,,Probablemente necesito mover la "x", \Npor encima, ok... este es nuestro niño... Dialogue: 0,0:03:13.24,0:03:18.73,Default,,0000,0000,0000,,Continuamos, y ahora todo lo que tengo que hacer es cambiar lo que estoy pasando a la función, Dialogue: 0,0:03:18.73,0:03:22.41,Default,,0000,0000,0000,,no tengo que cambiar la definición de función en absoluto, Dialogue: 0,0:03:22.41,0:03:28.87,Default,,0000,0000,0000,,porque la función siempre va a tomar los valores que le pasemos, ¿ok? Como lo hace con "ellipse()" y "rect()". Dialogue: 0,0:03:28.87,0:03:33.71,Default,,0000,0000,0000,,Ok, ya lo posicioné más o menos, pero\Nlo que vi es que "Winston" es muy grande. Dialogue: 0,0:03:33.71,0:03:35.96,Default,,0000,0000,0000,,Está sobre todo, no cabe. Dialogue: 0,0:03:35.96,0:03:39.09,Default,,0000,0000,0000,,Bueno, como escribí todo el código para dibujarlo en una función, Dialogue: 0,0:03:39.09,0:03:45.50,Default,,0000,0000,0000,,puedo cambiar el tamaño de todos ellos cambiando sólo la línea de código que dibuja las elipses. Dialogue: 0,0:03:45.50,0:03:51.13,Default,,0000,0000,0000,,Así que lo hacemos de 190, sí, "Winston" está a dieta, de 190. Dialogue: 0,0:03:51.13,0:04:01.41,Default,,0000,0000,0000,,Muy bien, ahora él va a quedar mejor y yo podría seguir ajustándolo para que en realidad quede ahí dentro, ¿cierto? Dialogue: 0,0:04:01.41,0:04:09.34,Default,,0000,0000,0000,,Interesante. Vamos a hacer una revisión final de lo que hace este código. Define una función llamada "drawWinston()", Dialogue: 0,0:04:09.34,0:04:15.19,Default,,0000,0000,0000,,y nos dice que esta función toma dos valores, etiquetados como "faceX" y "faceY", Dialogue: 0,0:04:15.19,0:04:20.30,Default,,0000,0000,0000,,y estos valores vienen básicamente como variables que podemos usar en cualquier lugar dentro de nuestra función, Dialogue: 0,0:04:20.30,0:04:25.16,Default,,0000,0000,0000,,así como usamos las variables declaradas en la parte de arriba. Dialogue: 0,0:04:25.16,0:04:30.32,Default,,0000,0000,0000,,Entonces podemos llamar esta función siempre que queramos después de que la declaramos, Dialogue: 0,0:04:30.32,0:04:35.00,Default,,0000,0000,0000,,y le podemos pasar valores diferentes, valores nuevos que va a usar cada vez. Dialogue: 0,0:04:35.00,0:04:38.23,Default,,0000,0000,0000,,Así que ahora han visto lo que es realmente interesante de las funciones. Dialogue: 0,0:04:38.23,0:04:41.23,Default,,0000,0000,0000,,Podemos llegar a un código que pensamos que podría ser muy útil para reutilizar, Dialogue: 0,0:04:41.23,0:04:46.91,Default,,0000,0000,0000,,pero podemos también usar parámetros y decir: "Oye, aquí hay una cosita que puedes cambiar en este código para personalizarlo" Dialogue: 0,0:04:46.91,0:04:53.34,Default,,0000,0000,0000,,Es como una receta. Escribes las instrucciones generales, y te das cuenta de repente que necesitas alimentar 4 "Wintons" en lugar de 1, Dialogue: 0,0:04:53.34,0:04:58.20,Default,,0000,0000,0000,,no tienes que empezar todo otra vez, sólo modificas las instrucciones originales y multiplicas todo por 4. Dialogue: 0,0:04:58.20,0:05:02.96,Default,,0000,0000,0000,,¡Así que ahora puedes empezar a pensar en las recetas de tu código! Yummy