LECCIÓN 1 C2 Processing
LECCIÓN 1 C2 Processing
2 Processing
"Las computadoras en el futuro pueden pesar no ms de 1,5 toneladas. "-Popular Mechanics, 1949
En este captulo:
- Opciones de men.
- Escribir cdigo.
- Errores.
- La Referencia de Processing.
- El botn "Reproducir".
- Tu primer dibujo.
Despus de leer este libro y aprender a programar, puede continuar usando Processing en su vida
acadmica o profesional como una herramienta para la realizacin de prototipos o para la
produccin. Tambin puede tomar los conocimientos adquiridos aqu y aplicarlos al aprendizaje de
otros lenguajes y entornos de creacin. Usted puede, de hecho, descubrir que la programacin no
es su taza de t; Sin embargo, aprender los fundamentos le ayudar a convertirse en un ciudadano
mejor informado en tecnologa mientras trabaja en proyectos en colaboracin con otros
diseadores y programadores.
Puede parecer un exceso hacer hincapi en el por qu con respecto al Processing. Despus de
todo, el foco de este libro est principalmente en aprender los fundamentos de la programacin
informtica, en el contexto de la computacin grfica y el diseo. Sin embargo, es importante
tomarse algn tiempo para reflexionar sobre las razones que hay detrs de la seleccin de un
lenguaje de programacin, para hacer un libro, una clase, para la asignacin de una tarea, para
una aplicacin web, una suite de software, etc. Despus de todo, ahora que se va a empezar a
llamar a s mismo programador de computadoras en fiestas, esta pregunta se le presentar una
y otra vez. Necesito la programacin para realizar el proyecto X? Qu lenguaje y entorno debo
usar?
Digo, sin sombra de duda, que para usted como principiante, la respuesta es Processing. Su
sencillez es ideal para principiantes. Al final de este captulo, estar listo y funcionando con su
primer diseo por ordenador y estar listo para aprender los conceptos fundamentales de la
programacin. Pero la simplicidad no es donde termina Processing, un viaje a travs de la
exposicin en lnea de Processing ([Link] ) descubrir una amplia
variedad de hermosos proyectos e innovadores desarrollados enteramente con Processing. Al
final de este libro, usted tendr todas las herramientas y el conocimiento que necesita para
tomar sus propias ideas y convertirlas en proyectos de software para el mundo real, como los
que se encuentran en la exposicin. Processing es grande tanto para el aprendizaje y como para
la produccin, hay muy pocos entornos y lenguajes de los que se pueda decir lo mismo.
Ver
Para asegurarse de que todo est funcionando, es una buena idea intentar ejecutar uno de los
ejemplos de Processing. Ir a ARCHIVO EJEMPLOS (escoja un ejemplo, sugerido: Temas
Dibujo Lneas continuas) Como se muestra en la Figura 2.2.
Una vez que haya abierto el ejemplo, haga clic en el botn "Ejecutar" como se indica en la Figura
2.3. Si una nueva ventana se abre, al abrir el ejemplo, todo est listo! Si esto no ocurre, visite el
FAQ en lnea "El Processing no comenzar! Para posibles soluciones. La pgina se puede
encontrar en este enlace directo: [Link]
Los programas de Processing tambin se pueden ver en pantalla completa (conocido como "modo
presentar" en Procesamiento). Esto est disponible a travs de la opcin de men: Sketch
Presentar (o haciendo clic en shift +botn Ejecutar o Ctrl+Mays+R). Presente no redimensionar
la resolucin de la pantalla. Si desea que el boceto cubra toda la pantalla, debe utilizar las
dimensiones de la pantalla en tamao ().
2.4 El Sketchbook
Los programas de Processing se denominan informalmente sketch = bocetos, en el espritu del
prototipo de grficos rpidos y emplearemos este trmino a lo largo de este libro. Tcnicamente,
cuando se ejecuta un sketch en Processing, se ejecuta como una aplicacin local en el equipo.
Como veremos tanto en este captulo como en el captulo 18, Processing tambin le permite
exportar sus bocetos como applets web (mini-programas que se ejecutan en un navegador) o
como aplicaciones independientes de plataforma (que podran, por ejemplo, estar disponibles
para su descarga). Una vez que haya confirmado que los ejemplos de Processing funcionan, estar
listo para empezar a crear sus propios sketches. Al hacer clic en el botn "nuevo" se generar un
nuevo sketch en blanco nombrado por la fecha. Es una buena idea "Guardar como" y crear su
propio nombre de sketch. (Nota: Processing no permite espacios ni guiones y el nombre del
sketch y no puede comenzar con un nmero).
Cuando se ejecut el Processing por primera vez, se cre un directorio "Processing "
predeterminado para almacenar todos los sketches en la carpeta "Mis documentos" en Windows
y en "Documentos" en OS X.
Aunque puede seleccionar cualquier directorio en su disco duro, esta carpeta es la que est como
predeterminada. Es una carpeta bastante buena para usar, pero se puede cambiar abriendo
Preferencias de Processing (que estn disponibles en el men ARCHIVO).
CARPETAS DE PROCESSING
Cada sketch de Processing consta de una carpeta (con el mismo nombre que su sketch) y un
archivo con la extensin pde. "Si su sketch de Procesamiento se llama MyFirstProgram, tendr
una carpeta denominada MyFirstProgram con un archivo [Link] dentro. El archivo
"pde" es un archivo simple de texto que contiene el cdigo fuente. Algunos sketches tambin
contendrn una carpeta llamada "datos"(data), donde se almacenan los elementos media
(audiovisuales) utilizados en el programa, como archivos de imagen, de sonido y as
sucesivamente,.
Ejercicio 2-3: Escriba algunas instrucciones del Captulo 1 en un sketch en blanco. Observe cmo se
colorean ciertas palabras. Ejecute el boceto. Hace lo que usted pens que hara?
Llamadas de funcin
Operaciones de asignacin
Estructuras de Control
Por ahora, cada lnea de cdigo ser una llamada de funcin. Consulte la Figura 2.4. Exploraremos
las otras dos categoras en futuros captulos. Las funciones tienen un nombre, seguido de un
conjunto de argumentos incluidos entre parntesis. Recordando el Captulo 1, usamos funciones
para describir cmo dibujar formas (las llamamos simplemente "comandos" o "instrucciones").
Pensando en la funcin como si fuera una oracin en un lenguaje natural, el nombre de la funcin
es el verbo ("dibujar") y los argumentos son los objetos ("punto 0,0") de la oracin. Cada llamada
de funcin siempre debe terminar con un punto y coma. Vea la Figura 2.5.
Lnea, Nombre de funcin, Argumentos entre parntesis, Finaliza con punto y coma
Ya hemos aprendido varias funciones, incluyendo background (), stroke (), fill (), noFill (), noStroke
(), Point (), line (), rect (), ellipse (), rectMode () y ellipseMode (). Processing ejecutar una
secuencia de funciones una por una y finalizar visualizando el resultado dibujndolo en una
ventana. Nos olvidamos de aprender una funcin muy importante en el captulo 1, la funcin size
().
Size () especifica las dimensiones de la ventana que va crear y toma dos argumentos, la anchura y
la altura. La funcin size () siempre debe ser la primera.
Abre
una ventana de 320 de anchura por 240 de altura .
Puede escribir "comentarios" en su cdigo. Los comentarios son lneas de texto que Processing
ignora cundo se ejecuta el programa. Debera usarlos como recordatorios de lo que significa el
cdigo, un error que va a arreglar o una lista de tareas para insertar, etc. Los comentarios en una
sola lnea se crean con dos barras diagonales, //. Los comentarios de varias lneas se marcan con
/ * seguido de los comentarios y terminan con * /.
Una palabra rpida sobre los comentarios. Usted debe adquirir el hbito ahora de escribir
comentarios en su cdigo. A pesar de que nuestros sketches sern muy simples y cortos al
principio, usted debe poner comentarios en todo. El cdigo es muy difcil de leer y entender sin
comentarios. No es necesario tener un comentario para cada lnea de cdigo, pero cuanto ms se
incluya, ms fcil ser revisar y reutilizar su cdigo ms tarde. Los comentarios tambin le obligan
a entender cmo funciona el cdigo mientras est programando. Si no sabes lo que ests
haciendo, cmo puedes escribir un comentario al respecto? Los comentarios no siempre se
incluirn en el texto aqu. Esto es porque veo que, a diferencia de un programa real, los
comentarios de cdigo son difciles de leer en un libro. En su lugar, este libro usar a menudo el
cdigo "sugerencias" para conseguir ms informacin y explicaciones. Si usted mira los ejemplos
del libro en el sitio Web, aunque, los comentarios sern incluidos siempre. Por lo tanto, no puedo
enfatizar lo suficiente, escriba comentarios!
Una pista
sobre este cdigo!
Ejercicio 2-4: Cree un bosquejo en blanco. Tome su cdigo del final del captulo 1 y
escrbalo en la ventana de Processing. Agregue comentarios para describir lo que est
haciendo el cdigo. Agregue una instruccin println () para mostrar texto en la ventana del
mensaje. Guarde el boceto. Pulse el botn "Ejecutar". Funciona o recibe un error?
2.6 Errores
El ejemplo anterior funciona slo porque no hemos cometido errores ningn error tipogrfico. En
el curso de la vida de un programador, esto es bastante raro. La mayora de las veces, nuestro
primera pulsacin del botn de reproduccin no ser un xito. Examinemos qu sucede cuando
cometemos un error en nuestro cdigo en la Figura 2.6.
La Figura 2.6 muestra lo que sucede cuando se tiene un "error", se escribi elipse en lugar de
"ellipse" en la lnea 9. Si hay un error en el cdigo, cuando se presiona el botn de reproduccin,
Processing no abrir la ventana del sketch y en su lugar mostrar un mensaje de error. Este
mensaje en particular es bastante suave, dicindonos que probablemente queramos escribir
"ellipse". "No todos los mensajes de error de Processing son tan fciles de entender y seguiremos
viendo otros errores a lo largo de este libro. Un apndice sobre los errores comunes en Processing
tambin se incluye al final del libro.
Processing distingue entre maysculas y minsculas (case sensitive). Si escribe Ellipse en lugar de
ellipse, tambin se considerar un error.
En este caso, slo hubo un error. Si se producen varios errores, Processing slo le alertar al
primero que encuentra (y presumiblemente, una vez corregido ese error, el siguiente error en
tiempo de ejecucin, se mostrar). Esto es una limitacin desafortunada, ya que a menudo es til
tener acceso a una lista completa de errores cuando se arregla un programa. Este es simplemente
uno de los compensaciones que se consiguen en un entorno simplificado como Processing.
Nuestra vida sera ms simple si slo tuviramos que atender a un error a la vez, sin embargo no lo
hacemos, no tenemos acceso a una lista completa.
Este hecho slo enfatiza la importancia del desarrollo gradual mencionado en la introduccin del
libro. Si slo llevamos a cabo una caracterstica a la vez, slo podemos cometer un error a la vez.
Ejercicio 2-5: Trate de cometer algunos errores a propsito. Son los mensajes de error que
esperas?
SOLUCIN
Ms o menos.
Las funciones que hemos demostrado: elipse (), lnea (), trazo (), etc., forman parte de la
biblioteca de Processing. Cmo sabemos que "ellipse" no se escribe "elipse", o que rect () toma
cuatro argumentos (una "coordenada x", una "coordenada y", una para la "anchura" y otra para la
"altura")? Muchos de estos detalles son intuitivos, y esto habla de la fuerza de Processing como un
lenguaje de programacin para principiantes. Sin embargo, la nica manera de saberlo con
certeza, es leyendo la referencia en lnea. Aunque abordaremos muchos de los elementos de la
referencia a lo largo de este libro, este libro no es de ninguna manera un sustituto a la referencia y
ambos sern necesarios para que usted pueda aprender Processing.
Como puede ver, la pgina de referencia muestra toda la documentacin de la funcin rect (),
incluyendo:
Parmetros: estos son los elementos que van dentro de los parntesis. Te dice qu tipo de datos
(Un nmero, un carcter, etc.) y lo que ese elemento representa. (Esto se ver ms claro cuando lo
exploremos ms en captulos futuros). A veces tambin se les llama "argumentos".
Return: A veces una funcin de nuevo le devuelve algo cuando usted la llama (por ejemplo, en
lugar de llamar a una funcin para que realice una tarea, como dibujar un crculo, podra pedir a la
funcin que agregue dos nmeros y le retorne la respuesta). Una vez ms, esto se aclarar ms
tarde.
Uso (usage)- Ciertas funciones slo estarn disponibles para procesar los applets de Processing
que publique en lnea ("Web"), y otras slo lo estarn mientras se ejecuta localmente Processing
en su mquina ("Aplicacin").
Mtodos relacionados: Es una lista de las funciones que a menudo suelen ser llamadas en
relacin con la funcin actual. Tenga en cuenta que las "funciones" en Java a menudo se
denominan "mtodos". Ms sobre esto en el Captulo 6.
-------------------------------------
CLOSE
-----------------------------------
El Processing tambin tiene una opcin muy til "Buscar en referencia". Haga doble clic en
cualquier palabra clave para seleccionarla y Vaya a AYUDA BUSCAR EN LA REFERENCIA (o
seleccione la palabra clave y pulse CNTRL+MAYS+ F).
SOLUCIN
SOLUCIN
2.8 El botn "Play"
Una de las buenas cualidades de Processing es que todo lo que uno tiene que hacer para ejecutar
un programa es presionar el botn "play". Es una metfora agradable y la representa es que nos
sentimos cmodos con la idea de ejecutar animaciones, pelculas, msica y otras formas de
comunicacin. Los programas de Processing dan una salida en forma de grficos informticos a
tiempo real de computadora, por qu no ejecutarlos ya mismo?
Sin embargo, es importante parar un momento y reflexionar sobre el hecho de que lo que estamos
haciendo aqu, no es lo mismo que lo que sucede en un iPod o TiVo. Los programas de Processing
comienzan como texto, se traducen a cdigo de mquina y luego se le da al play para que se
ejecuten. Todos estos pasos suceden en secuencia cuando se presiona el botn de reproduccin.
Vamos a examinar estos pasos uno por uno de una forma relajada sabiendo que Processing hace el
trabajo duro por nosotros.
Paso 1. Traducir a Java. Processing realmente es Java (esto se ver ms claro cuando lo tratemos
detalladamente en el Captulo 23). Para que el cdigo funcione en su mquina, primero debe
traducirse a cdigo Java.
Paso 2. Compilar a cdigo Java en bites. El cdigo Java creado en el paso 1, es slo otro archivo de
texto (con la extensin .java en lugar de .pde). Para que el ordenador lo entienda, necesita ser
traducido a lenguaje mquina. Este proceso de traduccin se conoce como compilacin. Si
estuviera programando en un lenguaje diferente, como C, el cdigo se compilara directamente en
lenguaje de mquina especfico a su sistema operativo. En el caso de Java, el cdigo se compila en
un lenguaje de mquina especial conocido como cdigo Java en bites. Puede funcionar en
diferentes plataformas (Mac, Windows, telfonos mviles, PDA, etc.) siempre y cuando la
mquina est ejecutando un "Servidor Virtual de Java (Java Virtual Machine). A pesar de que
esta capa extra a veces puede hacer que los programas se ejecuten un poco ms lentos que de
otra forma, el hecho de ser multiplataforma es una gran caracterstica de Java. Para ms
informacin sobre cmo funciona esto, visite [Link] o plantese repasar un libro
sobre programacin en Java (despus de haber terminado ste).
Los ejemplos seguirn la historia de nuestro nuevo amigo Zoog, comenzando con una
representacin esttica con formas simples. El desarrollo de Zoog incluir interaccin, movimiento
y clonacin de una poblacin de muchos Zoogs. Aunque usted no est obligado a hacer todos los
ejercicios de este libro con su propia forma extraterrestre, sugiero que comience con un diseo y
despus de cada captulo, ample la funcionalidad de ese diseo con los conceptos de
programacin que se exploren. Si a usted no le cuesta crear nuevas ideas, entonces dibuje su
propio pequeo extraterrestre, llmelo Gooz y progrmelo! Vase la figura 2.8.
Su cerebro absorber como una esponja la sintaxis y la lgica al escribirlo y usted aprender
mucho cometiendo errores a lo largo del camino. Por no hablar de que al ejecutar simplemente el
sketch, despus de cargar cada nueva lnea de cdigo, eliminar cualquier misterio sobre cmo
funciona el sketch. Lo entender mejor cuando est listo para copiar / pegar. Lleve un registro de
su progreso y si empieza a ejecutar muchos ejemplos y empieza a perderse y a no entender cmo
funcionan, pruebe a escribirlo de nuevo manualmente.
Ejercicio 2-9: Usando lo que dise en el Captulo 1, implemente su propio dibujo de pantalla,
Utilizando slo formas primitivas 2D: arc (), curve (), elipse (), line (), point (), quad (), rect ()
Triangulo (), y funciones bsicas de color: background (), colorMode (), lleno (), noFill () NoStroke ()
y stroke (). Recuerde utilizar size () para especificar las dimensiones de su ventana. Sugerencia:
Reproduzca el sketch despus de escribir cada nueva lnea de su cdigo. Corrija cualquier error o
error tipogrfico por el camino.
2.10 Publicar su Programa
Una vez que haya completado un boceto de Processing, puede publicarlo en la web como un
applet de Java. Esto ser ms emocionante una vez que estamos haciendo applets animados
interactivos, pero es bueno practicar con un ejemplo simple. Una vez que haya terminado el
ejercicio 2-9 y haya determinado que su croquis funciona, seleccione Archivo/Exportar
Aplicacin
Tenga en cuenta que si tiene errores en su programa, no exportar correctamente, por lo que
siempre pruebe ejecutndose primero.
[Link] -La fuente HTML para una pgina que muestra el applet.
[Link] -Una imagen que se mostrar mientras el usuario carga el applet (Processing
proporcionar uno predeterminado, pero puede crear el suyo propio).
[Link] - El cdigo fuente de Java traducido (se parece a su cdigo de Processing, pero tiene
algunos osas extras que Java requiere. Vea el Captulo 20 para ms detalles.)
Para ver el funcionamiento del applet, haga doble clic en el archivo "[Link]" que debera
iniciar una pgina en su navegador web predeterminado. Vea la Figura 2.10. Para obtener el
applet en lnea, necesitar espacio en el servidor web y software FTP (o tambin puede usar un
sitio de intercambio de bocetos de procesamiento, como [Link] ). Puede
encontrar algunos consejos para empezar en el sitio web de este libro.
-Exportar aplicacin te permite exportar tu sketch como aplicacin de escritorio para Windows,
Mac Os X o Linux. Cuando elegimos la opcin exportar aplicacin se nos abre un men donde
podemos indicar para qu plataforma queremos exportar Windows, Mac Os X o Linux. Tambin
nos da la opcin si queremos que la aplicacin se reproduzca a pantalla completa. Para
asegurarnos que la aplicacin correr en el ordenador del cliente, Processing nos da la opcin de
incrustar Java con nuestro programa. Slo en Mac Os X*.
Nota: En esta versin 3.2.3 ya existe esta opcin tambin para Windows.
Ejercicio 2-10: Exporte su sketch como un applet. Ver el boceto en el navegador Cmo se
hace esto? (ya sea localmente (hecho) o cargndolo). 00002 00002