Translate

jueves, 14 de febrero de 2013

Primeros pasos con TouchOSC

Hola chicos!
Me he puesto a investigar sobre TouchOSC, la aplicación que nos permite comunicar con Arduino desde nuestro Iphone y... ¡la verdad que me ha sorprendido!, es realmente fácil de aprender a usar...así que os he preparado un nuevo tutorial para aprender a utilizarlo:
Empezamos por lo que necesitamos

Hardware necesario

     - Buzzer.
- Pc.
- Arduino Uno R3.
- Placa protoboard.
- Cables de protipado + cable USB.
Iphone.
- Red con Wifi.
   
Software necesario

Software Arduino: http://arduino.cc/en/Main/Software.
Software Processing: http://processing.org/download/.
Librería oscP5 para Processing:   http://www.sojamo.de/libraries/oscP5/
- Software TouchOSC Editor para PC:http://hexler.net/software/touchosc.
- Aplicación TouchOSC para Iphone:http://hexler.net/software/touchosc.

Parte 1: Manos a la obra

Una vez instalado todo, haremos el siguiente montaje, que como podéis comprobar es el mismo del anterior tutorial:


Sin embargo, el código que le programaremos al Arduino en este tutorial será completamente diferente. Una vez hayamos hecho el montaje, conectamos el Arduino al PC, vamos al IDE, e insertamos el siguiente código:

//////////////////////////////////////////////
/// www.opiron.com                         //
// by A.Girod                             //
// Haciendo "cantar" a un buzzer         //
//////////////////////////////////////////

int mensaje = 0;   
int actuar = 0;      

void setup() {  
  //Configuramos el puerto a 9600baud
  Serial.begin(9600);  
}

void loop(){
    //Miramos si hay un nuevo mensaje y lo leemos
    if (Serial.available()); { 
      mensaje = Serial.read();    
   //  Si el mensaje recibido es 1....
   if (mensaje == '1'){  
     actuar = 255;
   }
   //Si el mensaje recibido es 0...
   if (mensaje == '0'){  
     actuar = 0;
   }
 }
 // Escribo en el puerto 11 la variable "actuar"
 analogWrite(11, actuar);
}
Para comprobar que funciona el código, abrimos el serial monitor y escribimos "1" para hacer sonar el buzzer y "0" para apagarlo...¿Funciona? Bien!
  
Parte 2: Instalación de TouchOSC Editor

Oki, oki, oki...ya hemos visto que nos funciona el Buzzer con Arduino, vamos a entrar en materia con TouchOSC. Omito la instalación de la aplicación para Iphone que tenéis que hacer. Además de la aplicación, tenéis que descargaros el TouchOSC Editor para PC. Os dejo el link: http://hexler.net/software/touchosc
Vamos a la sección de descargas del enlace y nos bajamos la versión en función del S.O que tengamos:




Se nos descargará un archivo .zip. Para instalarlo, simplemente lo descomprimimos allá donde queramos.


En nuestro caso, lo descomprimimos en C:\. Luego abrimos el programa, que tiene una pinta como esta:


El menú que nos queda a la izquierda nos sirve para configurar la plantilla que luego veremos en el Iphone, podemos configurar las siguientes opciones:
- El tamaño, según se trate de una pantalla tipo Iphone(Ipod)o Ipad.
- La orientación: Vertical / Horizontal.


Parte 3: Creación de la plantilla

Una vez instalado y haber visto algunos aspectos generales del software, vamos a crear la plantilla que nos servirá de interfaz para comunicar el Iphone con nuestro Arduino. Vamos a crear un botón que haga las funciones de control, nos movemos con el cursor dentro del área oscura y con el botón derecho seleccionamos el botón "Push Button"
El aspecto que tendrá nuestra plantilla será como el de la figura:
Vemos el botón de color rojo en la parte de la pantalla...así de fácil. Esta es la plantilla que usaremos para comunicarnos con el Iphone al Arduino! La guardamos..y listo.


Parte 4: Establecer comunicación entre Iphone y PC.

Ahora lo que haremos es poner las bases para poder comunicarnos con TouchOSC. Primero vamos a ver qué IP tenemos en el PC. Para ello vamos al menú de inicio de Windows  y escribimos "cmd" , y le damos clic. Dentro de cmd, tecleamos "ipconfig" y nos aparecerá la ip de nuestro pc, como ejemplo pongo esta imagen:
La ip de mi pc es 192.168.0.3..
Abrimos la aplicación en el Iphone. Lo primero que tenemos que hacer es decir a qué host nos queremos comunicar, es decir nuestro PC. Vamos a la parte de arriba donde pone "Connections" y luego allí le entramos la IP de nuestro PC dónde pone "Host".  Pon también las opciones "Port (outgoing): 8000" y "Port (incoming): 9000". Si os fijáis, más abajo veis también la Ip que tiene nuestro Iphone -192.168.0.4-. Resumiendo, quedaría algo así:

Vamos a la sección donde pone Layout:

Y dentro le damos a "Add":

 


Desde el PC, en el TouchOSC editor le damos a Sync . En el Iphone veremos como el PC (host), trata está en la red WiFi:
Una vez aquí, le damos al Host que nos encuentre y nos podremos descargar la plantilla. Luego desde el menú ya la podemos seleccionar.

Parte 5: Empezando a jugar

Ahora ya estamos listos para empezar a jugar con nuestro Iphone, pero primero copiemos el siguiente código en el entorno de Processing:


/* Opiron Electronics
  Comunicación entre Iphone y Arduino con TouchOSC
  
  - haciendo cantar un buzzer
    
  by Anton Girod (girodanton@gmail.com)
  basado en el trabajo de Andreas Schlegel (http://www.sojamo.de/libraries/oscP5/)
           
  licenciado bajo Creative Commons BY-SA     
*/

// Importo la libreria oscP5
import oscP5.*;          
import netP5.*;

// Creo el objeto oscP5
OscP5 oscp5;
// La variable pulsar se activa cuando pulso sobre mi Iphone
int pulsar;  
// La variable actuar pinta el color sobre la pantalla y le dice a Arduino que pite el buzzer
int actuar;  
void setup() {
  // tamaño de la pantalla en el PC
  size(100,100);
  // Inicio el objeto oscP5 y le digo que los mensajes me llegan por el puerto 8000
  oscp5 = new OscP5(this,8000);  
}

void draw() { 
  if (pulsar==0){ // si boton no apretado
    actuar=0;     // ni pinto ni hago sonar el buzzer
  }
  if (pulsar==1){  // si boton apretado
    actuar=255;    // pinto y hago sonar el buzzer
  }
  fill(actuar,0,actuar);      // Pinto segun el estado de "actuar" a rosa
  rect(30, 20, 55, 55);      // en un rectangulo
}

// Esta función es usada para "escuchar" los mensajes con protocolo OSC
void oscEvent(OscMessage theOscMessage) {
  String addr = theOscMessage.addrPattern();  //  Creamos una string del mensaje OSC
      pulsar  = int(theOscMessage.get(0).floatValue());     // Guardo la order recibida desde mi Iphone en "pulsar"
}

El código anterior hará que, dándole al "Push button" desde nuestro Iphone, coloreemos un rectángulo a nuestro PC.  Una vez ejecutemos el código en Processing, y hayamos abierto la plantilla desde el Iphone, veremos el siguiente rectángulo:

Cuando le demos al "Push Button" el rectángulo cambiará de color:


¡Funciona! ¡Mientras mantenemos pulsado el “push button”, el rectángulo pasa a rosa!

Parte 6: Tocar el buzzer desde el Iphone

En esta última parte solo nos falta hacer que suene el buzzer, para ello, copiamos y pegamos el código siguiente  de la sección código en el IDE de Processing:

/* Opiron Electronics
  Comunicación entre Iphone y Arduino con TouchOSC
  
  - haciendo cantar un buzzer
    
  by Anton Girod (girodanton@gmail.com)
  basado en el trabajo de Andreas Schlegel (http://www.sojamo.de/libraries/oscP5/)     
*/


// Importo la libreria oscP5
import oscP5.*;          
import netP5.*;

// Importamos la serial library para comunicarnos con Arduino
import processing.serial.*;    


// Creo el objeto oscP5
OscP5 oscp5;

// Creo puerto arduino
Serial parduino;
  
// La variable pulsar se activa cuando pulso sobre mi Iphone
int pulsar;  
// La variable actuar pinta el color sobre la pantalla y le dice a Arduino que pite el buzzer
int actuar; 

void setup() {
  // tamaño de la pantalla en el PC
  size(100,100);
// Inicio el objeto oscP5 y le digo que los mensajes me llegan por el puerto 8000
  oscp5 = new OscP5(this,8000);  
  //Configuro el puerto a 9600 baudios
  parduino = new Serial(this, Serial.list()[0], 9600); 
}

void draw() { 
  if (pulsar==0){ // si boton no apretado
    parduino.write("0");    
    actuar=0;     // ni pinto ni hago sonar el buzzer
  }
  if (pulsar==1){  // si boton apretado
    parduino.write("1");    
    actuar=255;    // pinto y hago sonar el buzzer
  }
  fill(actuar,0,actuar);      // Pinto segun el estado de "actuar" a rosa
  rect(30, 20, 55, 55);      // en un rectangulo
}

// Esta función es usada para "escuchar" los mensajes con protocolo OSC
void oscEvent(OscMessage theOscMessage) {
//  Creamos una string del mensaje OSC
  String addr = theOscMessage.addrPattern();  
// Guardo la order recibida desde mi Iphone en "pulsar"
  pulsar  = int(theOscMessage.get(0).floatValue());     
}
Y…si todo ha ido bien, veréis como además de colorear el rectángulo cuando pulsamos el botón desde el Iphone, también suena el Buzzer!
Os dejo además un  pequeño video tutorial resumen:
Enlace a youtube:
http://www.youtube.com/watch?v=dfYzdaCOxw8&feature=youtu.be

2 comentarios:

  1. yo lo estoy haciendo para la version de android y no me encuentra ningun host y no sale ninguna pestaña de ADD. Alguna solucion?

    la ip que pongo es la correcta, por cierto.

    ResponderEliminar
  2. Hola Manuel,
    No tenemos la aplicación para Android, pero aún así, podrías verificar algunas de las siguientes opciones:
    1- Dentro de Options, asegúrate de tener en "ON" la opción "Stay Connected".
    2- Si tienes alguna maquina virtual instalada en tu PC, deshabilita los adaptadores de red, a veces dan problemas (dentro de la Administrador de dispositivos / Adaptadores de red).
    3- Si tienes otro PC o alguna tablet por ahí, prueba si te funciona. Si es así, podrías verificar si hay alguna cosa que cambie respecto a la configuración con tu otro PC.
    Te agradeceremos que nos compartas tanto si te ha funcionado o no con la información que te pasamos.

    ResponderEliminar