Versión Alfa 0.

07 Tutorial

(Visual C#, C++, VB .Net, VB 6 y Java)

•
Versión Alfa 0.07
Esta versión la puedes distribuir si lo deseas aunque no es recomendable.
• Falta integrar muchas cosas de electrónica y otras ideas como una interfaz solo en
líneas de comando con VB .net 2013, C# y C++.
• Se ha añadido de Java.
• Estoy pendiente si se hace la versión de VB 6.
• Una interfaz completa preparado para 8 relés.
• Muchas fotos y vídeos de la interfaz y Arduino UNO.
• Aquí ya subí un vídeo de prueba en youtube.
• [Link]
• Cualquier información visitar: [Link]
• Ya que será publicado y con sus ejemplos por aquí.
• Saludos.

[Link] 11/04/2015 2
 Índice 1 / 2
• Presentación
• ¿Qué necesitamos?
• Configurar Arduino UNO
• Esquema boceto
• Programación Arduino IDE
• Referencia colores
• Módulo de 8 relés
• Tabla ASCII
• Ejemplo 2 Arduino y relés
• Visual C# 2013
• WPF C# 2013
• Visual Basic 2013
• WPF VB 2013
• Visual C++ 2013
• Visual Basic 6
• Java

[Link] 11/04/2015 3
 Índice 2 / 2
• Extras
• Fotos
• Vídeos
• Libro
• Otros tutoriales
• Enlaces de Interés
• Interfaz EP
• Versión del tutorial
• Colaboradores
• Contacto
• Donaciones
• Autor

[Link] 11/04/2015 4
[Link] 11/04/2015 5
 Presentación

[Link] 11/04/2015 6
 Presentación
• Este tutorial está pensado para personas con cierto grado de nociones muy básicas
sobre electrónica y programación. Al mismo tiempo, podrás crear tu propia interfaz paso
a paso sabiendo poco o casi nada de programación tanto de Visual Studio o Java como
en Arduino.
• Nos centraremos en crear una pequeña interfaz con Visual Studio .Net Express 2013
capaz de controlar un módulo de 8 relés con Arduino.
• También leer entradas digitales en nuestra propia interfaz. Por supuesto haremos
entradas analógicas con un potenciómetro y sensores de temperatura.
• Se usará un display LCD HD44780 para ver los estados de los relés o más información.
• Con este sistema podemos controlar cargas muy altas a 250 VAC como bombillas,
motores AC, ventiladores AC, entre otras cosas como, activar un altavoz como alarma,
controlar depósito de agua, activar cámaras de vigilancia, abrir y cerrar ventadas
domotizadas, control automático de regadío y un largo etc.

[Link] 11/04/2015 7
 Presentación
• Comprobarás que este tutorial se centra en crear tu propia interfaz den
diversos lenguajes y formatos.
• Eliges tu lenguaje favorito sea C#, C++, VB .net, VB 6 e incluso Java.
• En cuanto al formato, puedes usar el modo Visual o modo consola o líneas
de comando.
• En el futuro, puede que haya más lenguajes si hay demanda. Puedes
decirme cual prefieres y el motivo.
• En este tutorial trabajaremos bajo el Sistema Operativo Windows 7 de 64
bits.
• Ánimos y adelante…

[Link] 11/04/2015 8
[Link] 11/04/2015 9
 ¿Qué necesitamos?

[Link] 11/04/2015 10
 ¿Qué necesitamos?

• Antes de trabajar en algo, hay que tener claro desde el principio que
necesitamos realmente tanto en Hardware como en Software.
Controlaremos con una Interfaz desde el PC con Arduino UNO r3 por
USB un módulo de 8 relés en el cual manejamos dispositivos de
diferente potencial.

[Link] 11/04/2015 11
 ¿Qué necesitamos?

• Arduino UNO r3.

• Puedes usar Arduino el que dispongas.
• Escojo esta versión porque es el más
usado y el más que tiene la mayoría gente
a escala mundial para empezar.

[Link] 11/04/2015 12
 ¿Qué necesitamos?

• Módulo de 8 relés de 5 VDC / 250 AC.

[Link] 11/04/2015 13
 ¿Qué necesitamos?

• Cables macho hembra.

[Link] 11/04/2015 14
 ¿Qué necesitamos?

• Algún transformador o fuente alimentación

de 5 Vdc, 2 A.

[Link] 11/04/2015 15
 ¿Qué necesitamos?

• Casi cualquier protoboard.

• En este caso no obligatorio, si en este
tutorial para hacer algunas pruebas.

[Link] 11/04/2015 16
 ¿Qué necesitamos?

• Algunos Led y resistencias que pueden ser

330 Ohmios o 220 Ohmios.

[Link] 11/04/2015 17
 ¿Qué necesitamos?

• Un LCD Keypad Shield en mi caso DF

Robot y 16x2 o el que muestra en la página
siguiente.

[Link] 11/04/2015 18
 ¿Qué necesitamos?

• Este LCD 20x4 HD 44780 de Hitachi.

• Si queremos hacer 8 entradas digitales, 8
salidas digitales o mediante relés, algunas
entradas analógicas, es la mejor opción ya
que muestra más información.
• En este tutorial usaremos pequeños
ejemplos tanto del LCD Keypad Shield
16x2 de DF Robot como el 20x4.

[Link] 11/04/2015 19
 ¿Qué necesitamos?

• Descargar Arduino IDE.

• [Link]

[Link] 11/04/2015 20
 ¿Qué necesitamos?

• Visual Studio Express 2013.

• Descargar Express 2013 para escritorio
de Windows. (En español).
• [Link]
es/products/[Link]
• También vale versiones 2005, 2010, 2012,
2013 y la Preview 2015 que veremos en
Extras.

[Link] 11/04/2015 21
 ¿Qué necesitamos?
• Quizás le interese tener preparado este
manual que si lo desea, puede mejorar tu
interfaz un poco más detallado y completo
como poner un reloj, hacer tu interfaz
transparente y otras más opciones.
• [Link]
[Link]/2008/11/electrnica-
[Link]
• A partir de la página 203 puedes leer los
extras. Sólo hay ejemplos para Visual C#.
• Este tutorial fue el primero que creé sobre
puertos series con Visual Studio .net en el
2008.
[Link] 11/04/2015 22
 ¿Qué necesitamos?

• Librería RXTX para Java con su página oficial. (La que usamos en este
tutorial y de 32 bits).
• [Link]
[Link] 11/04/2015 23
 ¿Qué necesitamos?

• Librería RXTX para Java alternativa de la página

oficial de 32 bits y 64 bits actualizado.
•
[Link]
[Link]
11/04/2015 24
 ¿Qué necesitamos?

Descarga
• Puedes descargar de entrada todos los • Fuente
ejemplos y lenguajes.
• Fuente
• Se recomienda primero leer este tutorial
antes de ver los ejemplos.
• Luego haz tu propio diseño de la interfaz.

[Link] 11/04/2015 25
[Link] 11/04/2015 26
 Configurar Arduino UNO

[Link] 11/04/2015 27
 Configurar Arduino UNO

• Accedemos a la Web [Link] y

hacemos clic en “Donwload”. En mi caso
he descargado la versión “Windows
Installer”.

[Link] 11/04/2015 28
• Una vez ya descargado e instalado vamos
a configurar la palca en Arduino UNO.
Antes que nada, enchufa el cable USB al
PC, la placa de Arduino UNO y luego
ejecutas la Arduino IDE en este caso la
versión es 1.6.0 desde que escribí este
tutorial.
• Pulsas “Herramientas  Placa  Arduino
UNO”.

[Link] 11/04/2015 29
• Nos aseguramos que tengas el puerto
correspondiente de Arduino.
• En este caso es el puerto COM4.

[Link] 11/04/2015 30
• Para saber que todo está en orden
abriremos uno de los ejemplos y famoso
parpadeo del Led 13 que te viene incluido
en la placa Arduino UNO.
• Pulsa “Archivo Ejemplos  [Link] 
Blink”.

[Link] 11/04/2015 31
 Configurar Arduino UNO
void setup() {
pinMode(13, OUTPUT); // Inicializa pin 13 como salida
digital.
}
// Aquí se repite el cliclo una y otra vez.
void loop() {
digitalWrite(13, HIGH); // Led encendido.
delay(1000); // Retardo de un Segundo.
digitalWrite(13, LOW); // Led se apaga;
delay(1000); // Espera un Segundo.
}

[Link] 11/04/2015 32
 Configurar Arduino UNO
• Está más que verificado este código. Pulsa
“Subir” para compilar el código y guardarlo
en Arduino.
• Si no has pulsado “Verificar” antes de
compilar verifica código, compila y lo
guarda en el AVR de Arduino.
• Abajo de Arduino IDE 1.6.0 aparecerá
cualquier información como cantidad de
datos usados en portentajes, incluido
errores entre otras cosas.

[Link] 11/04/2015 33
 Configurar Arduino UNO

• Fíjate que el Led 13 donde indica la flecha

roja está parpadeando.

[Link] 11/04/2015 34
[Link] 11/04/2015 35
 Esquema boceto

[Link] 11/04/2015 36
 Esquema boceto

• Tal como muestra en la imagen, usaremos

una resistencia de 330 Ohmios y un diodo
Led rojo conectado a Arduino UNO r3 de
los pines GND y el pin 8.
• Si tienes dudas, antes de montar el
circuito, pasa a la página siguiente.

[Link] 11/04/2015 37
 Esquema boceto

• Muestra el diodo Led y su simbología.

• El pin más corto es el Cátodo, también se
escribe con K, Kátodo, es el negativo del
Led.
• Si se encuentran un Led con los pines
cortados de igual medida, hay que fijarse
en la muesca que representa el Cátodo del
Led.

[Link] 11/04/2015 38
[Link] 11/04/2015 39
 Programación Arduino IDE

[Link] 11/04/2015 40
 Programación Arduino IDE
char caracter;
String comando;
void setup(){
pinMode(8, OUTPUT); // Configuramos el pin 8 como salida.
[Link](115200); // Iniciamos el puerto serie a 115200 baudios.
}
void loop(){ // Leemos carácter a carácter lo que recibimos por el puerto serie y
concatenamos uno a uno a formar una cadena.
while ([Link]()>0){
caracter= [Link]();
[Link](caracter);
delay(10);
}

• Escribimos el código.
/* Cuando tengamos la cadena acabada, comprobamos el valor aquí abajo. Si no se
encuentra, lo ignorará. Ya podemos encender un Led, motores, ventiladores, bombillas y
otros dispositivos que tengamos conectado mediante relés o otros medios. */

• Este pequeño código permite leer por el if ([Link]("Led_ON") == true){ // Si en la cadena de caracteres se incluye la
palabra “Led_ON”.
puerto USB que en realidad es puerto serie digitalWrite(8, HIGH); // Enciende el Led.
[Link]("Led encendido.");
}
emulado para apagar y encender un Led.
if ([Link]("Led_OFF")== true){ // Si en la cadena de caracteres se incluye la
palabra “Led_OFF”.
digitalWrite(8, Low); // Apaga el Led.
[Link]("Led apagado.");
}
comando=""; // Limpiamos la cadena para volver a recibir el siguiente comando.
}

[Link] 11/04/2015 41
 Programación Arduino IDE

• Al crear un archivo nuevo viene así

predeterminado.

[Link] 11/04/2015 42
 Programación Arduino IDE

• Escribimos el código como muestra en la

imagen.
• Teniendo Arduino UNO conectado con el
cable USB pulsamos el botón “Subir” y
grabamos nuestro programa.

[Link] 11/04/2015 43
 Programación Arduino IDE

• Pulsamos el botón “Monitor Serie” para

enviar comandos.

[Link] 11/04/2015 44
 Programación Arduino IDE

• 1º) poner los baudios a 115200 como

tenemos en el programa en Arduino IDE.
• 2º) Introducir los comandos Led_ON para
encender el Led y Led_OFF para apagar,
luego pulsas “Enviar”.

[Link] 11/04/2015 45
 Programación Arduino IDE

• Muestra el mensaje:
“Led encendido.”.
• Luego pruebas con el
comando Led_OFF.
• Si funciona, estamos
preparado para hacer
la interfaz bajo
Windows, Linux u otro
Sistema Operativo.

[Link] 11/04/2015 46
[Link] 11/04/2015 47
 Referencia colores
Colores en cada lenguaje de programación Visual Studido .net

[Link] 11/04/2015 48
 Referencia colores
• A lo largo de este tutorial o guía, verán
colores en sus marcos de las imágenes
como indica en la derecha.
• Por ejemplo: El color verde indica que
estás en la zona de C#.
• C# se muestra color verde.
• VB se muestra color azul.
• C++ se muestra color naranja.
• VB 6 se muestra de color azul fuerte.
• Java de muestra de color rojo.
• Simplemente es bueno saberlo para
orientarte a la primera.

[Link] 11/04/2015 49
[Link] 11/04/2015 50
 Tabla ASCII
Será necesario a la hora de introducir comandos a dispositivos

[Link] 11/04/2015 51
[Link] 11/04/2015 52
[Link] 11/04/2015 53
 Visual C# 2013
Aplicación de Windows Forms con FrameWork 4.5

[Link] 11/04/2015 54
 Visual C# 2013

En este caso estoy trabajando bajo

Windows 7 de 64 bits y Visual Studio
Express 2013.

[Link] 11/04/2015 55
 1) Insertar 4 botones para dos Led, uno del pin 8 y
el otro del pin 13 que ya viene incorporado en la
placa Arduino UNO.
2) Insertar label o etiquetas.
Objetivo: 3) Insertar un componente RichTextBox en el
Diseñar una pequeña interfaz desde
formulario para recibir mensajes desde Arduino.
cero. 4) Insertar y configurar el componente o objeto
serialPort1.
5) Enviar comandos con los botones desde la
Interfaz que creamos hacia Arduino.
6) Recibir mensajes desde Arduino.

[Link] 11/04/2015 56
 Visual C# 2013

• Antes que nada, si ya tenemos Visual

Studio Express 2013 instalado, bajos a la
barra de herramientas arriba y pulsamos
“HERRAMIENTAS  Opciones”.

[Link] 11/04/2015 57
 Visual C# 2013

• Aparecerá la ventana “Opciones”.

• En él seleccionamos “Editor de texto” 
“C#”  “Número de línea”, así sabremos
las líneas de nuestro código.
• Luego pulsas “Aceptar” para confirmar.

[Link] 11/04/2015 58
 Visual C# 2013

• Crearemos un proyecto nuevo.

• Pulsamos “ARCHIVO”  “Nuevo
proyecto…”.

[Link] 11/04/2015 59
 Visual C# 2013

• Vemos en esta ventana los

pasos a seguir en la imagen.
• El nombre que he creado en el
paso 3º lo he llamado
InterDuinoCS.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 60
 Visual C# 2013

• Muestra el formulario donde

configuramos las propiedades
e incluimos botones más
seguimos con los códigos de
programación.

[Link] 11/04/2015 61
 Visual C# 2013

Propiedades
• Fijándonos en la página anterior. Propiedad Cambie a
Cambiamos las propiedades del formulario Text InterDuinoCS
tal como muestra aquí.
(Name) Form_Principal
StartPosition CenterScreen
Size 300; 300

[Link] 11/04/2015 62
 Visual C# 2013

• En el “Cuadro de
herramientas”, seleccionamos
“Controles comunes”, luego
encontramos el objeto llamado
“Button” y lo arrastramos al
formulario.

[Link] 11/04/2015 63
 Visual C# 2013

• Colocamos más botones y lo

colocamos más o menos como
muestra la imagen.
• Luego arrastramos el objeto
RichTextBox en el cuadro, aquí
nos llegará los mensajes de
textos como en el “Monitor
Serie” desde Arduino.

[Link] 11/04/2015 64
 Visual C# 2013

• Seleccionamos el RichTextBox,
buscamos la propiedad Dock y
pulsamos abajo marcado como
indica en la imagen.
• Para que vaya ocupar el
espacio de abajo. Si se queda
estrecho, solamente estira un
poco la parte de arriba.

[Link] 11/04/2015 65
 Visual C# 2013

Propiedades
• En cada botón configuramos las Propiedad Cambie a
propiedades. Text ON
• No olvidar que seleccionamos el primer (Name) button_Led_8_ON
botón, así con cada uno de ellos.

[Link] 11/04/2015 66
 Visual C# 2013

Propiedades
• En los dos últimos botones, lo mismo pero Propiedad Cambie a
con el Led 13 y quedaría así para el ON, Text OFF
button_Led_13_ON y para el OFF o
apagado del Led button_Led_13_OFF. (Name) button_Led_8_OFF

[Link] 11/04/2015 67
 Visual C# 2013

• Introducimos un label y en la
propiedad “Text” le ponemos
“Mensaje desde Arduino”.
• La mini interfaz va tomando
forma.

[Link] 11/04/2015 68
 Visual C# 2013

• Seleccionamos la pestaña que

dice “[Link]”.
• Pulsa el segundo botón del
ratón en el formulario nuestro y
luego “Ver código”.
• Aquí ya podemos introducir
códigos.

[Link] 11/04/2015 69
 Visual C# 2013

• Para la comunicación con los puertos,

usamos este using como muestra en
la imagen.
• Escribimos:
• using [Link]; // No olvidar.

[Link] 11/04/2015 70
 Visual C# 2013

• Introduciremos un trozo de
código que al iniciar la
aplicación automáticamente
abre el puerto.
• Si el puerto está ocupado,
aparecerá un mensaje de
error.

[Link] 11/04/2015 71
 Visual C# 2013

[Link] 11/04/2015 72
 Visual C# 2013

• Pulsa en la pestaña
“[Link][Diseño] para volver
al formulario.
• En el “Cuadro de
herramientas” selecciona
“Componentes” y haz doble
clic con el ratón al objeto o
componente “SerialPort”.

[Link] 11/04/2015 73
 Visual C# 2013

• Selecciona el componente
“serialPort1”, en este caso
cambiamos los baudios a
115200 tal como lo tenemos
programado en Arduino y en
mi PC me tocó el puerto
COM4.
• Mirar página siguiente.

[Link] 11/04/2015 74
 Visual C# 2013

• Para saber que puerto

estamos usando con Arduino.
• Entras desde Windows “Inicio
 Panel de control\Todos los
elementos de Panel de
control\Sistema”.
• Luego pulsas “Administrador
de dispositivos”.

[Link] 11/04/2015 75
 Visual C# 2013

• En mi caso, se usa y usaremos

el puerto COM4.
• Sabiendo el puerto a usar, ya
podemos cerrar la ventana
“Administrador de
dispositivos”.

[Link] 11/04/2015 76
 Visual C# 2013

Propiedades
• Siguiendo el camino, cambiamos las Propiedad Cambie a
propiedades como indica en el cuadro si no BaudRate 115200
lo ha hecho ya.
PortName COM4

[Link] 11/04/2015 77
 Visual C# 2013

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 78
 Visual C# 2013

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 79
 Visual C# 2013

Recordar que los comandos que

hemos programado para el Led
del pin 8 se llama Led_8_ON
para encender y para apagar
Led_8_OFF.
Este es el trozo de código a
insertar para el primer botón para
encender el Led del pin 8.
Aunque lo he llamado Led 8.

[Link] 11/04/2015 80
 Visual C# 2013

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 81
 Visual C# 2013

Ahora añadimos el mismo código

para el segundo botón con el
comando Led_8_OFF, así
podremos apagar el Led.

[Link] 11/04/2015 82
 Visual C# 2013

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 83
 Visual C# 2013

• Cerramos Arduino IDE para

dejar el puerto COM4 libre.
• Podemos directamente pulsar
F5 para ejecutar la aplicación o
nuestro programa.

[Link] 11/04/2015 84
 Visual C# 2013
• Dejar claro que usaremos estos
dos botones del Led 8.
• No aparecerá por el momento
ningún mensaje en el cuadro
porque aún no lo hemos
programado.
• Comprueba que por fin el Led 8
se puede encender y apagar.
• Si no funciona, lee otra vez
desde el principio para saber la
causa.
• Si te funciona, sigue adelante.
• Dejar claro que para muchos,
hasta aquí es el final, lo que
viene ahora es un complemento
y no es obligatorio.

[Link] 11/04/2015 85
 Visual C# 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo InterDuinoCS_1 en
el directorio de la descarga, InterDuino
GENERAL\Windows\CS\InterDuinoCS_1

[Link] 11/04/2015 86
[Link] 11/04/2015 87
[Link] 11/04/2015 88
 Visual C#

• Ahora nos toca a programar que es bueno

saberlo, saber enviar tramas de bytes.
• En algunos casos, como recibir comandos
de dispositivos o control como puedes ver
en la imagen de la derecha, usaremos el
10 en DECimal que es salto de línea y el
13 en DECimal que e retorno de carro más
adelante.

[Link] 11/04/2015 89
 Visual C# 2013

• Antes que nada, volvemos a

ampliar el código en Arduino
IDE.
• Incluiremos los comandos para
el pin 13 conocido como Led
13 que se llamará Led_13_ON
y Led_13_OFF.

[Link] 11/04/2015 90
 Visual C# 2013

• Para el Led 13 usaremos estos

botones, el tercero y el cuarto.
• En esta ocasión vamos usar
algo diferente pero no es una
obligación, si una
recomendación ya que envía
las tramas de bytes tal cual y
en HEXadecimal.

[Link] 11/04/2015 91
 Visual C# 2013

• Hacemos doble clic en el

tercer botón indicado en la
imagen del Led 13.

[Link] 11/04/2015 92
 Visual C# 2013
• En el primer código donde dice
byte[9] es que son 9 bytes a
usar de este comando:
• Led_13_ON
• Más abajo en fila se cuenta
desde 0, por eso miBuffer[0]
empieza de 0 y acaba en
miBuffer[8] que son un total de
9 bytes a enviar.
• Al parecer más engorroso es el
más adecuado sobre todo para
control de dispositivos.
• En esta parte del código, no es
necesario, puedes usar el
método del principio que
usamos para el Led 8.

[Link] 11/04/2015 93
 Visual C# 2013

• Ya en el último botón más de

lo mismo. Fijarse en las dos
últimos tramas de bytes que
terminan en dos F.
• Hasta aquí hemos llegado con
todos los botones y dos formas
de enviar tramas de bytes.

[Link] 11/04/2015 94
 Visual C# 2013

• Hasta aquí terminado si solo

deseas controlar relés o Led
sin recibir mensajes.
• Sigue adelante para programar
de una vez mensajes recibidos
desde Arduino.
• En la entrada de mensajes
puedes ponerlo en modo
lectura y no se puede
modificar, si te interesa ponle
True. En mi caso lo dejo como
está, en False.

[Link] 11/04/2015 95
 Visual C# 2013

Propiedades
• En mi caso he dejado esta configuración Propiedad Cambie a
en las propiedades. ReadOnly False
(Name) richTextBox_Mensajes

[Link] 11/04/2015 96
 Visual C# 2013

• Escribimos una variable

llamada “Recibidos” tipo string.
• Recibiremos las tramas de
byte y se almacenará ahí.

[Link] 11/04/2015 97
 Visual C# 2013

• Fíjate bien donde se introduce

este código.

[Link] 11/04/2015 98
 Visual C# 2013

• Añadir estos siguientes

códigos.
• A continuación, en la página
siguiente se muestra el código
completo por si te pierdes.

[Link] 11/04/2015 99
 Código desde
el principio.

[Link] 11/04/2015 100

[Link] 11/04/2015 101
[Link] 11/04/2015 102
[Link] 11/04/2015 103
[Link] 11/04/2015 104
 Fin de código.

[Link] 11/04/2015 105

 Visual C# 2013

• Puedes ver el ejemplo InterDuinoCS_2 en

• Ya puedes comparar tu código por si te has el directorio de la descarga, InterDuino
perdido en el camino. GENERAL\Windows\CS\InterDuinoCS_2

[Link] 11/04/2015 106

 Visual C# 2013

• Último código para cerrar el puerto serie si

cerramos nuestro programa o aplicación.
• Hacemos clic una vez en el formulario,
luego pulsamos el icono del rayo que son
los eventos y al final doble clic en la
propiedad “FormClosing”.

[Link] 11/04/2015 107

 Visual C# 2013

• Introducimos este código.

• Si detecta el puerto serie activo cuando
cerramos nuestra interfaz, cierra el puerto.

[Link] 11/04/2015 108

 Visual C# 2013

• Puedes ver el ejemplo InterDuinoCS_3 en

el directorio de la descarga, InterDuino
• Código final. GENERAL\Windows\CS\InterDuinoCS_3

[Link] 11/04/2015 109

[Link] 11/04/2015 110
 WPF C# 2013
WPF con FrameWork 4.5

[Link] 11/04/2015 111

 WPF C# 2013

En este caso estoy trabajando bajo

Windows 7 de 64 bits y Visual Studio
Express 2013.

[Link] 11/04/2015 112

 WPF C# 2013

• Crearemos un proyecto nuevo.

• Pulsamos “ARCHIVO”  “Nuevo
proyecto…”.

[Link] 11/04/2015 113

 WPF C# 2013

• Vemos en esta ventana los

pasos a seguir en la imagen.
• El nombre que he creado en el
paso 3º lo he llamado WpfCS.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 114

 WPF C# 2013

• Muestra el formulario donde

configuramos las propiedades
e incluimos botones más
seguimos con los códigos de
programación.

[Link] 11/04/2015 115

 WPF C# 2013

Propiedades
• Fijándonos en la página anterior.
Cambiamos las propiedades del formulario
tal como muestra aquí.
• Cambiar el color es opcional, puedes
continuar directamente a la página
siguiente.

[Link] 11/04/2015 116

 WPF C# 2013

• Introducimos el nombre del formulario.

• Título en “Title” lo he llamado Inter WPF
C#.
• CenterScreen para centrar tu programa en
el centro de la pantalla al ejecutarlo.
• Sigue los pasos en fijándote en la imagen
en páginas siguientes.

[Link] 11/04/2015 117

 WPF C# 2013

[Link] 11/04/2015 118

 WPF C# 2013

[Link] 11/04/2015 119

 WPF C# 2013

• Antes que nada, no olvidar los dos ussing

como indica arriba del todo de la imagen.
• Luego añadimos los códigos.
• Declaramos puerto serie y su
configuración.
• Luego desde que ejecute tu interfaz,
comprueba el puerto si está disponible y lo
abre.

[Link] 11/04/2015 120

 WPF C# 2013

• Antes que nada, no olvidar los dos ussing

como indica arriba del todo de la imagen.
• Luego añadimos los códigos.
• Declaramos puerto serie y su
configuración.
• Luego desde que ejecute tu interfaz,
comprueba el puerto si está disponible y lo
abre.

[Link] 11/04/2015 121

 WPF C# 2013

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 122

 WPF C# 2013

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 123

 WPF C# 2013

Recordar que los comandos que

hemos programado para el Led
del pin 8 se llama Led_8_ON
para encender y para apagar
Led_8_OFF.
Este es el trozo de código a
insertar para el primer botón para
encender el Led del pin 8.
Aunque lo he llamado Led 8.

[Link] 11/04/2015 124

 WPF C# 2013

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 125

 WPF C# 2013

Ahora añadimos el mismo código

para el segundo botón con el
comando Led_8_OFF, así
podremos apagar el Led.

[Link] 11/04/2015 126

 WPF C# 2013

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 127

 WPF C# 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo WpfCS_1 en el
directorio de la descarga, InterDuino
GENERAL\Windows\CS\WpfCS_1

[Link] 11/04/2015 128

 WPF C# 2013

• Ahora nos toca a programar que es bueno

saberlo, saber enviar tramas de bytes.
• En algunos casos, como recibir comandos
de dispositivos o control como puedes ver
en la imagen de la derecha, usaremos el
10 en DECimal que es salto de línea y el
13 en DECimal que e retorno de carro más
adelante.

[Link] 11/04/2015 129

 WPF C# 2013

• Antes que nada, volvemos a

ampliar el código en Arduino
IDE.
• Incluiremos los comandos para
el pin 13 conocido como Led
13 que se llamará Led_13_ON
y Led_13_OFF.

[Link] 11/04/2015 130

 WPF C# 2013

• Para el Led 13 usaremos estos

botones, el tercero y el cuarto.
• En esta ocasión vamos usar
algo diferente pero no es una
obligación, si una
recomendación ya que envía
las tramas de bytes tal cual y
en HEXadecimal.

[Link] 11/04/2015 131

 WPF C# 2013

• Hacemos doble clic en el

tercer botón indicado en la
imagen del Led 13.

[Link] 11/04/2015 132

 WPF C# 2013
• En el primer código donde dice
byte[9] es que son 9 bytes a
usar de este comando:
• Led_13_ON
• Más abajo en fila se cuenta
desde 0, por eso miBuffer[0]
empieza de 0 y acaba en
miBuffer[8] que son un total de
9 bytes a enviar.
• Al parecer más engorroso es el
más adecuado sobre todo para
control de dispositivos.
• En esta parte del código, no es
necesario, puedes usar el
método del principio que
usamos para el Led 8.

[Link] 11/04/2015 133

 WPF C# 2013

• Ya en el último botón más de

lo mismo. Fijarse en las dos
últimos tramas de bytes que
terminan en dos F.
• Hasta aquí hemos llegado con
todos los botones y dos formas
de enviar tramas de bytes.

[Link] 11/04/2015 134

 Código desde
el principio.

[Link] 11/04/2015 135

[Link] 11/04/2015 136
[Link] 11/04/2015 137
 Fin de código.

[Link] 11/04/2015 138

 WPF C# 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo WpfCS_2 en el
directorio de la descarga, InterDuino
GENERAL\Windows\CS\WpfCS_2

[Link] 11/04/2015 139

[Link] 11/04/2015 140
 Visual VB 2013
Aplicación de Windows Forms con FrameWork 4.5

[Link] 11/04/2015 141

 Visual VB 2013

En este caso estoy trabajando bajo

Windows 7 de 64 bits y Visual Studio
Express 2013.

[Link] 11/04/2015 142

 1) Insertar 4 botones para dos Led, uno del pin 8 y
el otro del pin 13 que ya viene incorporado en la
placa Arduino UNO.
2) Insertar label o etiquetas.
Objetivo: 3) Insertar un componente RichTextBox en el
Diseñar una pequeña interfaz desde
formulario para recibir mensajes desde Arduino.
cero. 4) Insertar y configurar el componente o objeto
serialPort1.
5) Enviar comandos con los botones desde la
Interfaz que creamos hacia Arduino.
6) Recibir mensajes desde Arduino.

[Link] 11/04/2015 143

 Visual VB 2013

• Antes que nada, si ya tenemos Visual

Studio Express 2013 instalado, bajos a la
barra de herramientas arriba y pulsamos
“HERRAMIENTAS  Opciones”.

[Link] 11/04/2015 144

 Visual VB 2013

• Aparecerá la ventana “Opciones”.

• En él seleccionamos “Editor de texto” 
“C#”  “Número de línea”, así sabremos
las líneas de nuestro código.
• Luego pulsas “Aceptar” para confirmar.

[Link] 11/04/2015 145

 Visual VB 2013

• Crearemos un proyecto nuevo.

• Pulsamos “ARCHIVO”  “Nuevo
proyecto…”.

[Link] 11/04/2015 146

 Visual VB 2013

• Vemos en esta ventana los

pasos a seguir en la imagen.
• El nombre que he creado en el
paso 3º lo he llamado
InterDuinoCS.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 147

 Visual VB 2013

• Muestra el formulario donde

configuramos las propiedades
e incluimos botones más
seguimos con los códigos de
programación.

[Link] 11/04/2015 148

 Visual VB 2013

Propiedades
• Fijándonos en la página anterior. Propiedad Cambie a
Cambiamos las propiedades del formulario Text InterDuinoVB
tal como muestra aquí.
(Name) Form_Principal
StartPosition CenterScreen
Size 300; 300

[Link] 11/04/2015 149

 Visual VB 2013

• En el “Cuadro de
herramientas”, seleccionamos
“Controles comunes”, luego
encontramos el objeto llamado
“Button” y lo arrastramos al
formulario.

[Link] 11/04/2015 150

 Visual VB 2013

• Colocamos más botones y lo

colocamos más o menos como
muestra la imagen.
• Luego arrastramos el objeto
RichTextBox en el cuadro, aquí
nos llegará los mensajes de
textos como en el “Monitor
Serie” desde Arduino.

[Link] 11/04/2015 151

 Visual VB 2013

• Seleccionamos el RichTextBox,
buscamos la propiedad Dock y
pulsamos abajo marcado como
indica en la imagen.
• Para que vaya ocupar el
espacio de abajo. Si se queda
estrecho, solamente estira un
poco la parte de arriba.

[Link] 11/04/2015 152

 Visual VB 2013

Propiedades
• En cada botón configuramos las Propiedad Cambie a
propiedades. Text ON
• No olvidar que seleccionamos el primer (Name) button_Led_8_ON
botón, así con cada uno de ellos.

[Link] 11/04/2015 153

 Visual VB 2013

Propiedades
• En los dos últimos botones, lo mismo pero Propiedad Cambie a
con el Led 13 y quedaría así para el ON, Text OFF
button_Led_13_ON y para el OFF o
apagado del Led button_Led_13_ON. (Name) button_Led_8_OFF

[Link] 11/04/2015 154

 Visual VB 2013

• Introducimos un label y en la
propiedad “Text” le ponemos
“Mensaje desde Arduino”.
• La mini interfaz va tomando
forma.

[Link] 11/04/2015 155

 Visual VB 2013

• Seleccionamos la pestaña que

dice “[Link]”.
• Pulsa el segundo botón del
ratón en el formulario nuestro y
luego “Ver código”.
• Aquí ya podemos introducir
códigos.

[Link] 11/04/2015 156

 Visual VB 2013

• Para la comunicación con los puertos,

usamos este using como muestra en
la imagen.
• Escribimos:
• Imports [Link] ‘ No olvidar.

[Link] 11/04/2015 157

 Visual VB 2013

• Introduciremos un trozo de
código que al iniciar la
aplicación automáticamente
abre el puerto.
• Si el puerto está ocupado,
aparecerá un mensaje de
error.

[Link] 11/04/2015 158

 Visual VB 2013

[Link] 11/04/2015 159

 Visual VB 2013

• Pulsa en la pestaña
“[Link][Diseño] para volver
al formulario.
• En el “Cuadro de
herramientas” selecciona
“Componentes” y haz doble
clic con el ratón al objeto o
componente “SerialPort”.

[Link] 11/04/2015 160

 Visual VB 2013

• Selecciona el componente
“SerialPort1”, en este caso
cambiamos los baudios a
115200 tal como lo tenemos
programado en Arduino y en
mi PC me tocó el puerto
COM4.
• Mirar página siguiente.

[Link] 11/04/2015 161

 Visual VB 2013

• Para saber que puerto

estamos usando con Arduino.
• Entras desde Windows “Inicio
 Panel de control\Todos los
elementos de Panel de
control\Sistema”.
• Luego pulsas “Administrador
de dispositivos”.

[Link] 11/04/2015 162

 Visual VB 2013

• En mi caso, se usa y usaremos

el puerto COM4.
• Sabiendo el puerto a usar, ya
podemos cerrar la ventana
“Administrador de
dispositivos”.

[Link] 11/04/2015 163

 Visual VB 2013

Propiedades
• Siguiendo el camino, cambiamos las Propiedad Cambie a
propiedades como indica en el cuadro si no BaudRate 115200
lo ha hecho ya.
PortName COM4

[Link] 11/04/2015 164

 Visual VB 2013

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 165

 Visual VB 2013

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 166

 Visual VB 2013

Recordar que los comandos que

hemos programado para el Led
del pin 8 se llama Led_8_ON
para encender y para apagar
Led_8_OFF.
Este es el trozo de código a
insertar para el primer botón para
encender el Led del pin 8.
Aunque lo he llamado Led 8.

[Link] 11/04/2015 167

 Visual VB 2013

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 168

 Visual VB 2013

Ahora añadimos el mismo código

para el segundo botón con el
comando Led_8_OFF, así
podremos apagar el Led.

[Link] 11/04/2015 169

 Visual VB 2013

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 170

 Visual VB 2013

• Cerramos Arduino IDE para

dejar el puerto COM4 libre.
• Podemos directamente pulsar
F5 para ejecutar la aplicación o
nuestro programa.

[Link] 11/04/2015 171

 Visual VB 2013
• Dejar claro que usaremos estos
dos botones del Led 8.
• No aparecerá por el momento
ningún mensaje en el cuadro
porque aún no lo hemos
programado.
• Comprueba que por fin el Led 8
se puede encender y apagar.
• Si no funciona, lee otra vez
desde el principio para saber la
causa.
• Si te funciona, sigue adelante.
• Dejar claro que para muchos,
hasta aquí es el final, lo que
viene ahora es un complemento
y no es obligatorio.

[Link] 11/04/2015 172

 Visual VB 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo InterDuinoVB_1 en
el directorio de la descarga, InterDuino
GENERAL\Windows\VB\InterDuinoVB_1

[Link] 11/04/2015 173

[Link] 11/04/2015 174
 Visual VB 2013

• Ahora nos toca a programar que es bueno

saberlo, saber enviar tramas de bytes.
• En algunos casos, como recibir comandos
de dispositivos o control como puedes ver
en la imagen de la derecha, usaremos el
10 en DECimal que es salto de línea y el
13 en DECimal que e retorno de carro más
adelante.

[Link] 11/04/2015 175

 Visual VB 2013

• Antes que nada, volvemos a

ampliar el código en Arduino
IDE.
• Incluiremos los comandos para
el pin 13 conocido como Led
13 que se llamará Led_13_ON
y Led_13_OFF.

[Link] 11/04/2015 176

 Visual VB 2013

• Para el Led 13 usaremos estos

botones, el tercero y el cuarto.
• En esta ocasión vamos usar
algo diferente pero no es una
obligación, si una
recomendación ya que envía
las tramas de bytes tal cual y
en HEXadecimal.

[Link] 11/04/2015 177

 Visual VB 2013

• Hacemos doble clic en el

tercer botón indicado en la
imagen del Led 13.

[Link] 11/04/2015 178

 Visual VB 2013
• En el primer código donde dice
byte[9] es que son 9 bytes a
usar de este comando:
• Led_13_ON
• Más abajo en fila se cuenta
desde 0, por eso miBuffer(0)
empieza de 0 y acaba en
miBuffer(8) que son un total de
9 bytes a enviar.
• Al parecer más engorroso es el
más adecuado sobre todo para
control de dispositivos.
• En esta parte del código, no es
necesario, puedes usar el
método del principio que
usamos para el Led 8.

[Link] 11/04/2015 179

 Visual VB 2013

• Ya en el último botón más de

lo mismo. Fijarse en las dos
últimos tramas de bytes que
terminan en dos F.
• Hasta aquí hemos llegado con
todos los botones y dos formas
de enviar tramas de bytes.

[Link] 11/04/2015 180

 Visual VB 2013

• Hasta aquí terminado si solo

deseas controlar relés o Led
sin recibir mensajes.
• Sigue adelante para programar
de una vez mensajes recibidos
desde Arduino.
• En la entrada de mensajes
puedes ponerlo en modo
lectura y no se puede
modificar, si te interesa ponle
True. En mi caso lo dejo como
está, en False.

[Link] 11/04/2015 181

 Visual VB 2013

Propiedades
• En mi caso he dejado esta configuración Propiedad Cambie a
en las propiedades. ReadOnly False
(Name) RichTextBox_Mensajes

[Link] 11/04/2015 182

 Visual VB 2013

• Escribimos una variable

llamada “Recibidos” tipo string.
• Recibiremos las tramas de
byte y se almacenará ahí.

[Link] 11/04/2015 183

 Visual VB 2013

• Fíjate bien donde se introduce

este código.

[Link] 11/04/2015 184

 Visual VB 2013

• Añadir estos siguientes

códigos.
• A continuación, en la página
siguiente se muestra el código
completo por si te pierdes.

[Link] 11/04/2015 185

 Código desde
el principio.

[Link] 11/04/2015 186

[Link] 11/04/2015 187
[Link] 11/04/2015 188
 Fin de código.

[Link] 11/04/2015 189

 Visual VB 2013

• Puedes ver el ejemplo InterDuinoVB_2 en

• Ya puedes comparar tu código por si te has el directorio de la descarga, InterDuino
perdido en el camino. GENERAL\Windows\VB\InterDuinoVB_2

[Link] 11/04/2015 190

 Visual VB 2013

• Último código para cerrar el puerto serie si

cerramos nuestro programa o aplicación.
• Hacemos clic una vez en el formulario,
luego pulsamos el icono del rayo que son
los eventos y al final doble clic en la
propiedad “FormClosing”.

[Link] 11/04/2015 191

 Visual VB 2013

• Introducimos este código.

• Si detecta el puerto serie activo cuando
cerramos nuestra interfaz, cierra el puerto.

[Link] 11/04/2015 192

 Visual VB 2013

• Puedes ver el ejemplo InterDuinoVB_3 en

el directorio de la descarga, InterDuino
• Código final. GENERAL\Windows\VB\InterDuinoVB_3

[Link] 11/04/2015 193

[Link] 11/04/2015 194
 WPF VB 2013
WPF con FrameWork 4.5

[Link] 11/04/2015 195

 WPF VB 2013

En este caso estoy trabajando bajo

Windows 7 de 64 bits y Visual Studio
Express 2013.

[Link] 11/04/2015 196

 WPF VB 2013

• Crearemos un proyecto nuevo.

• Pulsamos “ARCHIVO”  “Nuevo
proyecto…”.

[Link] 11/04/2015 197

 WPF VB 2013

• Vemos en esta ventana los

pasos a seguir en la imagen.
• El nombre que he creado en el
paso 3º lo he llamado WpfVB.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 198

 WPF VB 2013

• Muestra el formulario donde

configuramos las propiedades
e incluimos botones más
seguimos con los códigos de
programación.

[Link] 11/04/2015 199

 WPF VB 2013

Propiedades
• Fijándonos en la página anterior.
Cambiamos las propiedades del formulario
tal como muestra aquí.
• Cambiar el color es opcional, puedes
continuar directamente a la página
siguiente.

[Link] 11/04/2015 200

 WPF VB 2013

• Introducimos el nombre del formulario.

• Título en “Title” lo he llamado Inter WPF
VB.
• CenterScreen para centrar tu programa en
el centro de la pantalla al ejecutarlo.
• Sigue los pasos en fijándote en la imagen
en páginas siguientes.

[Link] 11/04/2015 201

 WPF VB 2013

[Link] 11/04/2015 202

 WPF VB 2013

[Link] 11/04/2015 203

 WPF VB 2013

• Antes que nada, no olvidar los dos ussing

como indica arriba del todo de la imagen.
• Luego añadimos los códigos.
• Declaramos puerto serie y su
configuración.

[Link] 11/04/2015 204

 WPF VB 2013

• Luego desde que ejecute tu interfaz,

comprueba el puerto si está disponible y lo
abre.

[Link] 11/04/2015 205

 WPF VB 2013

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 206

 WPF VB 2013

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 207

 WPF VB 2013

Recordar que los comandos que hemos programado para el Led del pin 8 se llama Led_8_ON para
encender y para apagar Led_8_OFF.
Este es el trozo de código a insertar para el primer botón para encender el Led del pin 8. Aunque lo
he llamado Led 8.
Añadir un import arriba del todo.
Imports [Link]

[Link] 11/04/2015 208

 WPF VB 2013

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 209

 WPF VB 2013

Ahora añadimos el mismo código para el segundo botón con el comando Led_8_OFF,
así podremos apagar el Led.

[Link] 11/04/2015 210

 WPF VB 2013

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 211

 WPF VB 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo WpfVB_1 en el
directorio de la descarga, InterDuino
GENERAL\Windows\VB\WpfVB_1

[Link] 11/04/2015 212

 WPF VB 2013

• Ahora nos toca a programar que es bueno

saberlo, saber enviar tramas de bytes.
• En algunos casos, como recibir comandos
de dispositivos o control como puedes ver
en la imagen de la derecha, usaremos el
10 en DECimal que es salto de línea y el
13 en DECimal que e retorno de carro más
adelante.

[Link] 11/04/2015 213

 WPF VB 2013

• Antes que nada, volvemos a

ampliar el código en Arduino
IDE.
• Incluiremos los comandos para
el pin 13 conocido como Led
13 que se llamará Led_13_ON
y Led_13_OFF.

[Link] 11/04/2015 214

 WPF VB 2013

• Para el Led 13 usaremos estos

botones, el tercero y el cuarto.
• En esta ocasión vamos usar
algo diferente pero no es una
obligación, si una
recomendación ya que envía
las tramas de bytes tal cual y
en HEXadecimal.

[Link] 11/04/2015 215

 WPF VB 2013

• Hacemos doble clic en el

tercer botón indicado en la
imagen del Led 13.

[Link] 11/04/2015 216

 WPF VB 2013

• En el primer código donde dice byte[9] es que son 9 bytes a usar de este comando:
• Led_13_ON
• Más abajo en fila se cuenta desde 0, por eso miBuffer[0] empieza de 0 y acaba en miBuffer[8] que son un total de 9
bytes a enviar.
• Al parecer más engorroso es el más adecuado sobre todo para control de dispositivos.
• En esta parte del código, no es necesario, puedes usar el método del principio que usamos para el Led 8.
[Link] 11/04/2015 217
 WPF VB 2013

• Ya en el último botón más de lo mismo. Fijarse en las dos últimos tramas de bytes que
terminan en dos F.
• Hasta aquí hemos llegado con todos los botones y dos formas de enviar tramas de bytes.

[Link] 11/04/2015 218

 Código desde
el principio.

[Link] 11/04/2015 219

[Link] 11/04/2015 220
 Fin de código.
[Link] 11/04/2015 221
 WPF VB 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo WpfVB_2 en el
directorio de la descarga, InterDuino
GENERAL\Windows\VB\WpfVB_2

[Link] 11/04/2015 222

[Link] 11/04/2015 223
 Visual C++ 2013
Aplicación de Windows Forms con FrameWork 4.5

[Link] 11/04/2015 224

 Visual C++ 2013

En este caso estoy trabajando bajo

Windows 7 de 64 bits y Visual Studio
2013.

[Link] 11/04/2015 225

 1) Insertar 4 botones para dos Led, uno del pin 8 y
el otro del pin 13 que ya viene incorporado en la
placa Arduino UNO.
2) Insertar label o etiquetas.
Objetivo: 3) Insertar un componente RichTextBox en el
Diseñar una pequeña interfaz desde
formulario para recibir mensajes desde Arduino.
cero. 4) Insertar y configurar el componente o objeto
serialPort1.
5) Enviar comandos con los botones desde la
Interfaz que creamos hacia Arduino.
6) Recibir mensajes desde Arduino.

[Link] 11/04/2015 226

 Visual C++ 2013

• Antes que nada, si ya tenemos Visual

Studio Express 2013 instalado, bajos a la
barra de herramientas arriba y pulsamos
“HERRAMIENTAS  Opciones”.

[Link] 11/04/2015 227

 Visual C++ 2013

• Aparecerá la ventana “Opciones”.

• En él seleccionamos “Editor de texto” 
“C/C++”  “Número de línea”, así
sabremos las líneas de nuestro código.
• Luego pulsas “Aceptar” para confirmar.

[Link] 11/04/2015 228

 Visual C++ 2013

• Crearemos un proyecto nuevo.

• Pulsamos “ARCHIVO”  “Nuevo
proyecto…”.

[Link] 11/04/2015 229

 Visual C++ 2013

• Vemos en esta ventana los

pasos a seguir en la imagen.
• El nombre que he creado en el
paso 3º lo he llamado
InterDuinoCPP.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 230

 Visual C++ 2013

• Hacemos una vez clic en el

“Explorador de soluciones”
justo en InterDuinoCPP.
• Luego en “PROYECTO” 
“Agregar nuevo elemento…”.

[Link] 11/04/2015 231

 Visual C++ 2013

• Haz clic en “UI”, luego en

“Windows Forms”, le pones un
nombre, en mi caso lo he
llamado “Form_Principal.h” y
finalmente pulsa “Agregar”.

[Link] 11/04/2015 232

 Visual C++ 2013

• Ya tenemos el formulario
creado.

[Link] 11/04/2015 233

 Visual C++ 2013

• Hacemos clic una vez con el

botón derecho del ratón y en el
cuadro pulsamos
“Propiedades”.

[Link] 11/04/2015 234

 Visual C++ 2013

• Accedemos en “Propiedades
de configuración” 
“Vinculador”  “Sistema”, en
“Subsistema” seleccionamos
“Windows
(/SUBSYSTEM:WINDOWS)” y
finalmente aún NO pulsamos
“Aceptar”.
• Seleccionamos “Avanzadas”,
que está un poco abajo.

[Link] 11/04/2015 235

 Visual C++ 2013

• Clic en “Avanzadas”, en “Punto

de entrada” escribimos main y
luego pulsas “Aplicar”.
• Ahora si pulsas “Aceptar”.

[Link] 11/04/2015 236

 Visual C++ 2013

• Hacemos doble clic en el

cuadro “Exploraciones de
soluciones” llamado
“Forma_Principal”.
• Escribimos el código indicado
en la imagen.
• Para verlo mejor, en la página
siguiente.

[Link] 11/04/2015 237

 Visual C++ 2013

[Link] 11/04/2015 238

 Visual C++ 2013

Propiedades
• Fijándonos en la página anterior. Propiedad Cambie a
Cambiamos las propiedades del formulario Text Mini Interfaz C++
tal como muestra aquí.
StartPosition CenterScreen
Size 300; 300

[Link] 11/04/2015 239

 Visual C++ 2013

• En el “Cuadro de
herramientas”, seleccionamos
“Controles comunes”, luego
encontramos el objeto llamado
“Button” y lo arrastramos al
formulario.

[Link] 11/04/2015 240

 Visual C++ 2013

• Colocamos más botones y lo

colocamos más o menos como
muestra la imagen.
• Luego arrastramos el objeto
RichTextBox en el cuadro, aquí
nos llegará los mensajes de
textos como en el “Monitor
Serie” desde Arduino.

[Link] 11/04/2015 241

 Visual C++ 2013

• Seleccionamos el RichTextBox,
buscamos la propiedad Dock y
pulsamos abajo marcado como
indica en la imagen.
• Para que vaya ocupar el
espacio de abajo. Si se queda
estrecho, solamente estira un
poco la parte de arriba.

[Link] 11/04/2015 242

 Visual C++ 2013

Propiedades
• En cada botón configuramos las Propiedad Cambie a
propiedades. Text ON
• No olvidar que seleccionamos el primer (Name) button_Led_8_ON
botón, así con cada uno de ellos.

[Link] 11/04/2015 243

 Visual C++ 2013

Propiedades
• En los dos últimos botones, lo mismo pero Propiedad Cambie a
con el Led 13 y quedaría así para el ON, Text OFF
button_Led_13_ON y para el OFF o
apagado del Led button_Led_13_OFF. (Name) button_Led_8_OFF

[Link] 11/04/2015 244

 Visual C++ 2013

• Introducimos un label y en la
propiedad “Text” le ponemos
“Mensaje desde Arduino”.
• La mini interfaz va tomando
forma.

[Link] 11/04/2015 245

 Visual C++ 2013

• Seleccionamos la pestaña que

dice “Form_Principal.h”.
• Pulsa el segundo botón del
ratón en el formulario nuestro y
luego “Ver código”.
• Aquí ya podemos introducir
códigos.

[Link] 11/04/2015 246

 Visual C++ 2013

• Para la comunicación con los puertos,

usamos este using como muestra en
la imagen.
• Escribimos:
• using namespace System::IO::Ports;
• using namespace System::Text;

[Link] 11/04/2015 247

 Visual C++ 2013

• Introduciremos un trozo de
código que al iniciar la
aplicación automáticamente
abre el puerto.
• Si el puerto está ocupado,
aparecerá un mensaje de
error.

[Link] 11/04/2015 248

 Visual C++ 2013

[Link] 11/04/2015 249

 Visual C+ 2013

• Pulsa en la pestaña
“Form1.h[Diseño] para volver
al formulario.
• En el “Cuadro de
herramientas” selecciona
“Componentes” y haz doble
clic con el ratón al objeto o
componente “SerialPort”.

[Link] 11/04/2015 250

 Visual C++ 2013

• Selecciona el componente
“serialPort1”, en este caso
cambiamos los baudios a
115200 tal como lo tenemos
programado en Arduino y en
mi PC me tocó el puerto
COM4.
• Mirar página siguiente.

[Link] 11/04/2015 251

 Visual C++ 2013

• Para saber que puerto

estamos usando con Arduino.
• Entras desde Windows “Inicio
 Panel de control\Todos los
elementos de Panel de
control\Sistema”.
• Luego pulsas “Administrador
de dispositivos”.

[Link] 11/04/2015 252

 Visual C++ 2013

• En mi caso, se usa y usaremos

el puerto COM4.
• Sabiendo el puerto a usar, ya
podemos cerrar la ventana
“Administrador de
dispositivos”.

[Link] 11/04/2015 253

 Visual C++ 2013

Propiedades
• Siguiendo el camino, cambiamos las Propiedad Cambie a
propiedades como indica en el cuadro si no BaudRate 115200
lo ha hecho ya.
PortName COM4

[Link] 11/04/2015 254

 Visual C++ 2013

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 255

 Visual C++ 2013

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 256

 Visual C++ 2013

Recordar que los comandos que

hemos programado para el Led
del pin 8 se llama Led_8_ON
para encender y para apagar
Led_8_OFF.
Este es el trozo de código a
insertar para el primer botón para
encender el Led del pin 8.
Aunque lo he llamado Led 8.

[Link] 11/04/2015 257

 Visual C++ 2013

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 258

 Visual C++ 2013

Ahora añadimos el mismo código

para el segundo botón con el
comando Led_8_OFF, así
podremos apagar el Led.

[Link] 11/04/2015 259

 Visual C++ 2013

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 260

 Visual C++ 2013

• Cerramos Arduino IDE para

dejar el puerto COM4 libre.
• Podemos directamente pulsar
F5 para ejecutar la aplicación o
nuestro programa.

[Link] 11/04/2015 261

 Visual C++ 2013
• Dejar claro que usaremos estos
dos botones del Led 8.
• No aparecerá por el momento
ningún mensaje en el cuadro
porque aún no lo hemos
programado.
• Comprueba que por fin el Led 8
se puede encender y apagar.
• Si no funciona, lee otra vez
desde el principio para saber la
causa.
• Si te funciona, sigue adelante.
• Dejar claro que para muchos,
hasta aquí es el final, lo que
viene ahora es un complemento
y no es obligatorio.

[Link] 11/04/2015 262

 Visual C++ 2013

• El código completo hasta el

momento es este que veremos
a continuación. • Puedes ver el ejemplo InterDuinoCPP_1
en el directorio de la descarga, InterDuino
GENERAL\Windows\CS\InterDuinoCPP_1

[Link] 11/04/2015 263

 Visual C++

• Ahora nos toca a programar que es bueno

saberlo, saber enviar tramas de bytes.
• En algunos casos, como recibir comandos
de dispositivos o control como puedes ver
en la imagen de la derecha, usaremos el
10 en DECimal que es salto de línea y el
13 en DECimal que e retorno de carro más
adelante.

[Link] 11/04/2015 264

 Visual C++ 2013

• Antes que nada, volvemos a

ampliar el código en Arduino
IDE.
• Incluiremos los comandos para
el pin 13 conocido como Led
13 que se llamará Led_13_ON
y Led_13_OFF.

[Link] 11/04/2015 265

 Visual C++ 2013

• Para el Led 13 usaremos estos

botones, el tercero y el cuarto.
• En esta ocasión vamos usar
algo diferente pero no es una
obligación, si una
recomendación ya que envía
las tramas de bytes tal cual y
en HEXadecimal.

[Link] 11/04/2015 266

 Visual C++ 2013

• Hacemos doble clic en el

tercer botón indicado en la
imagen del Led 13.

[Link] 11/04/2015 267

 Visual C++ 2013
• En el primer código donde dice
byte[9] es que son 9 bytes a
usar de este comando:
• Led_13_ON
• Más abajo en fila se cuenta
desde 0, por eso miBuffer[0]
empieza de 0 y acaba en
miBuffer[8] que son un total de
9 bytes a enviar.
• Al parecer más engorroso es el
más adecuado sobre todo para
control de dispositivos.
• En esta parte del código, no es
necesario, puedes usar el
método del principio que
usamos para el Led 8.

[Link] 11/04/2015 268

 Visual C++ 2013

• Ya en el último botón más de

lo mismo. Fijarse en las dos
últimos tramas de bytes que
terminan en dos F.
• Hasta aquí hemos llegado con
todos los botones y dos formas
de enviar tramas de bytes.

[Link] 11/04/2015 269

 Visual C++ 2013

• Hasta aquí terminado si solo

deseas controlar relés o Led
sin recibir mensajes.
• Sigue adelante para programar
de una vez mensajes recibidos
desde Arduino.
• En la entrada de mensajes
puedes ponerlo en modo
lectura y no se puede
modificar, si te interesa ponle
True. En mi caso lo dejo como
está, en False.

[Link] 11/04/2015 270

 Visual C++ 2013

Propiedades
• En mi caso he dejado esta configuración Propiedad Cambie a
en las propiedades. ReadOnly False
(Name) richTextBox_Mensajes

[Link] 11/04/2015 271

 Visual C++ 2013

• Declaramos un delegado en la
variable Recibidos al final del
código.

[Link] 11/04/2015 272

 Visual C++ 2013

• Evento DataReceived.
• Haz clic una vez para señalarlo
en “serialPort1”, luego en
“Eventos” y doble clic en
“DataReceived”.

[Link] 11/04/2015 273

 Visual C++ 2013

• Nos genera este código un poco largo.

• Como tenemos los using ya declarado, nos toca recortar código.

[Link] 11/04/2015 274

 Visual C++ 2013

• Gracias a los using se puede

reducir códigos.

[Link] 11/04/2015 275

 Visual C++ 2013

• Introducimos en su interior
todo este código.

[Link] 11/04/2015 276

 Visual C++ 2013

• Otro código justo abajo. Leer

bien los comentarios para
saber de que se trata.
• A continuación, en la página
siguiente se muestra el código
completo por si te pierdes.

[Link] 11/04/2015 277

 Código desde
el principio.

[Link] 11/04/2015 278

[Link] 11/04/2015 279
[Link] 11/04/2015 280
[Link] 11/04/2015 281
[Link] 11/04/2015 282
[Link] 11/04/2015 283
[Link] 11/04/2015 284
[Link] 11/04/2015 285

Fin de código.
 Visual C# 2013

• Puedes ver el ejemplo InterDuinoCS_2 en

• Ya puedes comparar tu código por si te has el directorio de la descarga, InterDuino
perdido en el camino. GENERAL\Windows\CS\InterDuinoCS_2

[Link] 11/04/2015 286

 Visual C++ 2013

• Último código para cerrar el puerto serie si

cerramos nuestro programa o aplicación.
• Hacemos clic una vez en el formulario,
luego pulsamos el icono del rayo que son
los eventos y al final doble clic en la
propiedad “FormClosing”.

[Link] 11/04/2015 287

 Visual C++ 2013

• Introducimos este código.

• Si detecta el puerto serie activo cuando
cerramos nuestra interfaz, cierra el puerto.

[Link] 11/04/2015 288

 Visual C++ 2013

• Puedes ver el ejemplo InterDuinoCPP_3

en el directorio de la descarga, InterDuino
• Código final. GENERAL\Windows\CPP\InterDuinoCPP_
3

[Link] 11/04/2015 289

[Link] 11/04/2015 290
 Visual Basic 6
Interfaz puerto serie

[Link] 11/04/2015 291

 Visual Basic 6

En este caso estoy trabajando bajo

Windows 7 de 64 bits y VB 6.

[Link] 11/04/2015 292

 1) Insertar 3 botones para dos Led, uno del pin 8
llamado ON, otro OF y el otro CONECTAR.
2) Insertar label o etiquetas y un comboBox.
Objetivo: 3) Insertar un componente Text en el formulario
para recibir mensajes desde Arduino.
Diseñar una pequeña interfaz desde
cero. 4) Insertar y configurar el componente o objeto
MSComm1.
5) Enviar comandos con los botones desde la
Interfaz que creamos hacia Arduino.
6) Recibir mensajes desde Arduino.

[Link] 11/04/2015 293

 Visual Basic 6
• A día de hoy, hay muchas personas que
usan Visual Basic 6. Por el 2008, a pesar
de advertir que no haré tutoriales sobre VB
6 ya que es muy obsoleto y me centré en el
VB .net, se sigue usando bastante en
• Hoy en día se usa mucho VB 6 para
pequeños proyectos relacionado con la
centros de enseñanzas de muchos países.
electrónica.
• Da igual que recomiende el VB .net, hay
• En este caso uso Windows 7 de 64 bits y
mentes empeñadas en VB 6.
funciona muy bien hasta con puertos
• También usan equipos muy viejos con virtuales para controlar Arduino.
puertos series bajo Windows 95/98 para
muchos proyectos.
• Entonces, hagamos una interfaz sencillo
con Visual Basic 6 que tanto me han
• También funciona muy bien para el pedido durante años.
Windows XP aunque ya existe el VB .net
de la época.

[Link] 11/04/2015 294

 Visual Basic 6

• Ejecutaremos Visual Basic 6 en modo

Administrador.

[Link] 11/04/2015 295

 Visual Basic 6

• Seleccionamos “EXE
estándar”.
• Finalmente pulsamos
“Aceptar”.

[Link] 11/04/2015 296

 Visual Basic 6

• Muestra el formulario donde

configuramos las propiedades
e incluimos botones más
seguimos con los códigos de
programación.

[Link] 11/04/2015 297

 Visual Basic 6
• Guardamos el proyecto en
“Archivo”  “Guardar
proyecto”.
• Se abre una ventana, antes
creamos una carpeta o
directorio llamado
“InterDuinoVB6”.
• En el directorio llamamos el
formulario como nombre
[Link] y
pulsamos “Guardar”.
• Sale otra ventana, le he puesto
el nombre del proyecto
[Link] y
pulsamos “Guardar”.

[Link] 11/04/2015 298

 Visual Basic 6
Propiedades
• Fijándonos en la página anterior.
Cambiamos las propiedades del formulario
tal como muestra aquí. Propiedades Cambia a
• Caption, es el texto donde ponemos el (Nombre) Form_Principal
título de la pantalla.
Caption Mini Interfaz VB 6
• StartUpPosition donde quieres que se StartUpPosition 2 - CenterScreen
muestre la ventana de nuestro interfaz. En
este caso lo dejamos en el centro.

[Link] 11/04/2015 299

 Visual Basic 6

• En el “Cuadro de
herramientas”, seleccionamos
dos “Command” que son
botones y un “ComboBox”.
• El nombre interno del
comboBox lo he llamado
ComboBoxCOM, así que si
sigues el ejemplo, no lo olvides,
está en la propiedad (Name).

[Link] 11/04/2015 300

 Visual Basic 6
• Colocamos más botones y lo
colocamos más o menos como
muestra la imagen.
• Luego arrastramos el objeto
Text en el cuadro, aquí nos
llegará los mensajes de textos
como en el “Monitor Serie”
desde Arduino.
• En sus propiedades del Text le
ponemos Multiline en True ya
que será de muchas líneas la
entrada de datos.

[Link] 11/04/2015 301

 Visual Basic 6
Propiedades
• En el cuadro de texto Text para recibir
mensajes de textos desde Arduino.
• MultiLine para múltiples líneas de texto,
uno debajo del otro. Propiedades Cambie a
(Name) Text_Mensajes
• ScrollBars para crear una barra de
desplazamiento vertical. MultiLine True
• Loked para no modificar los textos de Text
entrada por el puerto serie, se queda en ScrollBars 2 - Vertical
modo lectura. Loked True

[Link] 11/04/2015 302

 Visual Basic 6

Propiedades
• En cada botón configuramos las Propiedad Cambie a
propiedades. Caption ON
• No olvidar que seleccionamos el primer (Name) Command_Led_8_ON
botón, así con cada uno de ellos.
Enabled False

[Link] 11/04/2015 303

 Visual Basic 6

Propiedades
• El otro botón lo mismo pero en OFF. Propiedad Cambie a
Caption OFF
(Name) Command_Led_8_OFF
Enabled False

[Link] 11/04/2015 304

 Visual Basic 6

• Redimensionamos el ComoBox a la
propiedad Width (ancho) a 3015.
• Insertamos un botón y lo llamaremos
Command_CONECTAR de la
propiedad (Name).
• En “Caption” del botón ponemos
CONECTAR.

[Link] 11/04/2015 305

 Visual Basic 6

• Añadimos dos componentes

más.
• En la barra de arriba pulsamos
“Proyecto”  “Componentes”.

[Link] 11/04/2015 306

 Visual Basic 6

• Se abre la ventana
“Componentes”.
• En la pestaña “Controles”
seleccionamos el componente
“Microsoft Comm Control 6,0”
que es para manejar el puerto
serie.
• Pulsamos “Aplicar” y luego
“Aceptar”. Como hemos
elegido solo un componente,
se puede pulsar solo
“Aceptar”directamente.

[Link] 11/04/2015 307

 Visual Basic 6

• Verás un componente nuevo

en forma de teléfono clásico
amarillo para controlar el
puerto serie.
• Añadimos un timer y el
MSComm en el formulario.
• Al ejecutar la aplicación o
programa no ve mostrará estos
componentes en forma visible.

[Link] 11/04/2015 308

 Visual Basic 6

Propiedades
• Seleccionamos la propiedad MSComm y Propiedad Cambie a
cambiamos sus propiedades indicado en el
cuadro de al lado. (Name) MSComm_Puerto_Serie

• No olvidar que los valores del Settings CommPort 1

tiene que ser el mismo en el Arduino para Settings 115200,n,8,2
que haya comunicación.
RThreshold 1
• RThreshold Devuelve o restablece el
número de caracteres al recibir.

[Link] 11/04/2015 309

 Visual Basic 6

• En la barra de herramientas,
“Ver  Código”.

[Link] 11/04/2015 310

 Visual Basic 6

• Pulsamos doble clic en el botón

conectar y se nos genera un
código.

[Link] 11/04/2015 311

 Visual Basic 6

• Genera este código.

[Link] 11/04/2015 312

 Visual Basic 6

• Introducimos este código.

• Lo que hace es conectar o abrir
el puerto serie y si volvemos a
pulsar desconectarlo o cerrar el
puerto.
• También se activan o
desactivan los botones ON y
OFF dependiendo si el puerto
serie está abierto o no.

[Link] 11/04/2015 313

 Visual Basic 6

• Añadimos en la parte más alta del editor de código de VB 6 este trozo de código.
• Es para seleccionar el puerto COM deseado.

[Link] 11/04/2015 314

 Visual Basic 6

• Para saber que puerto

estamos usando con Arduino.
• Entras desde Windows “Inicio
 Panel de control\Todos los
elementos de Panel de
control\Sistema”.
• Luego pulsas “Administrador
de dispositivos”.

[Link] 11/04/2015 315

 Visual Basic 6

• En mi caso, se usa y usaremos

el puerto COM4.
• Sabiendo el puerto a usar, ya
podemos cerrar la ventana
“Administrador de
dispositivos”.

[Link] 11/04/2015 316

 Visual Basic 6

• Haz doble clic en el primer

botón como muestra en la
imagen.

[Link] 11/04/2015 317

 Visual Basic 6

• Al hacer doble clic en el primer

botón, genera unos códigos
automáticamente.
• Dentro de ella vamos a escribir
los comandos que entiende
Arduino IDE que hemos
programado.

[Link] 11/04/2015 318

 Visual Basic 6

Recordar que los comandos que

hemos programado para el Led
del pin 8 se llama Led_8_ON
para encender y para apagar
Led_8_OFF.
Este es el trozo de código a
insertar para el primer botón para
encender el Led del pin 8.
Aunque lo he llamado Led 8.

[Link] 11/04/2015 319

 Visual Basic 6

• Ahora nos toca hacer doble

clic en el segundo botón para
poder apagar el Led del pin 8
de Arduino.
• Lo podemos llamar Led 8.

[Link] 11/04/2015 320

 Visual Basic 6

Ahora añadimos el mismo código

para el segundo botón con el
comando Led_8_OFF, así
podremos apagar el Led.

[Link] 11/04/2015 321

 Visual Basic 6

Hacer doble clic dentro del

formulario sin tocar ningún
componente como botones,
cmoboBox, label, solo el
formulario.
Cuando lo consigas, aparecerá
un código generado un Load, así
debes introducir todo este código.
En mi caso lo dejo arriba del todo
del editor de código.

[Link] 11/04/2015 322

 Visual Basic 6

• Cambiaremos un poco el
código para probarlo ahora
mismo.
• Antes llamábamos los
comandos Led_ON y
Led_OFF. Ahora lo
llamaremos Led_8_ON y
Led_8_OFF.
• Comprobar que estos
comandos es capaz de
encender y apagar el Led 8
con el “Monitor Serie”.

[Link] 11/04/2015 323

 Visual Basic 6

• Cerramos Arduino IDE para

dejar el puerto COM4 libre.
• Podemos directamente pulsar
F5 para ejecutar la aplicación o
nuestro programa.

[Link] 11/04/2015 324

 Visual Basic 6

• Hasta aquí es el final sobre el

control del puerto serie con
Arduino.
• Podemos ver y seleccionar el
puerto serie con el comboBox,
abrir el puerto y enviar órdenes
a Arduino.
• No recibiremos mensajes
desde Arduino porque aún no
lo hemos programado en este
momento.

[Link] 11/04/2015 325

 Visual Basic 6

• Vamos a generar nuestro

interfaz con el archivo .exe.
• “Archivo”  “Generar
[Link]”.
• Ya tenemos nuestra aplicación
generada.

[Link] 11/04/2015 326

 Visual Basic 6

• El código completo por hasta

donde hemos llegado con
Visual Basic 6. • Puedes ver el ejemplo InterDuinoVB6_1
en el directorio de la descarga, InterDuino
GENERAL\Windows\VB6\InterDuinoVB6_1

[Link] 11/04/2015 327

 Visual C# 2013
• Aquí nos centraremos en que
recibas mensajes y poder verlo
en el Text.
• Sigue adelante para programar
de una vez mensajes recibidos
desde Arduino.
• En la entrada de mensajes
puedes ponerlo en modo
lectura y no se puede
modificar, si te interesa ponle
True.
• Si no quieres dejarlo en modo
lectura, lo dejas en False.

[Link] 11/04/2015 328

 Visual Basic 6

Propiedades
• En mi caso he dejado esta configuración Propiedad Cambie a
en las propiedades. ReadOnly False
(Name) Text_Mensajes

[Link] 11/04/2015 329

 Visual Basic 6

• Añadir estos siguientes

códigos.
• Estos códigos es para recibir
datos del puerto serie desde
Arduino y mostrarlo en el
Text_Mensajes.
• A continuación, en la página
siguiente se muestra el código
completo por si te pierdes.

[Link] 11/04/2015 330

 Visual Basic 6

• Añadir estos siguientes

códigos.
• Estos códigos es para recibir
datos del puerto serie desde
Arduino y mostrarlo en el
Text_Mensajes.
• A continuación, en la página
siguiente se muestra el código
completo por si te pierdes.

[Link] 11/04/2015 331

 Código desde
el principio.

[Link] 11/04/2015 332

[Link] 11/04/2015 333
 Fin de código.
[Link] 11/04/2015 334
 Visual Basic 6

• El código completo por hasta

donde hemos llegado con
Visual Basic 6. • Puedes ver el ejemplo InterDuinoVB6_2
en el directorio de la descarga, InterDuino
GENERAL\Windows\VB6\InterDuinoVB6_2

[Link] 11/04/2015 335

[Link] 11/04/2015 336
 Java
Aplicación con Java y NetBeans 8.0.2

[Link] 11/04/2015 337

 Java 8

En este caso estoy trabajando bajo

Windows 7 de 64 bits y NetBeans 8.

[Link] 11/04/2015 338

 1) Instalar librería RXTX.
2) Insertar 4 botones para dos Led, uno del pin 8 y
el otro del pin 13 que ya viene incorporado en la
placa Arduino UNO.

Objetivo: 3) Insertar label o etiquetas.

4) Insertar un componente Área de Texto en el
Diseñar una pequeña interfaz desde formulario para recibir mensajes desde Arduino.
cero.
5) Insertar y configurar el componente o objeto
serialPort1.
6) Enviar comandos con los botones desde la
Interfaz que creamos hacia Arduino.
7) Recibir mensajes desde Arduino.

[Link] 11/04/2015 339

 Java

• Antes que nada, si ya tenemos NetBeans

8.0 instalado, creamos un proyecto nuevo.

[Link] 11/04/2015 340

 Java

• Cuando se abra la ventana “Proyecto

Nuevo”, en “Categoría” selecciona el
primero llamado “Java” y en “Proyectos”
selecciona “Java Application” luego pulsas
“Siguiente”.

[Link] 11/04/2015 341

 Java

• En “Proyect Name” en este caso he puesto

EP_JAVA, puedes poner el que quieras.
• No dejar marcado “Create Main Class”.
• Pulsa el botón “Terminar”.

[Link] 11/04/2015 342

 Java

• Nos descargamos la librería rxtx en este

enlace.
• Vamos a la dirección C:\Program Files
(x86)\Java\jre1.8.0_40\bin e pegamos las
librerías [Link] y [Link].

[Link] 11/04/2015 343

 Java

• Ahora la librería [Link] lo

introduces en el directorio C:\Program
Files (x86)\Java\jre1.8.0_40\lib\ext.

[Link] 11/04/2015 344

 Java

• El proyecto ya creado en el NetBeans, con

el segundo botón del ratón en EP_JAVA,
cuando se abra las opciones haz clic en
“Opciones”.

[Link] 11/04/2015 345

 Java

• Selecciona Run.
• En mi caso, introduces esta dirección para
que encuentres la librerías. A veces hace
falta hacerlo.
• -[Link]="C:\Program Files
(x86)\Java\jre1.8.0_40\bin"

[Link] 11/04/2015 346

 Java

• Ya hemos guardado el archivo

[Link] en el directorio indicado
que debemos introducir en la pestaña
“Libreries” y luego pulsa e botó “Add
JAR/Folder”.
• Finalmente pulsamos el botón “Aceptar”.

[Link] 11/04/2015 347

 Java

• Ya podemos ver en “Libreries” la librería

cargada [Link].

[Link] 11/04/2015 348

 Java

• Ahora vamos a crear un formulario o

ventana de nuestro programa tal como
muestra en la imagen.
• Usaremos un JFrame.

[Link] 11/04/2015 349

 Java

• En “Nombre de Clase:” lo he llamado

EP_JAVA_FRAME.
• Puedes llamarlo como desees.
• Pulsa “Terminar”.

[Link] 11/04/2015 350

 Java
El formulario está preparado para programarlo.

[Link] 11/04/2015 351

 Java

• Para que al ejecutar nuestra interfaz

salga en el centro de la pantalla.
• Asegúrate que has hecho clic en el
formulario principal, luego vete a
“Código” y finalmente en “Generar
centro” lo chequeas.

[Link] 11/04/2015 352

 Java

• Insertar 2 etiquetas y 4 botones

en el formulario.

[Link] 11/04/2015 353

 Java
Propiedad Cambie a
text Led 8
Nombre accesible jLabel_Led_8

• Cambiar las propiedades de las

etiquetas.
• En la segunda etiqueta lo
mismo pero el “text” a Led 13 y
“Nombre accesible” a
jLabel_Led_13

[Link] 11/04/2015 354

 Java

Propiedad Cambie a
text ON
Nombre accesible jButton_Led_8_ON
• Ahora seleccione el primer
botón del Led 8 y cambies las
propiedades indicadas en la
derecha.

[Link] 11/04/2015 355

 Java

Propiedad Cambie a
text OFF
Nombre accesible jButton_Led_8_OFF
• Lo mismo para el segundo
botón, justo abajo del Led 8
pero en OFF.

[Link] 11/04/2015 356

 Java

• Si todo ha ido bien, debe ser

como muestra en la imagen.
• Ahora para las etiqueta Led 13
y sus dos botones como verás
a continuación.

[Link] 11/04/2015 357

 Java

Propiedad Cambie a
text ON
Nombre accesible jButton_Led_13_ON
• Lo mismo para los demás
botones del Led 13, tanto como
ON para el otro botón OFF.

[Link] 11/04/2015 358

 Java

• Debe quedar así.

• La posición de los botones lo
dejas arriba porque abajo
introduciremos más
componentes que veremos
más adelante.

[Link] 11/04/2015 359

 Java

Propiedad Cambie a
title Mini Interfaz Java

• No olvidar poner un título al

formulario principal.
• En este caso lo llamo Mini
Interfaz Java.

[Link] 11/04/2015 360

 Java

• Añadimos una etiqueta

diciendo “Mensajes desde
Arduino:” y luego ponemos el
componente “Área de texto”.
• Así es nuestra mini interfaz, ya
podemos empezar a programar
para encender Led y apagarlo.

[Link] 11/04/2015 361

 Java

• Compilamos con la flecha

verde para ejecutar la Interfaz y
ver como queda.

[Link] 11/04/2015 362

 Java

• Aspecto de la interfaz
ejecutándose.
• No hace nada porque no
hemos programado ni un
código.
• Ahora nos toca programar para
encender y apagar un Led, en
este caso el Led 8 y el Led 13.

[Link] 11/04/2015 363

 Java

• Puedes ver el ejemplo EP_JAVA_1 en el

• Encontrarás solo la interfaz sin código de directorio de la descarga, InterDuino
programación. GENERAL\Windows\Java\EP_JAVA_1

[Link] 11/04/2015 364

 Java
Programar la interfaz para encender y apagar el Led del pin 8 y el 13.

[Link] 11/04/2015 365

 Java

• Hasta el momento,
escribiremos estos import
desde el principio del código.

[Link] 11/04/2015 366

 Java

• Agregar todas estas variables.

• Se basan en enviar mensajes
y configuración del puerto.

[Link] 11/04/2015 367

 Java

[Link] 11/04/2015 368

 Java

• Agregar todas estas variables.

• Se basan en enviar mensajes
y configuración del puerto.

[Link] 11/04/2015 369

 Java

• Más métodos enviarDatos y

mostrarError.

[Link] 11/04/2015 370

 Java

• Hacemos doble clic al botón

Led 8 ON.
• Se nos crea este código.

[Link] 11/04/2015 371

 Java

• En el interior del código

ponemos
enviarDatos(Led_8_ON);
• Este dato se enviará a
Arduino por puerto serie, si lo
detecta, encenderá el Led del
pin 8.

[Link] 11/04/2015 372

 Java

• Haz doble clic con el segundo

botón y he introduces ahora
para apagar el Led 8 lo que
indica la imagen.
• Así también con los otros
botones del Led 13.

[Link] 11/04/2015 373

 Java

• Puedes ver el ejemplo EP_JAVA_2 en el

• Código programado encender y apagar los directorio de la descarga, InterDuino
Led 8 y 13. GENERAL\Windows\Java\EP_JAVA_2

[Link] 11/04/2015 374

 Java

• Leer mensajes desde Arduino.

• Introducir estos “import” al principio como
indica la imagen.

[Link] 11/04/2015 375

 Java

• Añades estos códigos cuando veas que

están entre // #####################
• Se añade comentarios para saber de que
va.
• A partir de la página siguiente, se añade
los códigos completo de inicio a fin con sus
comentarios incluidos.

[Link] 11/04/2015 376

 Código desde
el principio.

[Link] 11/04/2015 377

[Link] 11/04/2015 378
[Link] 11/04/2015 379
[Link] 11/04/2015 380
[Link] 11/04/2015 381
 Fin de código.

[Link] 11/04/2015 382

 Java

• Puedes ver el ejemplo EP_JAVA_3 en el

• Lectura del puerto serie y los datos se directorio de la descarga, InterDuino
muestra en un cuadro de texto indicando GENERAL\Windows\Java\EP_JAVA_3
cuando un Led está encendido o apagago.

[Link] 11/04/2015 383

[Link] 11/04/2015 384
 Módulo de 8 relés

[Link] 11/04/2015 385

 Módulo de 8 relés

• Exactamente este es el módulo que vamos

a usar, con opto acopladores y con Jumper
por si queremos y recomendable usar
fuente alimentación externa.
• El modelo de relé es el SRD-050VC-LS-C.
• Funcionan a 5 VDC tanto las entradas
como los relés.

[Link] 11/04/2015 386

 Módulo de 8 relés
• Hay otro tipo de módulos de 8 relés que no
tienen opto acopladores con lo que le quita
la ventaja de usar fuente alimentación
externa, sobre todo si la entrada es de 5
VDC y lo relés a 24 VDC que no es el
caso.
• Se nota la diferencia por su Leds rojos de 3
mm.
• Este modelo actualmente se considera
obsoleto.

[Link] 11/04/2015 387

 Módulo de 8 relés

• Así es el modelo que voy a usar en este

tutorial, un módulo de 8 relés con opto
acoplador.

[Link] 11/04/2015 388

 Extras
Ampliando conocimientos de la interfaz solo para Visual C# en este turorial.

[Link] 11/04/2015 389

 Extras

[Link] 11/04/2015 390

[Link] 11/04/2015 391
 Fotos
Se muestran algunas fotos sobre Arduino y el módulo de 8 relés.

[Link] 11/04/2015 392

[Link] 11/04/2015 393
 Vídeos
Muestran algunos vídeos de los ejemplos con Arduino, módulo de 8 relés y la
propia interfaz.

[Link] 11/04/2015 394

[Link] 11/04/2015 395
 Libro
Libro relacionado con este tutorial.

[Link] 11/04/2015 396

ARDUINO Curso práctico de formación
• Cualquier técnico electrónico o aficionado a la electrónica necesita en
alguna ocasión trabajar con microcontroladores. Esta tarea, durante
Libro años compleja, actualmente es mucho más simple gracias a Arduino.
• Arduino permite que cualquier persona (incluso profana en la
electrónica y la programación) pueda realizar circuitos electrónicos que
sean capaces de interaccionar con el mundo físico real. Gracias a su
sencillez, campos como la robótica o la domótica (por nombrar solo
dos) se han visto radicalmente impulsados con la llegada de Arduino,
aunque es utilizado en muchos otros campos multidisciplinares, tales
como el control y monitoraje de sensores, la activación remota de
circuitos electromecánicos (vía Internet incluso), el montaje de
instalaciones audiovisuales, etc.
• Arduino es tanto una placa de circuito impreso que incluye un
microcontrolador, como un entorno de desarrollo diseñado para facilitar
su programación mediante un lenguaje tremendamente intuitivo.
Arduino es hardware y software libre; es decir, que puede descargarse
gratuitamente de su web y utilizarse para el desarrollo de cualquier tipo
de proyecto sin adquirir ninguna licencia porque su código fuente es
público para todo el mundo.
• Esta obra incluye gran cantidad de ejemplos que facilitan al lector toda
la información necesaria para realizar sus propios proyectos, sin
requerir ninguna consulta externa. Solo con la ayuda de una placa
Arduino UNO y un conjunto básico de componentes electrónicos
(resistencias, condensadores, LEDs, etc.), ya podrá hacer realidad
todos los circuitos descritos.
• El desarrollo del libro está pensado para servir de apoyo a la docencia,
tanto de formación profesional como en los últimos cursos de la
educación secundaria, para aficionados que deseen aprender de forma
autodidacta, o como obra de consulta permanente para técnicos en
electrónica.

[Link] 11/04/2015 397

[Link] 11/04/2015 398
 Otros tutoriales
Otros enlaces relacionados con el mundo de los microcontroladores,
programación y puertos de comunicaciones.

[Link] 11/04/2015 399

 Otros tutoriales

• Enlaces de otros tutoriales relacionados

• Puerto serie con PIC16F84A y C#.
con puertos de comunicación que podría • Puerto serie con PIC16F84A y C++/VB .net.
ser de tu interés.
• Puerto paralelo con Visual Studio.

[Link] 11/04/2015 400

[Link] 11/04/2015 401
 Enlaces de interés
Enlaces de páginas Web, blog o foros donde podrás encontrar más
información.

[Link] 11/04/2015 402

• [Link] Web oficial sobre Arduino con su foro incluido para cualquier
ayuda y en varios idiomas.
• ATmega328 Datasheet o hoja de datos del microcontrolador que usa
Arduino UNO.
• [Link] Foro internacional de electrónica.
• [Link] Versión gratuita para crear tus propios programas
relacionado con la electrónica.
• Converter C#  VB .net Convertidor entre lenguajes.
• [Link] Foro oficial de Visual Studio para consultar
ayudas en cualquier de sus lenguajes y esta sección dedicado a la
comunicación por puertos.
• [Link] Sistemas computacionales.
• Electrónica PIC Blog creador de este tutorial.

[Link] 11/04/2015 403

[Link] 11/04/2015 404
 Interfaz EP
Interfaz Electrónica PIC completo con instalador incluido que puedes
controlar los 8 relés y tiene muchas funciones añadidas.

[Link] 11/04/2015 405

[Link] 11/04/2015 406
 Versión del tutorial
Versión del tutorial para saber si esta es la más actualizada.

[Link] 11/04/2015 407

 Publicado por primera vez:
00-00-2015

Versión del tutorial

Versión 1.00

[Link] 11/04/2015 408

[Link] 11/04/2015 409
 Colaboradores
Han aportado ayudas partes de este tutorial.

[Link] 11/04/2015 410

 Colaboradores

• PepLluis – Enlace: Me ayudó bastante en

el tema del serialPort entrada y salida de
datos.
• Leandro Tuttini – Enlace: Muchos trucos
de programación.
• Rodripelto – Enlace: Configuración del
• Gracias a estos colaboradores sin ningún puerto serie que lo pueda configurar el
orden en particular, en la parte del software usuario en Visual C#.
se ha podido hacer un buen tutorial lo más
completo posible cargado con todo detalle, • D@rkbytes – Enlace: Parte de la
tanto los que están en la lista y anónimos. programación y consejos en VB 6.
• Jonathan Melgoza – Enlace: En la parte
de recepción de datos en Java.

[Link] 11/04/2015 411

[Link] 11/04/2015 412
 Contacto

[Link] 11/04/2015 413

Contacto • Cualquier sugerencia,
petición o mejoras de este
tutorial, puedes contactar
por correo electrónico:

metaconta@[Link]

• Puedes publicar este tutorial en tu Web,

foro, blog, CD, DVD, Blu-Ray para revistas
en papel que incluya estos formatos
• Correo relacionados con
libremente. donaciones:

egiptoman@[Link]
[Link] 11/04/2015 414
[Link] 11/04/2015 415
 Donaciones

[Link] 11/04/2015 416

 Donaciones

• Si te ha parecido de gran ayuda este

tutorial, puedes libremente donar para
futuras actualizaciones, mejoras,
ampliaciones y hacer nuevos tutoriales de
este tipo portable a PDF y XPS cargado de
detalles.
• Más información aquí.

[Link] 11/04/2015 417

[Link] 11/04/2015 418
 Autor:

Ángel Acaymo M. G.

[Link] 11/04/2015 419