Return to Video

Texto Fantástico Parte 2

  • 0:02 - 0:05
    Ahora que aprendimos cómo usar texto, hagamos algo mas vistoso.
  • 0:05 - 0:08
    La primera cosa vistosa es que ahora empezaremos a usar la palabra "cadena".
  • 0:08 - 0:11
    Puedieras pensar: "¿Cadena? Con eso aseguro mi bicicleta" (comparación cambiada).
  • 0:11 - 0:14
    Pero para programadores, cadena es un nombre especial que usamos para partes de texto.
  • 0:14 - 0:17
    Puedes pensar en esto como una cadena de caracteres, si ayuda.
  • 0:17 - 0:22
    Tu nombre es una cadena, el nombre de tu escuela es una cadena y vada mensaje de texto que hayas enviado también lo es.
  • 0:22 - 0:25
    Basicamente sólo piensa que cadena es igual a texto.
  • 0:25 - 0:29
    Ya hemos dibujado y coloreado cadenas.
  • 0:29 - 0:31
    ¿Podemos usar variables con cadenas? ¡Claro!
  • 0:31 - 0:35
    Igual que como normalmente pondrías un número en una variable, también podrías asignarle una cadena.
  • 0:35 - 0:42
    Decimos algo como: "var myName = (tu nombre aquí)" pongo "Sophia"; hay que recordar las comillas.
  • 0:42 - 0:48
    Luego ponemos la variable myName en el texto entre comillas en lugar de escribir directamente "Sophia"
  • 0:48 - 0:49
    como hicimos antes.
  • 0:49 - 0:53
    De esta forma se ve igual ahora, pero podemos escribir esto varias veces
  • 0:53 - 0:57
    Ya sabes, una vez aquí, otra aquí, tal vez podamos ser un poca artísticos.
  • 0:57 - 1:02
    Lo único que tienes que hacer después es cambiar esta variable para que sea tu nombre y entonces tienes
  • 1:02 - 1:04
    tu nombre escrito tres veces.
  • 1:04 - 1:10
    Sólo para variar, ¿qué tal si queremos alocarnos? ¿podemos empezar a sumar cadenas entre sí?
  • 1:10 - 1:12
    Como ¿tal vez recuerdas cuando empezamos a sumar variables entre sí?
  • 1:12 - 1:17
    Bueno, de hecho, podemos hacerlo. La computadora solo unirá las dos cadenas.
  • 1:17 - 1:20
    Por ejemplo: bueno, desagámonos de esto, para hacerlo sólo una vez
  • 1:20 - 1:28
    después podemos usar esta otra variable, "message" que será "myName" mas, digamos, un montón de signos de exclamación.
  • 1:28 - 1:31
    Y si ponemos "message" en el texto para dibujar esta variable en vez de "myName"
  • 1:31 - 1:37
    podemos ver que lo que hizo fue pegar, después de mi nombre, esos signos de exclamación.
  • 1:37 - 1:42
    Podemos hacer esto un poco mas emocionante si quisiéramos escribir "message", digamos, dos veces.
  • 1:42 - 1:49
    Esto parece muy rasonable, añadir cadenas significa que pegas una cadena después de la otra.
  • 1:49 - 1:54
    Pudieras estar pensando: ¿podemos alocarnos de verdad y empezar a multiplicar, dividir o restar cadenas?
  • 1:54 - 1:59
    ¿Podríamos? Bueno, no podemos. Con las cadenas solo podemos sumarlas.
  • 1:59 - 2:04
    Tienes razón en cuanto a que podemos sumar y dividir con variables numéricas, pero variables de cadenas sólo se pueden sumar.
  • 2:04 - 2:09
    Pero, ser curioso y hacer este tipo de preguntas es la actitud correcta al programar.
  • 2:09 - 2:12
    Podrías pensar: "¿qué significaría dividir una cadena?"
  • 2:12 - 2:17
    También podemos usar animación e interacción del mouse con cadenas de texto.
  • 2:17 - 2:20
    Por ejemplo, podemos hacer que la cadena siga al mouse.
  • 2:20 - 2:23
    Sólo con pegarlo en un ciclo de dibujo como hicimos con los rectángulos.
  • 2:23 - 2:30
    Entonces, si piensas acerca de cómo hacer esto, podríamos decir var draw, luego pegamos todo esto justo aquí.
  • 2:30 - 2:33
    Probablemente se ve muy familiar a "introducción a la animación"
  • 2:33 - 2:39
    Y pudieras pensar: bueno, para hacer que siga al mouse ciertamente necesitamos usar mouseX y mouseY
  • 2:39 - 2:43
    Y ahí lo tienes, realmente estamos pintando con nuestro nombre.
  • 2:43 - 2:50
    Claro que, si queremos, podríamos cambiar de fondo facilmente, digamos a un buen azul claro.
  • 2:50 - 2:56
    Y ahora tenemos que el texto sólo sigue al mouse, justo como vimos con los rectángulos.
  • 2:56 - 3:02
    Ahora, como último y divertido truco, usemos la animacion y hagamos que el tamaño del texto crezca y crezca y crezca.
  • 3:02 - 3:06
    Vamos a configurar aquí textSize a 30. Como aprendimos en variables
  • 3:06 - 3:14
    en lugar de usar 30, también podemos decir: var howBig = 30; y usar esta variable en lugar del 30 directamente.
  • 3:14 - 3:20
    Bueno, eso es lo mismo y necesitamos, obviamente, estar cambiando algo para obtener una animación.
  • 3:20 - 3:25
    Podemos hacerlo diciendo howBig = howBig + 1
  • 3:25 - 3:32
    Que significa, si recuerdas, howBig contiene lo que era howBig mas uno para hacerlo un poco mas grande
  • 3:32 - 3:36
    Ahora sólo necesitamos reiniciar el programa y tenemos que
  • 3:36 - 3:40
    cuando movemos el mouse, textSize está creciendo y creciendo y creciendo y creciendo
  • 3:40 - 3:42
    Por esta línea de aquí.
  • 3:43 - 3:47
    Bien, por tí mismo pudieras pensar: bueno, ¿cómo podemos hacerlo crecer mas rápido?
  • 3:48 - 3:53
    Ahora no sólo sabes cómo manipular formas con código, si no que también puedes usar texto con código
  • 3:53 - 3:55
    también.
Title:
Texto Fantástico Parte 2
Description:

Esto es sólo una pantalla de nuestro curso de programación, preparado para facilitar el subtitulado y traducción. Es mejor ver nuestros cursos aquí:
https://www.khanacademy.org/cs/programming/

more » « less
Video Language:
English
Duration:
03:57

Spanish, Mexican subtitles

Revisions