Instalación Visual Studio con Arduino

Instalación Visual Studio con Arduino

El siguiente tutorial se pretende mostrar la instalación Visual Studio con Arduino y explicación de su interfaz con un pequeño código de muestra para mostrar la funcionalidad de algunas herramientas de esta misma plataforma anexando la comunicación con Arduino.

Visual Studio es un software que ayuda a realizar programas mediante la combinación de comandos y de herramientas como botones, caja de texto, etiquetas y muchas más las cuales al final pueden otorgan una aplicación. Entre los lenguajes con los que se puede trabajar aquí son los siguientes: Visual C#, Visual Basic, Visual C++ y Visual F#. Siendo una gran ayuda para las personas que gustan aprender a programar en distintos lenguajes y realizar distintas prácticas y darles distintos usos.

Te la oportunidad de poder realizar comunicaciones con distintos dispositivos como lo es Arduino crear proyectos utilizando esta plataforma será más fácil para la interacción con el usuario, en nuestra pagina encontraras mas tutoriales donde se explicara la función entre este software y Arduino.

Comenzamos proporcionando los enlaces para realizar las descargas:

En este enlace podrán descargar las distintas versiones de la plataforma (link de versiones) o pueden optar por realizar la descarga directa en este enlace que es la que utilizamos en este tutorial (descarga directa).

El material que necesitamos es el siguiente:

• Arduino UNO
• LED
• Cable USB tipo B

Descarga e instalación

Una vez realizada la descarga, desde su ubicación procedemos con la descarga dando clic derecho sobre la aplicación y damos en “ejecutar como administrador” e instalar y se mostrará lo siguiente:

La siguiente imagen a mostrar nos preguntará donde queremos instalarlo y que tipo de instalación deseamos, recomendamos la instalación “Default” ya que nos instala lo que necesitamos:

Una vez que demos instalar en la ventana anterior comenzará a con proceso, tardara en realizar esta tarea, mostramos imágenes del proceso al inicio y final, una vez finalizada la instalación nos mostrará una última ventana donde nos dice que ya finalizó con la instalación.

Una vez dentro de la plataforma los primeros pasos que nos pedirá realizar son: acceder a una cuenta que tengamos o solo ingresar a la misma en este caso presionamos la opción marcada en la imagen, la siguiente ventana nos pedirá que seleccionar cómo queremos que nos muestra la interfaz y esto es elección propia, nos mostrará después una ventana con el mensaje de que ya está preparando la plataforma.

Una vez que la plataforma esta lista nos mostrará su ventana de inicio de Visual Studio, si deseas comenzar un nuevo proyecto es necesario que selecciones “New Project”

La nueva ventana nos mostrará las múltiples opciones para realizar proyectos, las opciones que utilizaremos estarán marcadas en las siguientes imágenes, el recuadro de la parte de abajo se refiere a que debemos asignar un nombre y una ruta para guardar nuestro proyecto.

Entorno de Visual Studio

Estando en la nueva ventana podemos ver la interfaz donde estan todas las herramientas que utilizaremos.

Formulario

En Visual Studio tenemos la ventaja de poder contar con dos ventanas, Una donde podemos colocar todo lo gráfico para mostrar al usuario y otra donde colocaremos cada línea de código que ejecuta junto con las herramientas. podemos cambiar entre ellas solo dando clic sobre la pestaña que deseamos trabajar para identificar cada una podemos notar que entre paréntesis dirá “(design)”.

Explorador de soluciones y Ventana de propiedades

En la parte de la derecha contamos con una ventana la cual nos muestra en forma de cascada lo que estamos trabajando es decir, nos dice sobre que archivo estamos actualmente y en qué sección del mismo estamos y esto nos ayuda a navegar de manera más fácil, en la parte de abajo podemos manipular las propiedades de las herramientas con las que estemos trabajando, las configuraciones disponibles varía según la herramienta que queremos configurar.

Barra de menú

En ella podemos encontrar las herramientas básicas como la de archivo, editar, ver y entre otras que se utilizan especialmente para este tipo de tareas como lo son: depurar, datos, ventana, proyecto entre otras.

Cuadro de herramientas

En la parte izquierda podemos encontrar el cuadro de herramientas el cual nos muestra distintas herramientas y están separadas según su categoría, de igual manera se encuentra una pestaña donde se podemos acceder a todas, cada una de ellas tienen distintas funciones.

Ejemplo practico de Visual Studio y Arduino

Visual Studio

Una vez que comprendemos este ambiente nuevo de trabajo podemos continuar con nuestro nuevo proyecto el cual tendrá como función mostrar el encendido/apagado de un LED con Arduino y  Visual Studio utilizando la herramienta “Serial”, de igual manera mostraremos algunas herramientas que utilizamos como ejemplo.

Utilizando Visual Studio colocaremos en Form las siguientes herramientas:

• PictureBox
• Label
• Button
• TextBox
• SerialPort

Cada herramienta la encontrarán en la parte izquierda del programa solo damos clic y podemos arrastrar y acomodar a nuestro gusto, de la misma manera pueden cambiar el nombre de las mismas.

A continuación les daremos una breve explicación de las herramientas que utilizamos.

PictureBox: Esta herramienta podemos utilizarla cuando necesitemos mostrar una imagen en un proyecto y cualquier parte del mismo, para cargar una imagen debemos seleccionarla desde sus propiedades.

Label: Es una simple etiqueta que solo nos muestra un texto o un valor, podemos manipular lo que mostrará según lo que agreguemos al código.

Button: Con esta herramienta podemos realizar distintas acciones dan un simple clic o dos seguidos para ejecutar algunas líneas de código.

TextBox: La caja de texto podemos manipularla al igual que Label para que muestre información o con función de ingresar datos para que los valide en una secuencia por ejemplo una contraseña.

SerialPort: Es la herramienta que nos ayudará a establecer la comunicación con Arduino, esta herramienta no es visible al final, es importante que en sus propiedades ingresemos el puerto y la velocidad que está utilizando Arduino

Una vez colocadas todas las herramientas en el área de trabajo explicaremos la función de cada herramienta, inicialmente lo único visible serán los botones, para hacer esto damos clic en el Form y colocaremos el siguiente código dejando establecido que no mostrara lo siguiente: label, textbox y picturebox.

[code language=»cpp»]
Public Class Form1
    Private Sub Boton_2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Boton_2.Click
        ‘Abrir el puerto serial
        SPort.Open()
        ‘ Enviar el "0" por el puerto serial para apagar el led
        SPort.Write("0")
        ‘ Cerrar el puerto serial
        SPort.Close()
        ‘ Establecer estado actual para cada herramienta con este boton
        PictureBox1.Visible = False
        Label2.Visible = False
        TextBox1.BackColor = Color.Red
        TextBox1.Text = "Apagado"
    End Sub
[/code]

 

Ahora colocaremos el código para el primer botón, éste realizará las siguientes acciones para cada herramienta: mostrará picturebox, label y textbox, realiza también la comunicación y enciende el LED. En el textbox mostrará el mensaje de encendido y cambiará su fondo a color verde.

[code language=»cpp»]
    Private Sub Boton_1_Click(sender As Object, e As EventArgs) Handles Boton_1.Click
        ‘ Abrir el puerto serial
        SPort.Open()
        ‘ Enviar el "1" por el puerto serial para encender el led
        SPort.Write("1")
        ‘ Cerrar el puerto serial
        SPort.Close()
        ‘ Establecer estado actual para cada herramienta con este boton
        PictureBox1.Visible = True
        Label2.Visible = True
        TextBox1.Visible = True
        TextBox1.BackColor = Color.GreenYellow
        TextBox1.Text = "Encendido"
    End Sub
[/code]

El botón de apagado cerrará la comunicación y apagará el LED, la otra función que tendrá será ocultar: label, picturebox y cambiará a rojo el fondo del textbox mostrando el mensaje de apagado.

[code language=»cpp»]
    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        ‘ Establecer estado inicial para cada herramienta al iniciar el programa
        PictureBox1.Visible = False
        Label2.Visible = False
        TextBox1.Visible = False
    End Sub
End Class
[/code]

Arduino

Una vez redactado el código en Visual Studio el siguiente paso es programar la parte del Arduino, el cual realizará la función de establecer la comunicación con Visual Studio y recibiendo indicaciones.

Definimos la velocidad de transferencia y pin que utilizaremos con el LED usaremos el pin 13 ya que cuenta con una resistencia interna que nos ayuda a iluminar de manera adecuada nuestro LED.

Dentro del void loop usamos un ciclo para que esté realizando la comunicación si es que está disponible el puerto, y dentro de este ciclo colocamos una secuencia donde se establece que si presionamos enciende y/o apagamos el LED.

[code language=»c»]
void setup() {
 //Definimos la velocidad de transferencia a 9600 baudios
 //y el pin 13 como salida
 Serial.begin(9600);
 pinMode(13,OUTPUT);
}

void loop() {
 //Mientras el puerto serie este accesible
 while (Serial.available())
 {
 //Guardamos en dato el valor leido del puerto serie
 byte dato = Serial.read();
 switch (dato){
 //Si es ‘1’ encendemos el led
 case ‘1’:
 digitalWrite(13,HIGH);
  break;
 //Si es ‘0’ apagamos el led
 case ‘0’:
 digitalWrite(13,LOW);
 break;
 }
 }
}
[/code]

A continuación les mostramos la conexión con Arduino y el LED.

Con esto concluimos este tutorial esperamos que sea de su agrado, cualquier comentario o duda es recibido. Les dejamos un enlace con los archivos que que contienen en el código que utilizamos Arduino y Visual Studio