1
00:00:01,565 --> 00:00:04,608
Ahora que aprendimos cómo usar texto, hagamos algo más vistoso.

2
00:00:04,608 --> 00:00:07,739
La primera cosa vistosa es que ahora empezaremos a usar la palabra "cadena".

3
00:00:07,739 --> 00:00:10,610
Pudieras pensar: "¿Cadena? Es con lo que juega mi gato".

4
00:00:10,610 --> 00:00:14,141
Pero para programadores, cadena es un nombre especial que usamos para partes de texto.

5
00:00:14,141 --> 00:00:16,566
Puedes pensar en esto como una cadena de caracteres, si ayuda.

6
00:00:16,566 --> 00:00:21,691
Tu nombre es una cadena, el nombre de tu escuela es una cadena y cada mensaje de texto que hayas enviado también lo es.

7
00:00:21,691 --> 00:00:25,498
Básicamente, sólo piensa que cadena es igual a texto.

8
00:00:25,498 --> 00:00:28,565
Ya hemos dibujado y coloreado cadenas.

9
00:00:28,565 --> 00:00:30,987
¿Podemos usar variables con cadenas? ¡Claro!

10
00:00:30,987 --> 00:00:34,990
Igual que como normalmente pondrías un número en una variable, también podrías asignarle una cadena a una variable.

11
00:00:34,990 --> 00:00:42,323
Decimos algo como: "var myName = (tu nombre aquí)" pongo "Sophia"; hay que recordar las comillas.

12
00:00:42,323 --> 00:00:47,537
Luego ponemos la variable "myName" en el texto entre comillas en lugar de escribir directamente "Sophia",

13
00:00:47,537 --> 00:00:48,906
como hicimos antes.

14
00:00:48,906 --> 00:00:53,377
De esta forma se ve igual ahora, pero podemos escribir esto varias veces.

15
00:00:53,377 --> 00:00:56,652
Ya sabes, una vez aquí, otra aquí, tal vez podamos ser un poco artísticos.

16
00:00:56,652 --> 00:01:01,701
Lo único que tienes que hacer después, es cambiar esta variable para que sea tu nombre y entonces tienes

17
00:01:01,701 --> 00:01:03,765
tu nombre escrito tres veces.

18
00:01:03,765 --> 00:01:10,070
Sólo para variar, ¿qué tal si queremos alocarnos? ¿podemos empezar a sumar cadenas entre sí?

19
00:01:10,070 --> 00:01:12,429
Como ¿tal vez recuerdas cuando empezamos a sumar variables entre sí?

20
00:01:12,429 --> 00:01:16,606
Bueno, de hecho, podemos hacerlo. La computadora sólo unirá las dos cadenas.

21
00:01:16,606 --> 00:01:20,362
Por ejemplo: bueno, deshagámonos de esto, para hacerlo sólo una vez,

22
00:01:20,362 --> 00:01:27,590
después podemos usar esta otra variable, "message" que será "myName" más, digamos, un montón de signos de exclamación.

23
00:01:27,590 --> 00:01:31,313
Y si ponemos "message" en el texto para dibujar esta variable en vez de "myName"

24
00:01:31,313 --> 00:01:37,117
podemos ver que lo que hizo fue pegar, después de mi nombre, esos signos de exclamación.

25
00:01:37,117 --> 00:01:42,345
Podemos hacer esto un poco más emocionante si quisiéramos escribir "message", digamos, dos veces.

26
00:01:42,345 --> 00:01:48,904
Esto parece muy razonable, añadir cadenas significa que pegas una cadena después de la otra.

27
00:01:48,904 --> 00:01:54,500
Pudieras estar pensando: ¿podemos alocarnos de verdad y empezar a multiplicar, dividir o restar cadenas?

28
00:01:54,500 --> 00:01:59,163
¿Podríamos? Bueno, no podemos. Con las cadenas sólo podemos sumarlas.

29
00:01:59,163 --> 00:02:04,136
Tienes razón en cuanto a que podemos sumar y dividir con variables numéricas, pero variables de cadenas sólo se pueden sumar.

30
00:02:04,136 --> 00:02:09,220
Pero, ser curioso y hacer este tipo de preguntas es la actitud correcta al programar.

31
00:02:09,220 --> 00:02:12,519
Podrías pensar: "¿qué significaría dividir una cadena?"

32
00:02:12,519 --> 00:02:16,930
También podemos usar animación e interacción del ratón con cadenas de texto.

33
00:02:16,930 --> 00:02:20,291
Por ejemplo, podemos hacer que la cadena siga al ratón.

34
00:02:20,291 --> 00:02:23,186
Sólo con pegarlo en un ciclo de dibujo como hicimos con los rectángulos.

35
00:02:23,186 --> 00:02:29,634
Entonces, si piensas acerca de cómo hacer esto, podríamos decir "var draw", luego pegamos todo esto justo aquí.

36
00:02:29,634 --> 00:02:32,905
Probablemente se ve muy familiar a "Introducción a la animación".

37
00:02:32,905 --> 00:02:39,161
Y pudieras pensar: bueno, para hacer que siga al ratón ciertamente necesitamos usar "mouseX" y "mouseY".

38
00:02:39,161 --> 00:02:43,188
Y ahí lo tienes, realmente estamos pintando con nuestro nombre.

39
00:02:43,188 --> 00:02:49,965
Claro que, si queremos, podríamos cambiar de fondo fácilmente, digamos a un buen azul claro.

40
00:02:49,965 --> 00:02:57,395
Y ahora tenemos que el texto sólo sigue al ratón, justo como vimos con los rectángulos.

41
00:02:57,395 --> 00:03:02,232
Ahora, como último y divertido truco, usemos la animación y hagamos que el tamaño del texto crezca y crezca y crezca.

42
00:03:02,232 --> 00:03:06,229
Vamos a configurar aquí textSize a 30. Como aprendimos en variables

43
00:03:06,229 --> 00:03:13,723
en lugar de usar 30, también podemos decir: "var howBig = 30;" y usar esta variable en lugar del 30 directamente.

44
00:03:13,723 --> 00:03:19,925
Bueno, eso es lo mismo y necesitamos, obviamente, estar cambiando algo para obtener una animación.

45
00:03:19,925 --> 00:03:25,254
Podemos hacerlo diciendo "howBig = howBig + 1".

46
00:03:25,254 --> 00:03:31,585
Lo que significa, si recuerdas, "howBig" contiene lo que era "howBig" más uno para hacerlo un poco más grande.

47
00:03:31,585 --> 00:03:35,694
Ahora sólo necesitamos reiniciar el programa y tenemos que

48
00:03:35,694 --> 00:03:39,974
cuando movemos el ratón, "textSize" está creciendo y creciendo y creciendo y creciendo

49
00:03:39,974 --> 00:03:41,939
por esta línea de aquí.

50
00:03:43,262 --> 00:03:46,962
También podrías pensar: bueno, ¿cómo podemos hacerlo crecer más rápido?

51
00:03:47,823 --> 00:03:53,003
Ahora no sólo sabes cómo manipular figuras con código, sino que también puedes usar texto con código.