PicRS232
474
Transcript of PicRS232
ÍNDICE 1/2
Presentación – 4
Visual C# .net – 6
Entorno Visual C# – 44
Ejecutar programa – 58
Objetivo de la interfaz – 67
Código ASM del PIC16F84A – 101
Primer código C# – 121
Recibir mensajes – 163
07/12/[email protected]
2
ÍNDICE 2/2
Extras – 203
Fotos – 459
Vídeos – 463
Libros – 465
Otros manuales – 468
Enlaces de interés – 470
Versión del manual – 472
Contacto – 473
Autor – 474
07/12/[email protected]
3
PRESENTACIÓN
Este manual está orientado a personas nóveles en tema de microcontroladores PIC y el
lenguaje C# en el Sistema Operativo Windows.
No aprenderemos a programar PIC en ensamblador (asm) ni el lenguaje C#, sino que se darán
los pasos necesarios para poder ser capaz de realizar estas tareas sin tener idea de
programación.
El objetivo de este manual es que cualquier persona sin conocimientos previos puedan hacer
ciertas tareas sobre el puerto serie RS232 sin el HyperTerminal de Windows, Minicom de Linux
o cualquier otro programa relacionado ya que nos centraremos en crear desde cero nuestro
propio interfaz donde podemos añadirle cualquier función o diseño de botones, colores,
posiciones, etc.
Está relacionado con el libro “MICROCONTROLADOR PIC16F84. Desarrollo de proyectos” en el
capítulo 20 con el ejemplo “RS232_11.asm” y/o RS232_11b.asm
Independientemente del entorno de desarrollo que hayas elegido sea en Windows o Linux,
siguiendo los pasos podrás controlar con tu interfaz el propio PIC a través del puerto serie
RS232. También puedes recibir mensajes de texto al igual que lo hace el HyperTerminal y
Minicom que también se visualiza en el LCD.
Este manual básico les puede servir para proyectos de fin de curso sea de Ciclos Formativos
Grado Medio, Ciclos Formativos Grado Superior e incluso una carrera universitaria.
07/12/[email protected]
5
VISUAL C# .NET EXPRESS
Vamos a desarrollar un pequeño programa bajo el entorno de desarrollo Visual C# .net Express (gratuito) bajo el Sistema Operativo Windows.
Si conoces el libro www.pic16f84a.org se tratará sobre el capítulo 20 en el cual explica paso a paso el control del PIC-16F84A.
Si deseas obtener más información sobre el aprendizaje de Visual C# con vídeos incluidos entre en este enlace desde la Web oficial de MicroSoft. http://msdn.microsoft.com/es-es/beginner/bb308760.aspx
07/12/[email protected]
7
VISUAL C# .NET EXPRESS
En este manual se ha trabajado en su
momento con:
Windows XP SP3.
Visual C# Express Edition 2008 FrameWork 3.5
SP1.
07/12/[email protected]
8
DESCARGA DEL VISUAL C# .NET EXPRESS
De entrada vamos a descargar el compilador (gratuito) Visual C# .netExpress desde la Web oficial http://www.microsoft.com/express/download/
Precisamente vamos a descargar la versión en español y si es posible instale los Service Pack ya que en esa actualización se han corregidos errores y mejor rendimiento.
Pulsa Donwload para su descarga.
07/12/[email protected]
9
DESCARGA DEL VISUAL C# .NET EXPRESS
Puede tardar unos
minutos la instalación.
Lea paso a paso y la
licencia de su uso sobre
la instalación del Visual
C# .net. Tardará unos
buenos minutos entre la
descarga y la
instalación.
07/12/[email protected]
11
REGISTRO DE VISUAL C# .NET
Llegarás un momento en que te dice que te registres. Si no te registras sólo funcionará el Visual C# .net 30 días y después si quieres usarlo siempre te pedirá la clave del registro.
Registrarse es gratuito y no tendrás que pagar ninguna cantidad de dinero, sólo es para que lo puedas usar siempre.
Se recomienda guardar la clave que te llega por e-mail.
07/12/[email protected]
13
EJECUTAR VISUAL C# .NET
Desde el botón de inicio de Windows,
pulsa “Todos los programas”,
“Microsoft Visual C# 2008 Express
Edition” y ejecutarás el Visual C#.
En caso de que hayas tocado algo
puedes restablecer las ventanas en
la barra de herramientas,
“VentanasRestablecer diseño de la
ventana”.
07/12/[email protected]
17
RESTABLECER DISEÑO DE LA VENTANA
Le hará una pregunta
antes de realizar la
operación.
Pulse “Sí” para
reestablecer las
ventanas.
07/12/[email protected]
19
INICIO VISUAL C# .NET
Como se muestra en la
imagen, aparecerá una
página llamada “Página
de inicio”.
07/12/[email protected]
21
07/12/[email protected]
22
CREAR NUEVO PROYECTO
Creamos un nuevo proyecto en “ArchivoNuevaProyecto…”. Antes de
comenzar, vamos a explicar el entorno básico del Visual C# .NET Express.
CREAR NUEVO PROYECTO
Se abrirá una ventana llamada
“Nuevo proyecto”. Eliges la primera
que se llama “Aplicación de Windows
Forms”.
Abajo donde dice “Nombre:”
podemos poner cualquier nombre, en
mi caso he puesto exactamente
PicRS232.
Cuando acabes pulsa el botón
“Aceptar”.
07/12/[email protected]
24
INICIO DE UN NUEVO PROYECTO
Como puedes ver en la imagen, se a
creado una ventana llamada “Form1”
en el cual vamos a diseñar nuestro
formulario.
En cada paso que hagamos se
recomienda guardar el proyecto por si
hay corte de luz, fallo en el sistema,
etc así no perder información o el
trabajo que hemos realizado que
puedes ser de horas.
07/12/[email protected]
26
INICIO DE UN NUEVO PROYECTO
07/12/[email protected]
27
Pulsa el botón “Guardar
todo” como indica en la
imagen o pulsa en la
barra de herramientas
“ArchivoGuardar
todo” para guardar el
proyecto.
INICIO DE UN NUEVO PROYECTO
Al pulsar “Guardar todo”
aparece una ventana
llamada “Guardar
proyectos”. Deja el
nombre como está y
pulsa el botón
“Guardar”.
07/12/[email protected]
29
INICIO DE UN NUEVO PROYECTO
En la pestaña “Página
de inicio, en su derecha
pulsa la X para cerrarla”
y no nos molestará en el
futuro si abrimos
muchas.
07/12/[email protected]
31
INICIO DE UN NUEVO PROYECTO
Pulsa la pestaña
“Cuadro de
herramientas” para
abrir una ventana
indicado en la imagen
con un rectángulo rojo.
07/12/[email protected]
33
INICIO DE UN NUEVO PROYECTO
Se abrirá el “Cuadro de
herramientas” como
indica en el dibujo, pero
aún no es fija.
07/12/[email protected]
35
INICIO DE UN NUEVO PROYECTO
Se abrirá el “Cuadro de
herramientas” como
indica en el dibujo, pero
aún no es fija.
Para dejarla fija pulsa la
chincheta como indica
la marca roja de la
imagen de la derecha.
07/12/[email protected]
37
INICIO DE UN NUEVO PROYECTO
Ahora permanece fija y
es lo que nos interesa si
estamos añadiendo
componentes al
formulario.
Así se hará con este tipo
de ventanas.
07/12/[email protected]
38
07/12/[email protected]
39
INICIO DE UN NUEVO PROYECTO
Vamos abrir otro cuadro llamado “propiedades” para tener todo el entorno
preparado y con la chincheta fija.
INICIO DE UN NUEVO PROYECTO
Dentro de la ficha que
actualmente se llama
Form1 (Más adelante
cambiaremos el
nombre), pulsa el botón
derecho del ratón y dale
en “Propiedades”.
07/12/[email protected]
40
INICIO DE UN NUEVO PROYECTO
Una vez que todo esté
como muestra en la
imagen, vamos a
explicar cada elemento
para orientarnos y así
saber de lo que
estamos hablando y
para qué es cada cosa.
07/12/[email protected]
42
ENTORNO VISUAL C#
Ahora que ya tenemos
Visual C# a la vista, hay
que saber de entrada
donde introducir los
códigos de
programación.
07/12/[email protected]
45
ENTORNO VISUAL C#
Hay varias maneras de
ver los códigos como
muestra en la imagen.
Si pulsas “Abrir
diseñador” se muestra
el diseño de formulario
y si pulsas “Ver código”
muestra el código
fuente del programa.
07/12/[email protected]
46
ENTORNO VISUAL C#
También puedes ver el
código pulsando con el
botón derecho del
ratón, luego “Ver
código” e igualmente
accede al código fuente.
07/12/[email protected]
48
ENTORNO VISUAL C#
En el código fuente
escribiremos en el
lenguaje C# (no en
ensamblador) los
códigos necesarios para
poder comunicar el PIC
16F84A.
07/12/[email protected]
49
ENTORNO VISUAL C#
CÓDIGO FUENTE DISEÑO
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
namespace PicRS232
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
}
}
07/12/[email protected]
51
ENTORNO VISUAL C#
Vamos a explicar cada cuadro para
familiarizarnos y poder entender las
futuras explicaciones.
Se explicará el “Cuadro de
herramientas”, “Explorador de
soluciones”, “Propiedades” y algún
que otro según avanzamos.
07/12/[email protected]
52
CUADRO DE HERRAMIENTAS
En el “Cuadro de herramientas” hay
componentes que puedes arrastrarlo al
formulario Form1 o hacer doble clic con el
ratón.
NOTA: Se llama componentes a todos
objetos que se pueda coger desde el
“Cuadro de herramientas” y que se pueda
arrastrar hacia el formulario con el fin de
editar sus propiedades. Se dividen en dos
grupos: los que forman parte de la interfaz
de usuario, como botones, etiquetas de
textos, etc, y aquellos que aportan
funcionalidad pero no son visibles al
ejecurtarlo. Los primeros se llaman
controles normalmente, para
diferenciarlos.
En resumen: El Cuadro de herramientas y
el Diseñador, para desarrollar
rápidamente interfaces de usuario con el
ratón.
07/12/[email protected]
53
EXPLORADOR DE SOLUCIONES
En el “Explorador de
soluciones”, para ver y
administrar archivos de
proyecto y
configuraciones.
07/12/[email protected]
54
VENTANA DE PROPIEDADES
En “Propiedades”, para
configurar propiedades
y eventos en los
controles de la interfaz
de usuario.
07/12/[email protected]
55
VENTANA DE PROPIEDADES
Algunas veces, la
“descripción de la
propiedad” aparece
escondida.
Simplemente
selecciona abajo con el
ratón y lo arrastra hacia
arriba hasta que se vea.
07/12/[email protected]
57
EJECUTAR TU PROGRAMA
Para compilar o ejecutar
el programa
simplemente arriba en
la barra de
herramientas pulsa
“DepurarIniciar
depuración” o
simplemente pulsa
“F5”.
07/12/[email protected]
59
EJECUTAR TU PROGRAMA
También puedes pulsar
la flecha verde que
significa lo mismo que
al pulsar “F5”.
07/12/[email protected]
61
EJECUTAR TU PROGRAMA
Para terminar la
depuración
simplemente pulsa
“DepurarDetener
depuración”.
07/12/[email protected]
63
EJECUTAR TU PROGRAMA
Puedes detener la depuración pulsando el botón cuadrado azul claro.
En el formulario de la aplicación ejecutándose, también puedes pulsar la X para cerrar como cualquier otro programa. La X que está en la esquina superior derecha al lado de Minimizar y Maximizar.
07/12/[email protected]
65
OBJETIVO DE LA INTERFAZ
El objetivo principal de esta aplicación es hacer
una interfaz de Visual C# capaz de
comunicarse con un microcontrolador
PIC16F84A al igual que lo hace el
HyperTerminal de Windows o el Minicom de
Linux con su propio diseño y control.
Vamos a dar el primer paso del diseño de la
interfaz.
07/12/[email protected]
68
OBJETIVO DE LA INTERFAZ
1) Introducir el nombre de nuestro programa en el formulario.
2) Centrar el formulario en el centro de la pantalla de nuestro monitor al ejecutar nuestra aplicación o programa.
3) Introducir 5 botones en el formulario en la coordenada indicada.
4) Orden de tabulación de los botones.
5) Depurar nuestra aplicación.
07/12/[email protected]
69
OBJETIVO DE LA INTERFAZ
Pincha una vez en el
centro del formulario o
donde quieras.
En “Propiedades”, pon
el valor de la propiedad
“PicRS232” (sin las
dobles comillas) ya que
es el nombre del
programa principal.
07/12/[email protected]
70
OBJETIVO DE LA INTERFAZ
En el nombre de la propiedad (Name) que el valor de la propiedad se llama “Form1” la cambiamos a “Form_Principal”.
(Name) en formulario, botones, etiquetas o cualquier otro objeto, es el nombre interno del objeto y no se visualiza, por ejemplo un botón, no el nombre del botón “Text” que si se visualiza. El nombre interno de los objetos es para llamarlo.
07/12/[email protected]
72
OBJETIVO DE LA INTERFAZ
CÓDIGO FUENTE
Asegúrate que el código
fuente es tal como se
muestra.
07/12/[email protected]
73
OBJETIVO DE LA INTERFAZ
Para centrar el formulario, el nombre de la propiedad, selecciona el valor de la propiedad “CenterScreen”.
Al depurar el programa siempre se visualiza el formulario en el centro de la pantalla o nuestro monitor.
07/12/[email protected]
75
OBJETIVO DE LA INTERFAZ
PROPIEDADES
En el cuadro de propiedades de la derecha, es un breve resumen de lo que hemos hecho menos la “Propiedad” “Size”, que es el que debemos tener si no hemos tocado nada al principio.
Ahora en adelante sabrá interpretar este cuadro, y podemos cambiar las propiedades más rápidamente de cualquier objeto.
07/12/[email protected]
77
Propiedad Cambie a
Text PicRS232
(Name) Form_Principal
StartPosition CenterScreen
Size 300; 300
OBJETIVO DE LA INTERFAZ
En la ventana de “Cuadro de herramientas” pulsa el botón izquierdo del ratón el objeto o control “Button” y sin soltar arrástralo al formulario y después suelta.
También puedes pinchar 2 veces clic en “Button” con el ratón y se agrega automáticamente en el formulario.
07/12/[email protected]
78
OBJETIVO DE LA INTERFAZ
Haz introducido el botón llamado “Button1” en el formulario.
Ahora toca cambiar las propiedades que se describe en el cuadro a continuación.
Da igual en que parte coloques el Button dentro del formulario, ya que lo colocaremos con las coordenadas en las propiedades más adelante.
07/12/[email protected]
80
OBJETIVO DE LA INTERFAZ
PROPIEDADES
Haz introducido el botón
llamado “button1” en el
formulario.
Ahora toca cambiar las
propiedades que se describe
en el cuadro a continuación
para el “button1”.
Propiedad Cambie a
Text t
(Name) button_t
Location 109; 38
07/12/[email protected]
82
OBJETIVO DE LA INTERFAZ
PROPIEDADES
Arrastra un “button” desde el
“Cuadro de herramientas”
hacia el formulario en el cual
se llama “button2” y cambie
las propiedades como hiciste
en el apartado anterior.
Propiedad Cambie a
Text b
(Name) button_b
Location 109; 67
07/12/[email protected]
83
OBJETIVO DE LA INTERFAZ
PROPIEDADES
Ahora con button3. Propiedad Cambie a
Text a
(Name) button_a
Location 28; 67
07/12/[email protected]
84
OBJETIVO DE LA INTERFAZ
PROPIEDADES
Ahora con button4 pero
cuidado una cosa, la letra
que estamos usando es la
letra “L” minúscula que
podemos confundirnos con
la “I” latina mayúscula.
Propiedad Cambie a
Text l
(Name) button_l
Location 190; 67
07/12/[email protected]
85
OBJETIVO DE LA INTERFAZ
PROPIEDADES
Ahora con Button5 de la
tecla “Espacio”
cambiaremos el color del
botón y la fuente de letras en
negrita como indica en el
cuadro.
Te lo dice directamente pero
hay otra forma de hacerlo
más cómodo.
07/12/[email protected]
86
Propiedad Cambie a
BackColor 255; 128; 0
Font.Bolt True
Text Espacio
(Name) button_Espacio
Location 190; 96
OBJETIVO DE LA INTERFAZ
En el “button5 o
ahora“button_Espacio”,
haz clic sobre él para
ver sus propiedades.
En ella, BackColor he
seleccionado el color
naranja que muestra en
la imagen.
07/12/[email protected]
87
OBJETIVO DE LA INTERFAZ
Cambiamos a “Negrita”
en “Font.Bold” a modo
“True”. Para acceder a
Bold que significa
“Negrita” pulsamos el
símbolo + a – para
acceder seguido de
activarlo a True.
07/12/[email protected]
88
OBJETIVO DE LA INTERFAZ
Hay una manera más
cómoda y rápida de
ponerlo en “Negrita”
que es pulsando
directamente en “Font”
sin abrirlo como
muestra en la imagen.
07/12/[email protected]
89
OBJETIVO DE LA INTERFAZ
Tras a verlo pulsado, se
abre una ventana muy
cómoda y fácil de
entender.
En “Estilo de fuente:”
señala “Negrita” y luego
pulsa “Aceptar”.
Así conseguimos el
resultado que
queremos.
07/12/[email protected]
90
OBJETIVO DE LA INTERFAZ
Vamos a ver algunas
formas sobre orden de
tabulación de los botones.
El “Nombre de la
propiedad” “TabIndex”
con valor “0”, significa
que es el primero en
orden de tabulación, el 1
el segundo, el 2 el tercero
así sucesivamente.
07/12/[email protected]
92
OBJETIVO DE LA INTERFAZ
También hay otro
método más cómodo en
seleccionar el orden de
tabulación.
Accede al “VerOrden
de tabulación”.
07/12/[email protected]
93
OBJETIVO DE LA INTERFAZ
Directamente en el
formulario puedes ver el
orden que tiene la
tabulación.
Puedes cambiarla
pulsando con el ratón el
cuadrado azul con su
número
correspondiente.
07/12/[email protected]
95
OBJETIVO DE LA INTERFAZ
Guarde el proyecto completo y luego
pulse “F5” o la flecha verde para
iniciar la depuración.
Debemos tener algo similar como
muestra en la imagen de la derecha.
Puedes pulsar los botones que
notarás que no hace nada ya que no
hemos programado ninguna acción
sobre ellas.
Ahora cierra el programa con la X
como cualquier otro programa.
Ya hemos cumplido el objetivo de
esta parte.
Ahora nos centramos a explicar un
poco el código del PIC16F84A y así
entender cómo recibe los datos que
Visual C# envía por el puerto serie.
07/12/[email protected]
97
OBJETIVO DE LA INTERFAZ
Si quieres ver,
seleccionar o modificar
los nombres internos
(Name) de los objetos
más facilmente, pulsa
arriba “VerOtras
ventanasEsquema
del documento”.
07/12/[email protected]
98
OBJETIVO DE LA INTERFAZ
Esta ventana se llama
“Esquema de
documento”, como dije
antes, puedes
seleccionar los objetos
aquí y cambiar su
nombre interno (Name).
07/12/[email protected]
100
CÓDIGO ENSAMBLADOR DEL PIC16F84A
Para entender los datos que enviamos desde el
Visual C#, debemos entender el código fuente
del PIC 16F84A, en este caso en ensamblador.
Los datos que enviamos desde el Visual C# es
en hexadecimal en lo cual conviene ver la tabla
ASCII que puedes ver en el APÉNDICE G del
libro www.pic16f84a.org.
07/12/[email protected]
102
CÓDIGO ENSAMBLADOR DEL PIC16F84A
Si no tienes el libro puedes ver el código ASCII en las páginas siguientes y el que vamos utilizar es la tabla ASCII 1.
La tabla ASCII 2 es más extendida, aunque en este manual no lo vamos a utilizar, es bueno tenerlo como referencia.
ASCII, pronunciado “áski” significa del Inglés “American Standard Code for InformationInterchange” o lo que es lo mismo “Código Estadounidense Estándar para el Intercambio de Información”.
07/12/[email protected]
103
CÓDIGO ENSAMBLADOR DEL PIC16F84A
El ejemplo a utilizar es el archivo RS232_11.asm (también vale el RS232_11b.asm).
Puedes obtenerlo desde el CD-ROM que acompaña el libro como también puedes descargarlo en su Web pinchando con el ratón aquí.
La clave para abrir todos los archivos de esta Web corresponden con las iniciales del Ciclo Formativo de Grado Superior Desarrollo de Productos Electrónicos, uno de los estudios oficiales donde en España se pueden estudiar los temas tratados en esta Web:
D.P.E.
07/12/[email protected]
106
CÓDIGO ENSAMBLADOR DEL PIC16F84A
El esquema eléctrico que vamos a usar es del
capítulo 20-15 del libro www.pic16f84a.org que
se muestra en la página siguiente.
07/12/[email protected]
107
CÓDIGO ENSAMBLADOR DEL PIC16F84A
LISTA DE COMPONENTES
Componentes Valor
IC1 LCD LM016L
IC2 MAX232
IC3 PIC16F84A-04
C1 1µF
C2 100nF
C3 1µF
C4 100nF
C5 1µF
C6 1µF
C7 22pF
C8 22pF
Y1 4 MHz
R1 ajustable 10 kΩ
R2 330 KΩ
R3 330 KΩ
R4 330 KΩ
R5 330 KΩ
D1 Led Rojo
D2 Led Rojo
D3 Led Rojo
D4 Led Rojo
07/12/[email protected]
109
CÓDIGO ENSAMBLADOR DEL PIC16F84A
Vamos a usar el código del libro del archivo RS232_11.asm para poder entender lo que estamos haciendo.
Sólo explicaré la parte fundamental para entender la parte de Visual C# al enviar los datos.
Si quieres saber la explicación completa de estos temas del código ASM, está bien detallada en el libro www.pic16f84a.org
07/12/[email protected]
110
CÓDIGO ENSAMBLADOR DEL PIC16F84A
;************************************ RS232_11.asm **************************************
;
; ===================================================================
; Del libro "MICROCONTROLADOR PIC16F84. DESARROLLO DE PROYECTOS"
; E. Palacios, F. Remiro y L. López. www.pic16f84a.org
; Editorial Ra-Ma. www.ra-ma.es
; ===================================================================
;
; SISTEMA DE GOBIERNO DESDE ORDENADOR: Desde el teclado de un ordenador se desea comandar
; el movimiento de una estructura móvil, según la siguiente tabla:
;
; TECLA (Por ejemplo) MOVIMIENTO
; ------------------- ----------
; t Adelante
; b Atrás
; a Izquierda
; l Derecha
; Espacio Parada
;
; La pulsación de cualquiera de estas teclas activa el estado de las salidas correspondiente
; RB3 (Adelante), RB2 (Atrás), RB1 (Izquierda), RB0 (Derecha) y apaga el resto.
;
; El movimiento que se está realizando aparece reflejado en un mensaje en el visualizador LCD
; del sistema y también en la pantalla del ordenador.
;
; El programa debe permitir modificar facilmente en posteriores revisiones en el hardware de
; la salida. Es decir, para activar las salidas conviene utilizar el direccionamiento por bit
; en lugar de por byte (utilizar instrucciones "bsf" y "bcf", en lugar de "mov..").
;
; ZONA DE DATOS **********************************************************************
LIST P=16F84A
INCLUDE <P16F84A.INC>
07/12/[email protected]
111
CÓDIGO ENSAMBLADOR DEL PIC16F84A
__CONFIG _CP_OFF & _WDT_OFF & _PWRTE_ON & _XT_OSC
CBLOCK 0x0C
TeclaPulsada ; Va a guardar el contenido de la tecla pulsada.
MensajeApuntado ; Va a guarda la dirección del mensaje apuntado.
ENDC
#DEFINE SalidaAdelante PORTB,3 ; Define dónde se sitúan las salidas.
#DEFINE SalidaAtras PORTB,2
#DEFINE SalidaIzquierda PORTB,1
#DEFINE SalidaDerecha PORTB,0
TECLA_ADELANTE EQU 't' ; Código de las teclas utilizadas.
TECLA_ATRAS EQU 'b'
TECLA_IZQ EQU 'a'
TECLA_DER EQU 'l'
TECLA_PARADA EQU ' ' ; Código de la tecla espaciadora, (hay un espacio,
; tened cuidado al teclear el programa).
; ZONA DE CÓDIGOS ********************************************************************
ORG 0
Inicio
call LCD_Inicializa
call RS232_Inicializa
bsf STATUS,RP0 ; Configura como salidas las 4 líneas del
bcf SalidaAdelante ; del Puerto B respetando la configuración del
bcf SalidaAtras ; resto de las líneas.
bcf SalidaIzquierda
bcf SalidaDerecha
bcf STATUS,RP0
call Parado ; En principio todas las salidas deben estar
Principal ; apagadas.
call RS232_LeeDato ; Espera a recibir un carácter.
07/12/[email protected]
112
CÓDIGO ENSAMBLADOR DEL PIC16F84A
call TesteaTeclado
goto Principal
; "Mensajes" ----------------------------------------------------------------------------
;
Mensajes
addwf PCL,F
MensajeParado
DT "Sistema PARADO", 0x00
MensajeAdelante
DT "Marcha ADELANTE", 0x00
MensajeAtras
DT "Marcha ATRAS", 0x00
MensajeIzquierda
DT "Hacia IZQUIERDA", 0x00
MensajeDerecha
DT "Hacia DERECHA", 0x00
; Subrutina "TesteaTeclado" -------------------------------------------------------------
;
; Testea el teclado y actúa en consecuencia.
TesteaTeclado
movwf TeclaPulsada ; Guarda el contenido de la tecla pulsada.
xorlw TECLA_ADELANTE ; ¿Es la tecla del movimiento hacia adelante?
btfsc STATUS,Z
goto Adelante ; Sí, se desea movimiento hacia adelante.
;
movf TeclaPulsada,W ; Recupera el contenido de la tecla pulsada.
xorlw TECLA_ATRAS ; ¿Es la tecla del movimiento hacia atrás?
btfsc STATUS,Z
goto Atras ; Sí, se desea movimiento hacia atrás.
;
07/12/[email protected]
113
CÓDIGO ENSAMBLADOR DEL PIC16F84A
movf TeclaPulsada,W ; Recupera el contenido de la tecla pulsada.
xorlw TECLA_IZQ ; ¿Es la tecla del movimiento hacia la izquierda?
btfsc STATUS,Z
goto Izquierda ; Sí, se desea movimiento hacia la izquierda.
;
movf TeclaPulsada,W ; Recupera el contenido de la tecla pulsada.
xorlw TECLA_DER ; ¿Es tecla del movimiento hacia la derecha?
btfsc STATUS,Z
goto Derecha ; Sí, se desea movimiento hacia la derecha.
;
movf TeclaPulsada,W ; Recupera el contenido de la tecla pulsada.
xorlw TECLA_PARADA ; ¿Es la tecla de parada?.
btfss STATUS,Z
goto Fin ; No es ninguna tecla de movimiento. Sale.
Parado
bcf SalidaAdelante ; Como se ha pulsado la tecla de parada se
bcf SalidaAtras ; desactivan todas las salidas.
bcf SalidaIzquierda
bcf SalidaDerecha
movlw MensajeParado
goto Visualiza
Adelante
bcf SalidaAtras
bsf SalidaAdelante
bcf SalidaIzquierda
bcf SalidaDerecha
movlw MensajeAdelante
goto Visualiza
Atras
bcf SalidaAdelante
bsf SalidaAtras
bcf SalidaIzquierda
bcf SalidaDerecha
07/12/[email protected]
114
CÓDIGO ENSAMBLADOR DEL PIC16F84A
movlw MensajeAtras
goto Visualiza
Izquierda
bcf SalidaAdelante
bcf SalidaAtras
bsf SalidaIzquierda
bcf SalidaDerecha
movlw MensajeIzquierda
goto Visualiza
Derecha
bcf SalidaAdelante
bcf SalidaAtras
bcf SalidaIzquierda
bsf SalidaDerecha
movlw MensajeDerecha
; Según el estado de las salidas visualiza el estado del sistema en el visualizador LCD y en
; el monitor del ordenador.
Visualiza
movwf MensajeApuntado ; Guarda la posición del mensaje.
call LCD_Borra ; Borra la pantalla del modulo LCD.
movf MensajeApuntado,W ; Visualiza el mensaje en la pantalla
call LCD_Mensaje ; del visualizador LCD.
call RS232_LineasBlanco ; Borra la pantalla del ordenador.
movf MensajeApuntado,W
call RS232_Mensaje ; Lo visualiza en el HyperTerminal.
call RS232_LineasBlanco
Fin return
INCLUDE <RS232.INC>
INCLUDE <RS232MEN.INC>
INCLUDE <LCD_4BIT.INC>
07/12/[email protected]
115
CÓDIGO ENSAMBLADOR DEL PIC16F84A
INCLUDE <LCD_MENS.INC>
INCLUDE <RETARDOS.INC>
END
; ===================================================================
; Del libro "MICROCONTROLADOR PIC16F84. DESARROLLO DE PROYECTOS"
; E. Palacios, F. Remiro y L. López. www.pic16f84a.org
; Editorial Ra-Ma. www.ra-ma.es
; ===================================================================
07/12/[email protected]
116
CÓDIGO ENSAMBLADOR DEL PIC16F84A
RS232_11.HEX
:10012000080085158316051685118312080008300E
:100130008E00051A99288F2191210310051A0314A6
:100140008F0C8F218E0B9D288C210F080800303ECC
:100150008F0008308E0085118F218F0C031CB22870
:100160008515B32885118F218E0BAD2885158C211F
:10017000080090000C309002900310080C209100B1
:1001800091080319C628A820900ABD2808000A3043
:1001900092000A30A820920BC9280D30A820080030
:1001A00083160510051185108312851005110510A1
:1001B0009F213030EA20A3213030EA208C213030DA
:1001C000EA2094212030EA209421142112211021C8
:1001D000FE200800F039930006080F3993048316B7
:1001E000060895000F308605831213088600051552
:1001F000051183161508860083120800063015299C
:1002000080301529C030152994301529D43015298E
:1002100080381529C0381529083015290E301529C0
:100220000C3015290130152928300510192905141D
:1002300021219400EA20140EEA20051CA521912119
:1002400008009300F13C031D2829EE309300352966
:100250001308D13C031D2F29EE30930035291308D4
:10026000BA3C031D3529DF30930013080800103015
:100270003E2901303E2902303E29033096002030CD
:100280001721960B3F2908009700F039031D4C29D0
:10029000203017214E299700170E4F2117080F39CC
:1002A0009600093C031C57291608303E59291608A8
:1002B000373E172998000C309802980318080C2034
:1002C00099009908031967291721980A5E290800DF
:1002D00098000C30980298039A01122110301A02EB
:1002E000031D7729992199210F3098026C2918084C
:1002F0000C20990099080319812917219A0A980A54
:100300006E2908000000000000000000000000004E
:1003100008000000A43095290000403095291F30C6
:10032000952900000E30952905309B009B0B9629DE
:100330000800C830A8296430A8293230A829143010
:10034000A8290A30A8290530A8290230A829013097
:100350009C00F9309B0000009B0BAB299C0BA9294A
:100360000800C830BC296430BC293230BC291430A4
:10037000BC290A30BC2905309D0064309C00F9304E
:100380009B0000009B0BC1299C0BBF299D0BBD2925
:02039000080063
:02400E00F13F80
:00000001FF
Abre un archivo de texto y pega el código que ves a la izquierda. Fíjate que al final del código del todo, debes dejar justo abajo un espacio pulsando la tecla “Enter”.
Precisamente aquí :00000001FF al final donde hay dos F pulsa Enter una vez.
Guarda el archivo de texto con la extensión .hex o llámalo así RS232_11.hex.
Si deseas guardar los datos al PIC, hay un manual de cómo hacerlo explicado haciendo clic con el ratón aquí.
07/12/[email protected]
117
CÓDIGO ENSAMBLADOR DEL PIC16F84A
Se preguntará el motivo de poner esas letras en los botones. ¿Por qué esas letras?
El programa del microcontroladorPIC16F84A tiene configuradas esas cuatro letras que significan lo que muestra en el cuadro de la derecha.
Desde el código fuente se puede modificar las letras o números que quieras.
07/12/[email protected]
118
TECLA MOVIMIENTO
t Adelante
b Atrás
a Izquierda
l Derecha
(Espacio) Parada
CÓDIGO ENSAMBLADOR DEL PIC16F84A
Mirando la tabla ASCII 1
de este manual o el
APÉNDICE G del libro,
debemos tener
presente cual es cual
expresado en
hexadecimal.
Por ejemplo, la letra “t”
minúscula en
hexadecimal es el “74”.
07/12/[email protected]
119
CÓDIGO ENSAMBLADOR DEL PIC16F84A
En el Visual C# vamos a usar los caracteres hexadecimales que muestra en el cuadro de la derecha para enviar datos al PIC16F84A.
No hace falta que mires la tabla ascii ya que precisamente vamos a usar la indicada aquí, excepto, que desees usar otros carácteres.
07/12/[email protected]
120
Hex Carácter
74 t
62 b
61 a
6C l
20 (Espacio)
PRIMER CÓDIGO C#
Vamos a introducir los primeros códigos C# en los botones y hacer funcionar a la primera apagar y encender los Ledal mismo tiempo el mensaje que muestra en el LCD.
Los mensajes del LCD más adelante lo haremos también por la interfaz del Visual C#.
07/12/[email protected]
122
PRIMER CÓDIGO C#
Se recomienda probar el montaje del circuito si
funciona bien con el HyperTerminal de
Windows bien explicado en el libro
www.pi16f84a.org.
Cuando compruebes que toda va bien el
circuito, empezamos a programar en C#.
07/12/[email protected]
123
PRIMER CÓDIGO C#
Puesta en marcha de la comunicación entre ordenador y PIC16F84A, circuito 20-13.
Tengo dificultades para conseguir poner en marcha la comunicación entre un ordenador y el PIC16F84A del circuito de la figura 20-13, ¿qué puedo hacer?
Le aconsejamos que siga el siguiente procedimiento:
Compruebe con detenimiento el correcto montaje del esquema de la figura 20-13, en especial la conexión del MAX232, cableado del conector y polaridad de los condensadores.
Con un polímetro compruebe el cable de conexión, para ello mida la continuidad entre los pines 2 de los conectores macho y hembra, y repita la operación para los pines 3 y pines 5. Algunos lectores que se construyen ellos mismo el cable RS232 con conectores DB9, conectan uno al revés. Esta es la avería más frecuente.
Para un MAX232 los condensadores C1, C3, C5 y C6 deben ser de 1 microfaradios. Se ha detectado que hay lectores que tienen dificultades en la lectura del código en los condensadores y utilizan otros valores muy diferentes.
Compruebe que el puerto seleccionado en el Hyperterminal corresponde con el realmente utilizado en el ordenador, COM 1 ó COM2. Compruebe que la configuración del puerto corresponde fielmente a la figura 20-10 del libro.
Compruebe el correcto funcionamiento del MAX232 para ello, en reposo (y con el Hyperterminal conectado), debe tener las siguientes tensiones respecto de masa:
- En el pin 16 tiene que haber + 5 V.- En los pines 11 y 12 tiene que haber entre + 3 y + 5 V.- En los pines 6, 13 y 14 tiene que haber entre -7 V y -12 V.
Si todos los puntos anteriores son correctos pruebe de nuevo su circuito con el fichero actualizado LibreriaRS232.INC (5.51 kB) que se ha incluido en el capítulo 20 de la sección Proyectos y el programa ejemplo RS232_02.asm del CDROM que acompaña al libro.
Ver aquí.
07/12/[email protected]
124
PRIMER CÓDIGO C#
Hay varias formas de
seleccionar un objeto.
Como indica la imagen
de la derecha, en
“Esquema de
documento” ya
explicado anteriormente
o simplemente
pinchando una vez
encima del botón t.
07/12/[email protected]
125
PRIMER CÓDIGO C#
Pulsamos el botón
“Eventos” y hacemos
doble clic con el ratón
donde indica la flecha
roja.
07/12/[email protected]
126
PRIMER CÓDIGO C#
Saltamos a la pestaña
“Form1.cs” y se nos ha
creado el código del
evento:
private void
button_t_Click(object
sender, EventArgs e)
{
}
07/12/[email protected]
127
PRIMER CÓDIGO C#
Volvamos a la pestaña
“Form1.cs[Diseño]” y
nos fijamos que se ha
creado el evento
“button_t_Click”.
07/12/[email protected]
128
PRIMER CÓDIGO C#
La manera más cómoda es pinchando dos veces clic en el botón en este caso el de la letra “t” para ir al código del evento generado, es decir, que al pulsar el botón una vez, se ejecuta una acción.
A partir de ahora utilizamos este método por ser más rápido, el pinchar dos veces un botón.
07/12/[email protected]
130
PRIMER CÓDIGO C#
Aquí por primera vez vamos a usar el código en
C# creado por nosotros mismos.
En cada botón enviamos los datos para activar
los led.
Nos aseguramos que el circuito funciona muy
bien como había dicho.
07/12/[email protected]
131
PRIMER CÓDIGO C# (OBJETIVO)
1) Introducir códigos en los botones para su
funcionamiento.
2) Depurar nuestra aplicación.
07/12/[email protected]
132
PRIMER CÓDIGO C#
Al hacer clic o pinchar dos veces el botón “t”,
se genera el código del evento de un clic para
nosotros poder poner el código necesario en su
interior, y poder enviar datos al puerto serie
RS232 al PIC16F84A.
El código generado del “button_t” es el que se
muestra en la página siguiente.
07/12/[email protected]
133
PRIMER CÓDIGO C#
El código que vamos a introducir para que el
PIC16F84A lea la letra “t” es este:
byte[] mBuffer = new byte[1];
mBuffer[0] = 0x74; //ASCII letra "t".
serialPort1.Write(mBuffer, 0,
mBuffer.Length);
07/12/[email protected]
135
PRIMER CÓDIGO C#
Fíjate bien en el dibujo de la página anterior
que un texto con un cuadro amarillo dice:
“El nombre „serialPort1‟ no existe en el
contexto actual”
Nos faltan dos cosas para tener un buen
funcionamiento del programa.
07/12/[email protected]
137
PRIMER CÓDIGO C#
Ahora introduces el
siguiente comando:
using System.IO.Ports;
07/12/[email protected]
139
PRIMER CÓDIGO C#
En el “Cuadro de herramientas”, “Componentes”, pincha o haces dos veces click en el objeto SerialPort. (También puedes arrastrarlo al formulario).
Como verás, abajo se ha introducido un nuevo objeto llamado “serialPort1” y no está dentro del formulario porque no es un objeto visible, sólo tiene funciones internas.
Con él podemos configurar el puerto serie “COM 1”.
07/12/[email protected]
140
PRIMER CÓDIGO C#
Aunque mediante programación se puede hacer lo mismo, más cómodo, fácil y rápido es utilizar este componente serialPort1, al lado cambiamos sus propiedades.
Lo demás, está bien salvo en “StopBits” lo ponemos a Two como indica la imagen.
07/12/[email protected]
142
PRIMER CÓDIGO C#
El programa
RS232_11.asm que
acompaña el libro,
utiliza los datos de
comunicación es el que
muestra en la imagen
de la derecha.
07/12/[email protected]
143
Propiedad Cambiar a
BaudRate 9600
DataBits 8
Handshake None
Parity None
PortName COM1
StopBits Two
PRIMER CÓDIGO C#
Una vez todo hecho como indica las páginas
anteriores, el código fuente sería tan simple como
indica en la página siguiente.
Hay una parte del código que he agregado texto:
mBuffer[0] = 0x74; //ASCII letra "t".
Poner las dos barras // expresan textos para
poder explicar algún comentario en el compilador
al igual que lo hacemos con ; en el MPLAB al
escribir en ensamblador.
07/12/[email protected]
144
PRIMER CÓDIGO C#
Aún no hemos acabado. Introduces este código debajo del InitializeComponent();.
// Abrir puerto mientra se ejecute la aplicación
if (!serialPort1.IsOpen)
{
try
{
serialPort1.Open();
}
catch (System.Exception ex)
{
MessageBox.Show(ex.ToString());
}
}
07/12/[email protected]
146
PRIMER CÓDIGO C#
Para saber el números
de líneas en el editor de
Visual C#, pulsa:
Herramientasopcione
s…
07/12/[email protected]
147
PRIMER CÓDIGO C#
Se abre la ventana
opciones.
Abajo, pincha “Mostrar
todas las
configuraciones”.
07/12/[email protected]
148
PRIMER CÓDIGO C#
Fíjate en las flechas
rojas. Señala General, y
después marca la
casilla “Números de
línea”.
Al finalizar pulsa
“Aceptar”.
07/12/[email protected]
150
PRIMER CÓDIGO C#
Ya podemos guiarnos
mejor con los números
de línea que muestra en
el compilador.
Ahora continuamos con
el código fuente que
debería ser igual que
has hecho hasta ahora
como muestra en las
siguientes páginas.
07/12/[email protected]
152
PRIMER CÓDIGO C#
07/12/[email protected]
155
Guarda todo el proyecto y compila pulsando
“F5”.
El único botón funcional es el “button_t”, que
al pulsarlo se enciende un Led y en el LCD
visualiza: Marcha ADELANTE.
Sigamos introduciendo líneas de código para
los otros botones con su letra o carácter
correspondiente.
PRIMER CÓDIGO C#
En el formulario, pincha dos veces click en el
botón b e introduce los códigos necesarios.
byte[] miBuffer = new byte[1];
miBuffer[0] = 0x62; //ASCII letra "b".
serialPort1.Write(miBuffer, 0,
miBuffer.Length);
07/12/[email protected]
156
PRIMER CÓDIGO C#
Sigue así con los demás botones. El
procedimiento es el mismo que el primer
botón.
A continuación mostramos el código fuente
completo.
07/12/[email protected]
157
PRIMER CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 1
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 1” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 1
Fuente 1
07/12/[email protected]
162
RECIBIR MENSAJES
Objetivos:
Leer los datos del PIC16F84A desde
la interfaz del PC.
1) Arrastrar StatusStrip o barra de estado al formulario.
2) Un TextBox para leer los mensajes del PIC.
3) Un Label o etiqueta.
4) Poner el TextBox en modo lectura.
5) Código para el TextBox.
6) Escribir código en el StatusStrip para mostrar la hora.
7) Depurar nuestra aplicación.
07/12/[email protected]
164
RECIBIR MENSAJES
En el “Cuadro de
herramientas”, “Menús
y barra de
herramientas”, clickea
dos veces al control
StatusStrip.
Comprobarás en la
página siguiente que se
introduce a la base del
formulario.
07/12/[email protected]
165
RECIBIR MENSAJES
Arrastra un TextBox al formulario.
Esté donde esté colocado el TextBox dentro del formulario, verás que se irá colocando correctamente según cambies las propiedades del recuadro.
Fíjate en la página siguiente que vamos a cambiar otra propiedad llamada “Dock”.
Propiedad Cambiar a
ScrollsBar Vertical
Multilinea True
(Name) textBox_visualizar_
mensaje
Anchor Top, Bottom, Left,
Right
Location 0; 132
Size 287; 82
07/12/[email protected]
167
RECIBIR MENSAJES
Puedes cambiar la propiedad “Dock” a “Bottom” para pegarlo hacia abajo y las paredes.
También puedes hacerlo más cómodo como se muestra en la imagen de la página siguiente.
Si cambias “Dock” a “Bottom”, automaticamente, “Anchor” se vuelve a cambiar sólo a “Top, Left”.
Vuelva a cambiar “Anchor” a “Top, Bottom, Left, Right”.
Al final “Dock” se cambia a “None”.
Si logramos esto, a la hora de Maximizar la ventana, el “textBox_visualizar_mensaje” se redimensiona bien.
Propiedad Cambiar a
Dock Bottom
07/12/[email protected]
168
RECIBIR MENSAJES
Todo debería quedar así
siguiendo el pie de la
letra para que al
Maximizar el formulario,
el
“textBox_visualizar_men
saje” lo haga
correctamente.
07/12/[email protected]
169
Propiedad Cambiar a
ScrollsBar Vertical
Multilinea True
(Name) textBox_visualizar_
mensaje
Anchor Top, Bottom, Left,
Right
Location 0; 132
Size 287; 82
Dock None
RECIBIR MENSAJES
Debe por ahora quedar como muestra en la imagen de la derecha.
Si toda va bien, sigue adelante.
Si no te ha ido bién, pulsa “Control+Z” para retroceder hasta llegar el punto donde cometiste algún error y poder corregir.
07/12/[email protected]
171
RECIBIR MENSAJES
Arrastra un Label en el
formulario y cambia sus
propiedades como
indica el recuadro.
07/12/[email protected]
172
Propiedad Cambiar a
Text Mensaje desde el
PIC
(Name) label_mensaje_pic
Autosize True
Location 25; 146
Size 110; 13
RECIBIR MENSAJES
Pulsa en la barra de
herramientas.
“VerOrden de
tabulación” y muestra
algo similar en l
aimagen.
07/12/[email protected]
173
RECIBIR MENSAJES
Deja como muestra en
la imagen el orden de
tabulación.
Puedes si lo deseas
poner el orden que
prefieras.
Para quitar los números
que se ve de la
tabulación, “VerOrden
de tabulación”.
07/12/[email protected]
174
RECIBIR MENSAJES
Si lo deseas, en el control ahora llamado “textBox_visualizar_mensaje”, puedes dejarlo en modo lectura para que no pueda modificar su contenido al recibir mensajes desde el pic.
En mi caso, no activo el modo lectura y lo dejo en “False”.
07/12/[email protected]
175
Propiedad Cambiar a
ReadOnly True
RECIBIR MENSAJES
Nos toca introducir los códigos necesarios para que el “textBox_visualizar_mensaje” pueda recibir los mensajes de avisos desde el PIC.
Introduce este código de abajo,
07/12/[email protected]
176
// Utilizaremos un string como buffer de recepcion
string Recibidos;
justo debajo del
public partial class Form1 : Form
{
RECIBIR MENSAJES
07/12/[email protected]
178
Ahora toca a por el siguiente código.
Fíjate dónde está colocado en la líneas de
números del compilador.
Seguiremos así sucesivamente.
RECIBIR MENSAJES
hh:mm:ss
Representa hh a horas, mm a
minutos y ss a segundos.
Vamos a poner la hora local
de nuestro Sistema
Operativo en el
“StatusStrip1”.
Arrastra el “Timer” al
formulario con lo cual, se
llama “timer1” que lo
queremos para actualizar lo
valores de la hora.
07/12/[email protected]
182
RECIBIR MENSAJES
Vamos a añadir la hora
local de nuestro
Sistema Operativo en el
“StatusStrip1”.
Señala con el ratón el
StatusStrip1.
07/12/[email protected]
184
RECIBIR MENSAJES
Eliges “StatusLabel”
como indica la flecha
roja de más bajo.
07/12/[email protected]
185
RECIBIR MENSAJES
Se ha creado un
“toolStripStatusLabel1”.
En la propiedad “Text”,
sustituye el valor
“toolStripStatusLabel1”
por el valor “hh:mm:ss”.
Como dije antes,
significa, horas, minutos
y segundos.
07/12/[email protected]
186
RECIBIR MENSAJES
Selecciona el componente “timer1” y cambie de propiedades como indica en cuadro.
“Enabled” en “True” activa el “timer1”.
“Interval” a “1000”, 1000 significa 1 segundo como 15000, 15 segundos.
Se expresa en milisegundos, así, 1000 milisengundos que en realidad es 1 segundo.
1000 miliseg. = 1 seg.
07/12/[email protected]
188
Propiedad Cambiar a
Enabled True
Interval 1000
RECIBIR MENSAJES
Pincha dos veces al
componente “timer1”
para que puedas
introducir el código
necesario de la hora
local de Windows.
07/12/[email protected]
189
RECIBIR MENSAJES
En su interior del código del “timer1”,
introduce:
07/12/[email protected]
192
statusStrip1.Items[0].Text =
DateTime.Now.ToLongTimeString();
RECIBIR MENSAJES
07/12/[email protected]
194
Comprueba a partir de la página siguiente el
código fuente completo.
Hemos llegado a 90 líneas de código muy
rápido.
RECIBIR MENSAJES
07/12/[email protected]
200
Ya, en el último paso de este objetivo, guarde todo el proyecto y pulsa “F5” para compilar o depurar tu programa.
Recuerda que en el “textBox_visualizar_mensaje” si has dejado el valor True o False en “ReadOnly” (Solamente lectura), no solo le afecta el comportamiento si no el color, es decir, su apariencia.
En la siguiente página sabrás la diferencia y si has activado “ReadOnly” o no a “True”.
CÓDIGO C#
DESCARGA CÓDIGO FUENTE 2
Perfectamente ya puedes
probar el programa con el
circuito.
Si algo falla, vuelve a empezar
desde el principio o
simplemente te descargas el
archivo “Fuente 2”.
Este es el final de la aplicación
de la interfaz aunque puedes
ampliar algunos extras en
páginas siguientes.
Fuente 2
Fuente 2
07/12/[email protected]
202
EXTRAS
A partir de aquí, ciertas funciones del programa no hace falta aunque otras son recomendables como hacer un cuadro de información de la aplicación normalmente llamado “Acerca de…”.
Podrás introducir información como la página Web oficial, correo electrónico para contactar, versión, logotipo, etc.
Con el tiempo, según voy actualizando este manual y sin previo aviso, quizás encuentren en esta parte del tema “Extras” algunos tutoriales nuevos.
07/12/[email protected]
204
ACERCA DE…
En cualquier programa tienen un cuadro de
información “Acerca de…”, me gustaría hacer algo
similar. ¿Cómo puedo hacerlo?
Hay varias formas de mostrar información del
programa y vamos a aprender hacer varios y entre
ellas elegirás la que más interese. Por ejemplo, un
cuadro de información básica donde solo se
mostrará texto y un icono de información, otro más
complejo, detallado y con logotipo.
07/12/[email protected]
205
ACERCA DE…
Objetivos:
Vamos a insertar varios tipos de
cuadros de información “Acerca
de…”.
En tu aplicación final, sólo elegirás
uno, en este ejemplo hacemos unos
cuantos para que veas cual se te
adapta mejor.
1) Insertar un control “MenuStrip” al formulario.
2) Salir.
3) Llamar manual.pdf en ayuda.
4) Crear una ventana “Acerca de …” básico.
5) Crear otra ventana “Acerca de…” con un Form.
6) Agregar enlaces a Web.
07/12/[email protected]
206
ACERCA DE…
Antes que nada, haga una copia de seguridad
de su proyecto completo a una carpeta o
directorio.
Siempre es bueno hacer una copia de
seguridad antes de realizar alguna
modificación.
07/12/[email protected]
207
ACERCA DE…
Como en cualquier programa, muchos tienen menú de opciones arriba.
Podemos introducir cualquier opción que veremos poco a poco a lo largo del curso.
Pincha o clickea dos veces el control “MenuStrip” con lo cual se agrega en la parte inferior “menuStrip1”.
07/12/[email protected]
208
ACERCA DE…
Selecciona el objeto “menuStrip1”, en el cuadro de propiedades. Pulsa el valor de la propiedad “(Colección)” del “Items”.
Podrás configurar las opciones que muestra la ventana en la página siguiente pero, no vamos a usar este método sino uno más directo y sencillo.
07/12/[email protected]
210
ACERCA DE…
Pulsa “Cancelar” de la ventana “Editor de la colección de elementos” para cerrarla.
Nos centraremos directamente en la barra de menú.
Pincha una vez donde indica la imagen de la derecha, escribe “Opciones” y pulsa “Enter”.
07/12/[email protected]
212
ACERCA DE…
Se ha creado
“Opciones” y ahora
abajo donde indica la
flecha roja introduce
“Salir”.
07/12/[email protected]
213
ACERCA DE…
Al lado introduces
“Ayuda” y abajo “Acerca
de…”.
Bien, justo abajo
introduces el guión –
normal (No el guión
bajo) y pulsa “Enter”.
Verás una raya de
separación.
07/12/[email protected]
214
ACERCA DE…
Justo de bajo de la raya pon “Acerca de 2…” que es para introducir el segundo ejemplo de ventanas de información.
Como muestra la imagen, falta una opción que introduciremos abajo y se llama “Contenido”.
07/12/[email protected]
215
ACERCA DE…
“Contenido” es la ayuda
del programa que
puede ser desde un
formulario o archivo
externos que pueden
ser PDF, XPS, DOC,
DOCX, HTML, etc.
07/12/[email protected]
216
ACERCA DE…
“Contenido” lo
queremos arriba, así
que, pincha sin soltar
con el ratón y arrástralo
encima de “Acerca
de…”.
Si no lo has introducido
bien, sólo tienes que
corregirlo con deshacer
pulsando “Control + Z”.
07/12/[email protected]
217
ACERCA DE…
Muchas personas en cualquier programa, accedemos a los menús directamente con el teclado. Así que, vamos a colocar este símbolo “&” que está encima de la tecla “6”.
En “Ayuda” ponemos la “&” delante de la “y” para que queda señalada en una raya debajo indicando la tecla de acceso. Por ejemplo, “A&yuda” y se muestra así:
Ayuda.
07/12/[email protected]
218
ACERCA DE…
En este caso
“&Opciones”, debajo
“&Salir” así
sucesivamente.
No se debe repetir la
misma letra en el
mismo formulario.
También puedes
introducir la “&” en
botones.
07/12/[email protected]
219
& Resultado
&Opciones Opciones
&Salir Salir
A&yuda Ayuda
Ac&erca de… Acerca de…
Ace&rca de 2… Acerca de 2…
ACERCA DE…
Vamos a introducir el
código Close();
pinchando dos veces en
“Salir”.
07/12/[email protected]
220
ACERCA DE…
Al introducir Close(); una cosa muy importante.
Guarda todo el proyecto que hemos hecho hasta ahora.
Ejecuta, compila o depura con “F5” o la flecha verde el programa o aplicación y comprueba que se cierra.
07/12/[email protected]
221
ACERCA DE…
Ahora nos toca abrir un archivo de ayuda en
pdf dentro de “AyudaContenido”.
De momento introducimos estos códigos
necesarios para abrir el “manua.pdf” que por
ahora no está. Como no lo encuentra, nos avisa
con un mensaje.
07/12/[email protected]
223
ACERCA DE…
Has doble click en
“Contenido” e introduce
el código que muestra
en la página siguiente.
07/12/[email protected]
224
ACERCA DE…
No olvides poner el
“using” que indica en la
imagen si no lo habías
puesto ya.
07/12/[email protected]
228
ACERCA DE…
Guarda todo el proyecto
y pulsa “F5” para
depurar.
Ejecuta
“AyudaContenido”.
Verás una ventana que
se llama “Aviso:” porque
no encuentra el archivo
“manual.pdf”.
07/12/[email protected]
229
ACERCA DE…
Busca cualquier archivo que tengas de pdf y
llámalo “manual.pdf”.
En realidad has una copia y renómbralo.
Debes tener el Adobe Reader Instalado, si no lo
tienes lo descarga gratuitamente aquí
www.adobe.es .
07/12/[email protected]
231
ACERCA DE…
En cualquiera de las
pestañas, fijándote bien
en la imagen y el de la
página siguiente,
clickea con el botón
derecho y pinchas en
“Abrir carpeta
Contenido”.
07/12/[email protected]
232
ACERCA DE…
Has abierto la carpeta o
directorio del proyecto.
Dentro de ella vamos a
llegar al archivo llamado
“PicRS232.exe” que es
el ejecutable.
07/12/[email protected]
234
ACERCA DE…
Entra en la carpeta
“bin\Debug” y aquí
colocarás cualquier
ayuda, tutorial o manual
que quieras y extensión
que quieras.
07/12/[email protected]
235
ACERCA DE…
Aquí colocamos el archivo “manual.pdf” que vamos a llamar.
Aquí si lo deseas, puedes coger el “PicRS232.exe” y “manual.pdf” para entregarlo a tus amigos.
Una vez colocado podemos cerrar el directorio.
07/12/[email protected]
236
ACERCA DE…
Pulsa “F5” para depurar
el programa y
comprueba que el
archivo “manual.pdf” se
ejecuta.
07/12/[email protected]
237
ACERCA DE…
Hasta aquí hemos llegado. Si ha ido bien, sigue adelante, en caso contrario revisa paso a paso lo que has hecho.
Continuamos con las ventanas de información “Acerca de…”.
Utilizamos dos diseños en el mismo programa para aprender, en realidad se usa uno. Cuando veas el más que te guste, ya harás uno a tu estilo.
07/12/[email protected]
238
ACERCA DE…
Se ha creado el código
necesario para que en
su interior introduzca
los códigos que se
muestra en la página
siguiente.
07/12/[email protected]
240
ACERCA DE…
Es una ventana muy
simple pero de
información eficaz.
Si quieres conseguir
separación de líneas
como la palabra
LICENCIA como vez hay
espacio entre el texto
siguiente, pon \n.
07/12/[email protected]
242
ACERCA DE…
Muy rápida el “Acerca de…” en realizar, pero
probaremos algo más complejo con “Acerca de
2…”.
En este caso utilizaremos el Form2 y lo
llamaremos, antes lo diseñamos a nuestro
gusto.
07/12/[email protected]
244
ACERCA DE…
Podemos crear un cuadro de acerca de desde
cero con lo que nos llevará más tiempo.
En mi caso he hecho uno a mi estilo como
comprobarás en las páginas siguientes.
Uno normal y el otro es igual sólo que he
modificado colores a oscuro.
07/12/[email protected]
245
ACERCA DE…
En el Visual C# 2008 Express, se incluye uno en una plantilla para ahorrar tiempo en el cual vamos a usar en este caso.
Pinche con el botón derecho del ratón y siga el orden de las flechas hasta ejecutar “Nuevo elemento…”.
07/12/[email protected]
248
ACERCA DE…
Se abre la ventana “Agregar nuevo elemento PicRS232”.
Seleccionamos en “Palntilla”, “Cuadro Acerca de”.
Abajo en “Nombre” introducimos “AcercaDe.cs” y pulsamos el botón “Agregar”.
07/12/[email protected]
249
ACERCA DE…
Aparece en el
“Explorador de
soluciones” el
formulario llamado
“AcercaDe.cs” que
hemos asignado.
07/12/[email protected]
251
ACERCA DE…
Como vemos en la
imagen. Se ha creado
un completo cuadro de
“Acerca de…”. Nos
hemos ahorrado mucho
tiempo, sólo lo
adaptamos a nuestro
estilo.
07/12/[email protected]
252
ACERCA DE…
En cada elemento de
los “label”, el nombre
del Form cambiamos y
demás, lo adaptamos
sin compromiso igual
como hemos hecho en
temas atrás.
Recuerda que los label
se cambia las
propiedades “Text”.
07/12/[email protected]
253
ACERCA DE…
Hacemos una vez un
click en el logotipo.
Muestra un cuadradito
muy pequeño con una
flecha dentro.
Púlsalo como indica en
la imagen en rojo.
07/12/[email protected]
254
ACERCA DE…
Se muestra una ventana “Tareas de PictureBox”.
Vamos a cambiar el logotipo por uno creado por nosotros mismos. He elegido 120 pixel de anchura por 242 pixel de altura.
En el cuadro Pulsa “Elegir imagen”.
07/12/[email protected]
255
ACERCA DE…
Vamos a sustituir el
logotipo de la plantilla
por el nuestro.
En el “Contexto del
recurso” selecciona
“Archivo de recurso del
proyecto”.
07/12/[email protected]
256
ACERCA DE…
Ahora vamos a
introducir nuestro
logotipo.
Pulsa el botón
“Importar”.
07/12/[email protected]
257
ACERCA DE…
Este logotipo se llama
145.png.
Puedes poner la
extensión que quieras
que te acepta muchas.
Ahora pulsa aceptar.
07/12/[email protected]
258
ACERCA DE…
Aunque ejecutemos
nuestra aplicación, no
podemos visualizar el
cuadro de “Acerca de…”
porque aún no lo hemos
invocado.
¿Por qué?
Porque aún no lo hemos
programado.
07/12/[email protected]
259
ACERCA DE…
Como vez, se ha
generado código para
introducir más código y
poder llamar el cuadro
de información.
07/12/[email protected]
261
ACERCA DE…
Introduces este código y
podrás invocar el
famoso cuadro de
“Acerca de…” o cuadro
de información.
Guarda todo el proyecto
y pulsa “F5” para que
compruebes el
resultado.
07/12/[email protected]
262
ACERCA DE…
Por fin hemos podido
invocar o llamar al
cuadro de información
pero…
No es el resultado
esperado.
Por supuesto que no, ya
que en él tiene su
código interno y hay una
explicación.
07/12/[email protected]
263
ACERCA DE…
Mira el código del
“AcercaDe.cs”.
Muy bien claro que este
código está el motivo
del resultado así con lo
que hemos hecho no
vale de nada, ¿o si?
07/12/[email protected]
265
ACERCA DE…
Si queremos que nos
salga lo que hemos
indicado desde el
principio, ponemos las
dos barras // para
dejarlo como
comentario tal como se
muestra en la imagen
excepto lo señalado con
la flecha roja.
07/12/[email protected]
267
ACERCA DE…
Guarda el proyecto y
depura con “F5”.
Después pulsa
“AyudaAcerca de 2…”
y ya tienes el resultado
esperado.
07/12/[email protected]
269
ACERCA DE…
LICENCIA
Es bueno dejar claro a las
personas si deseas algún día
distribuir tu programa por
internet alguna nota o
Licencia para su uso.
Licencia:
Este programa es absolutamente freeware.
Si no sabes qué quiere decir que un
programa sea freeware, te lo explico:
significa que es gratis, es decir, que no
deberás desembolsar ninguna cantidad
de dinero por su uso. Eso sí, que sea gratis
no quiere decir que puedas hacer con el
programa lo que se te antoje. Por ejemplo,
no puedes modificar su código sin mi
consentimiento expreso; en caso contrario,
estarás violando el copyright de este
programa.
07/12/[email protected]
271
ACERCA DE…
Selecciona vista diseño y vete al “Explorador de soluciones”.
Algo que no he nombrado es la nueva carpeta amarilla que dentro tiene la imagen del logotipo nuestro que añadimos que se llama 145.png
Cualquier imagen que agregamos se incluirá en esa carpeta.
07/12/[email protected]
272
ACERCA DE…
Ahora, dentro de la
carpeta “Properties”, abre
el archivo
“AssemblyInfo.cs.
Verás en su interior de
donde venía y/o viene los
datos que nos salía solo
sin ninguna explicación.
No modifiques nada ya
que lo explicaremos más
adelante.
07/12/[email protected]
273
ACERCA DE…
Si nos interesa el otro
método de agregar
información…
Vamos a ver el código
fuente del
“AcercaDe.cs”.
Quitamos las barras de
comentarios // y lo
dejamos como está.
07/12/[email protected]
275
ACERCA DE…
Con el segundo botón
del ratón, pinchamos o
hacemos click en
“PicRS232” en el
“Explorador de
soluciones”.
Pulsa “Propiedades”.
07/12/[email protected]
276
ACERCA DE…
Se crea la pestaña
“PicRS232” en el cual
vamos a ver y modificar
los datos que aparecen
en el cuadro de
información o “Acerca
de…”.
Pulsa el botón
“Información de
ensamblado…”.
07/12/[email protected]
277
ACERCA DE…
Se abre la ventana
“Información de
ensamblado”.
Aquí se muestra los
datos que veíamos
antes del “Acerca de…”.
07/12/[email protected]
279
ACERCA DE…
Modificamos los valores
que nos interesen y
pulsamos “Aceptar”.
07/12/[email protected]
281
ACERCA DE…
Guarda el Proyecto y
depura con “F5”.
Ejecuta el
“AyudaAcerca de 2…”
y comprueba que has
añadidos los datos que
has introducido.
07/12/[email protected]
283
ACERCA DE…
Antes que nada, ya que estamos aquí.
Si deseas que el logotipo te ejecute una dirección Web y para que los usuarios lo sepan que es un enlace, que se vea la mano del ratón cuando detecte que es enlace al pasar por el logo.
07/12/[email protected]
284
ACERCA DE…
Pulsa el logotipo una
vez y en las
propiedades cambia a
“Hand” del “Cursor”.
Un vez hecho, pincha
dos veces el logotipo
para introducir el
código.
07/12/[email protected]
285
ACERCA DE…
Si te fijas bien, debajo se ve marcado de rojo
porque falta un using.
07/12/[email protected]
287
ACERCA DE…
Guarda el proyecto y depura con “F5” para
probar el enlace y muestra la mano en el
puntero del ratón.
07/12/[email protected]
288
ACERCA DE…
En el ejecutable
“PicRS232.exe”
contiene información
que vamos a ver ahora.
07/12/[email protected]
289
ACERCA DE…
Pulsando las
propiedades del
“PicRS232.exe” como
cualquier otro
programa, vemos toda
la información que
hemos añadido.
07/12/[email protected]
290
ACERCA DE…
Llegamos el final sobre el tema de “Acerca
de…”.
Aunque hemos visto más cosas de la que se
pretendía, aprendimos muchas cosas básicas
para cualquier persona novel.
07/12/[email protected]
291
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 3
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 3” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 3
Fuente 3
07/12/[email protected]
292
ENFOQUE DEL BOTÓN
Al ejecutar mi aplicación, deseo que el enfoque
del botón sea el "Espacio" con motivo de
seguridad que hasta al pulsar Enter, es la tecla
con el que para el sistema. ¿Hay alguna
solución?
07/12/[email protected]
294
ENFOQUE DEL BOTÓN
Objetivos:
Enfocaremos el botón “Espacio”
(también podríamos llamarlo Stop)
que por seguridad es que debemos
detener con el teclado Enter para
parar el sistema.
1) Ajustar el enfoque con
AcceptButton.
2) Tabulación 0.
07/12/[email protected]
295
ENFOQUE DEL BOTÓN
En el formulario
principal
“Form1_Principal”,
ajusta la propiedad
“AcceptButton” al botón
que deseas como el
“Button_Espacio”.
07/12/[email protected]
296
ENFOQUE DEL BOTÓN
Para asegurarte que el
botón “Espacio” tiene
su enfoque, introduce el
valor “0” en “TabIndex”.
07/12/[email protected]
297
ENFOQUE DEL BOTÓN
Si quieres ordenar toda
la tabulación, pulsa
“VerOrden de
tabulación”.
07/12/[email protected]
298
ENFOQUE DEL BOTÓN
Puedes dejar el orden
de tabulación o el que
prefieras.
07/12/[email protected]
299
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 4
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 4” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 4
Fuente 4
07/12/[email protected]
300
REDIMENSIONAR FORMULARIO
Me gustaría no poder redimensionar la ventana
o formulario del programa ya compilado. ¿Se
puede lograr este objetivo?
07/12/[email protected]
302
REDIMENSIONAR FORMULARIO
Objetivos:
El formulario puedo redimensionar al
tamaño que quiera, pero no deseo
que lo haga menor al tamaño
original.
1) Ajustar el
“FormBorderSyle”, es decir,
la apariencia del borde del
formulario.
07/12/[email protected]
303
REDIMENSIONAR FORMULARIO
Hay muchas formas de
comportamiento y
apariencia y la que
vamos a usar para
mantener es el tamaño
de la ventana.
07/12/[email protected]
304
REDIMENSIONAR FORMULARIO
Ya no puedes
redimensionar el
formulario pero si
puedes maximizar.
07/12/[email protected]
305
REDIMENSIONAR FORMULARIO
Ya que estamos, para
los que quieran que el
formulario no maximice,
vamos a poner “False”
en la propiedad del
“MaximizeBox”.
07/12/[email protected]
306
REDIMENSIONAR FORMULARIO
Como podrás ver, se
nota que está
desactivado.
Ahora ya no podrás
maximizar la ventana o
el formulario.
07/12/[email protected]
307
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 5
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 5” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 5
Fuente 5
07/12/[email protected]
308
MÁS AYUDA
A pesar de que ya se ha explicado como
ejecutar la ayuda de nuestro programa
manual.pdf. ¿Hay algún método para ejecutar
más extensiones?
Es decir, si no encuentra manual.pdf que
busque otra extensión que tenga seleccionado
en el programa hasta llegar en un punto de
encontrarlo o de mensaje de error.
07/12/[email protected]
310
MÁS AYUDA
Objetivos:
A veces hacemos las ayudas del
programa en ciertos formatos como
pdf, xps, doc, docx, htm, html, etc o
los viejos conocidos hlp y chm.
Para no sólo dejar un formato en un
programa ya compilado, mejor tener
la oportunidad de encontrar con su
extensión correspondiente.
Si no encuentra ningún manual, nos
avisará un mensaje de error o aviso.
1) Introducir código
necesario para buscar
archivos de ayuda de
extensiones diferentes.
2) Mensaje de error o aviso
sobre el archivo de ayuda
no encontrado.
07/12/[email protected]
311
MÁS AYUDA
Pincha dos veces en
“Contenido”.
Si has seguido el
manual desde el
principio y has
encontrado el código
anterior, borra sólo lo
marcado en azul.
07/12/[email protected]
313
MÁS AYUDA
Sólo deberás dejar el
código libre para
introducir el nuevo en
él.
07/12/[email protected]
315
MÁS AYUDA
Dentro de un interior dicho anteriormente,
introduce estos códigos.
07/12/[email protected]
317
MÁS AYUDA
Guarda el proyecto y
depura con “F5”.
Ahora ejecuta
“AyudaContenido”
para que se muestre la
ventana.
07/12/[email protected]
320
MÁS AYUDA
Con el botón derecho
del ratón, púlsalo y
después clickea en
“Abrir carpeta
Contenido”.
Ahí dentro colocarás
cualquier archivo de
manuales o tutoriales
de ayuda.
07/12/[email protected]
323
MÁS AYUDA
Entre en \bin\Debug y
coloca el archivo de
ayuda correspondiente
de las extensiones ya
programadas.
En este caso coloca
“manual.html” o
cualquiera de ellos.
Pulsa “F5” y comprueba
si te ejecuta la ayuda.
07/12/[email protected]
324
MÁS AYUDA
Introduce todos los
archivos de las
extensiones que has
programado.
07/12/[email protected]
325
MÁS AYUDA
Si compila o depuras el programa con “F5” con todos los archivos sólo se ejecuta el primero que encuentre.
En este caso es el “manual.pdf”.
El motivo es porque es el primero que hemos dado la orden a buscarlo.
07/12/[email protected]
326
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 6
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 6” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 6
Fuente 6
07/12/[email protected]
327
CONTRAER CÓDIGO
Cada vez más el código es grande y no es tan
fácil de llevar. ¿Hay algún método para trabajar
más cómodo?
07/12/[email protected]
329
CONTRAER CÓDIGO
Objetivos:
Vamos a aprender contraer los
códigos para que no molesten al
programar si empezamos a añadir
códigos nuevos.
En este tema, se trata de reducir en
el editor de códigos.
En los códigos que hemos hecho
hasta ahora lo podemos contraer
todos, o en partes.
Mejor lo vemos con ejemplos.
1) ¿Qué es y cómo se utiliza
#region?
2) Contraer códigos con
#region.
07/12/[email protected]
330
CONTRAER CÓDIGO
Vamos a trabajar en la pestaña Form1.cs del formulario principal.
#region permite especificar un bloque de código que se puede expandir o contraer. Al final se cierra con #endregion .
Vamos a cerrar por parte ciertos códigos, donde podamos expandir o contraer.
Ver ejemplo a la derecha.
#region MyClass definitionpublic class MyClass
{
static void Main()
{
}
} #endregion
07/12/[email protected]
331
CONTRAER CÓDIGO
Introducimos la
directiva #region donde
indica la flecha roja.
07/12/[email protected]
332
CONTRAER CÓDIGO
Ahora cerramos la
region con #endregion
que puedes ver en la
flecha roja de la imagen
que muestra en la
derecha.
07/12/[email protected]
334
CONTRAER CÓDIGO
Volvemos arriba en
#region y ves que se ha
mostrado un cuadrado
pequeño con el signo –
que significa que ya
puedes contraer y el +
expandir.
07/12/[email protected]
336
CONTRAER CÓDIGO
Pulsa el cuadrado con
el – para contraer el
código. Se te convierte
e + para volver a
expandir.
07/12/[email protected]
338
CONTRAER CÓDIGO
Para facilitar las cosas,
puedes poner un
comentario sobre la
#region.
Vuelve a expandir.
#region Envío de datos
RS232.
07/12/[email protected]
340
CONTRAER CÓDIGO
Contrae arriba los using,
está arriba del todo.
Como muestra en la
imagen, coloca #region
y contráelo.
07/12/[email protected]
344
CONTRAER CÓDIGO
Fíjate bien y contrae los
demás ya que no te
hace falta porque tiene
su propia region.
Debe quedar como
muestra la imagen.
Se expandirá o no
introduzca cuando
códigos nuevos.
07/12/[email protected]
346
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 7
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 7” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 7
Fuente 7
07/12/[email protected]
348
ICONO
Me gustaría poner un icono que representa mi
programa y en el ejecutable. ¿Cómo se hace y
cuál es el método más adecuado?
07/12/[email protected]
350
ICONO
Objetivos:
Antes que nada debes tener ya un
icono hecho con un programa de
retoques fotográficos como
Photoshop, Paint Shop Pro, Gimp,
etc.
Guárdalo en .PNG a 32x32 píxeles y
entra a esta web www.convertico.com
para que conviertas el archivo .PNG a
.ICO que es el que vamos a usar.
Cuando ya lo tengas preparado,
nuestro objetivo es introducir el icono
en la esquina de la ventana de
nuestro programa y sobre todo en el
ejecutable “PicRS232.exe”.
1) Introducir icono en la
esquina de las ventanas del
programa.
2) Introducir icono para el
ejecutable PicRS232.exe
del programa principal.
07/12/[email protected]
351
ICONO
En “Icon” puedes
colocar el icono del
formulario. Pulsa los …,
elige el “icono.ico” y ya
lo tienes resuelto.
07/12/[email protected]
352
ICONO
Ahora vamos a
introducir el “inoco.ico”
al ejecutable
“PicRS232.exe”.
Con el botón derecho
del ratón, pulsa y en la
ventana emergente
pulsa “Propiedades”.
07/12/[email protected]
354
ICONO
Si no lo está, selecciona
la pestaña “Aplicación”.
Busca el “icono.ico”
donde indica la flecha
roja.
07/12/[email protected]
355
ICONO
Guarde todo el proyecto
y depura con “F5”.
Se muestra ya el icono
en la esquina superior
izquierda.
Cierre el programa.
07/12/[email protected]
358
ICONO
Al depurar o compilar ya
podrás comprobar el
icono en el ejecutable
“PicRS232.exe”.
Abre el contenido de la
carpeta y llega hasta el
directorio \bin\Debug y
fíjate si ya tiene el icono
en el ejecutable.
07/12/[email protected]
359
CÓDIGO C#
PICRS232.SLN DESCARGA CÓDIGO FUENTE 8
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 8” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 8
Fuente 8
07/12/[email protected]
362
NOTIFICACIÓN DEL ICONO
Al igual que algunos programas como el
Windows Live Messenger, Google Talk,
ZoneAlarm, etc. ¿Cómo puedo realizar esta
acción también en mi programa? Es decir, que
funcione en segundo plano con un icono
pequeño de notificación al lado del reloj de
Windows.
07/12/[email protected]
364
NOTIFICACIÓN DEL ICONO
Objetivos:
En este caso, al minimizar, muchas
veces es más cómodo dejarlo como
icono al lado del rejos de Windows al
igual que ocurre con otros
programas.
1) Introducir el componente
o control “notifyIcon” en el
formulario.
2) mensajes de notificación
del icono.
07/12/[email protected]
365
NOTIFICACIÓN DEL ICONO
En “Controles comunes”
has click dos veces para
agregarlo.
07/12/[email protected]
366
NOTIFICACIÓN DEL ICONO
Ajusta las propiedades
del notifyIcon como
muestra en el recuadro
de la derecha.
07/12/[email protected]
367
Propiedad Cambie a
Icon Icono.ico (32x32 px)
Text PicRS232
Visible True
NOTIFICACIÓN DEL ICONO
07/12/[email protected]
369
Introduces este código tal como muestra en
la imagen.
NOTIFICACIÓN DEL ICONO
En “eventos” pulsa dos
veces click en
“SizeChange”.
07/12/[email protected]
370
NOTIFICACIÓN DEL ICONO
07/12/[email protected]
372
No olvide introducir la variable private int uno = 0;
NOTIFICACIÓN DEL ICONO
Finalmente ya puedes poner la #region para
simplificar el código.
Fíjate bien el código fuente de la página
siguiente.
07/12/[email protected]
373
NOTIFICACIÓN DEL ICONO
PICRS232.SLN DESCARGA CÓDIGO FUENTE 9
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 9” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 9
Fuente 9
07/12/[email protected]
378
ENLACES WEB
En muchos programas hay una zona cerca de
“Ayuda” donde puedes ver su web oficial, etc.
En este caso vamos a poner un enlace de la
web donde se aloja este programa.
También puedes incluir si lo deseas, otras web,
blogs y foros de terceros si se ponen de
acuerdo, cosa que vamos a realizar ahora.
07/12/[email protected]
380
ENLACES WEB
Objetivos:
Crearemos enlaces Web, Blogs y
foros en nuestro programa para
acceder a él directamente, sea web
oficial del programa, foros e incluso
enlaces amigos.
1) Modificar la barra de
herramientas añadiendo
más entradas en “Ayuda”.
2) Introducir códigos
necesarios para la
ejecución de las Web, blogs
y foros.
07/12/[email protected]
381
ENLACES WEB
Empezamos arriba en la
barra de herramientas,
“Ayuda” a introducir los
datos.
07/12/[email protected]
382
ENLACES WEB
Fíjate bien que ahora se
muestra un flecha a la
derecha y ahí
introducirá las Web que
se muestra en la página
siguiente.
07/12/[email protected]
384
ENLACES WEB
Fíjate bien en la
imagen, ahora escribes
“Blog” y a su derecha
“electronica-pic”.
07/12/[email protected]
386
ENLACES WEB
Haz lo mismo con
“Foro” y a su derecha
“Foros de electrónica”
07/12/[email protected]
387
ENLACES WEB
Abajo escribe un guión
normal, cuidado, dije un
guión normal, no guión
bajo.
07/12/[email protected]
388
ENLACES WEB
Pincha con el ratón sin
soltar la casilla “Web” y
arrástralo encima de la
línea como muestra en
la imagen.
07/12/[email protected]
390
ENLACES WEB
Arrastra la línea de
abajo justo encima de la
casilla “Web”.
07/12/[email protected]
392
ENLACES WEB
Como verás en la
imagen, la línea debería
estar encima de la
casilla “Web”.
07/12/[email protected]
393
ENLACES WEB
Ahora toca introducir
códigos.
Pincha dos veces en
www.pic16f84a.org
para acceder al código.
07/12/[email protected]
394
ENLACES WEB
Al hacer doble ya nos encontramos con código
generado para introducir más códigos por
nosotros mismos.
En la flecha roja introducirás códigos
necesarios.
07/12/[email protected]
395
ENLACES WEB
Introduces estos códigos necesarios para
ejecutar la Web que desees. Debería quedar
como muestra en la imagen.
07/12/[email protected]
396
Sigue así con las demás direcciones Web,
blog y foros como se muestra en la página
siguiente.
ENLACES WEB
07/12/[email protected]
400
Finalmente ya puedes ponerle una #region y
contraerla como se muestra en la siguiente
imagen.
NOTIFICACIÓN DEL ICONO
PICRS232.SLN DESCARGA CÓDIGO FUENTE 10
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 10” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 10
Fuente 10
07/12/[email protected]
402
OPACIDAD
A veces interesa tener la ventana de control del
PicRS232 un poco transparente para ver lo que
hay detrás de mi escritorio, sobre todo cuando
estoy trabajando con programas de
mensajería instantánea o otra tarea.
07/12/[email protected]
404
OPACIDAD
Objetivos:
El objetivo principal es conseguir que
el formulario o ventana del programa
principal pueda cambiar su opacidad
o transparencia para ver lo que hay
detrás de ella o evitar miradas
indiscretas si estás en zona pública.
1) Añadir menú “Opacidad”.
2) Introducir códigos para la
opacidad.
3) Introducir códigos para
verificación de opacidad.
07/12/[email protected]
405
OPACIDAD
En “Opciones” vamos a
introducir el menú de
selección de opacidad.
07/12/[email protected]
406
OPACIDAD
Después de “Opacidad”,
introduces los demás
datos a su derecha.
Normal, un guión, 75%
hasta 5% tal como se
muestra en la imagen.
07/12/[email protected]
408
OPACIDAD
07/12/[email protected]
409
Selecciona “Normal” y pon “True” la propiedad Checked. Automaticamente
la propiedad CheckState se pone en “Checked”.
OPACIDAD
Para dejar claro que
“Normal” es un valor
predeterminado. En la
propiedad “Font”, activa
“Bold” a “True” para
dejar la palabra
“Normal” en Negrita.
07/12/[email protected]
410
OPACIDAD
07/12/[email protected]
413
En su interior introduce “Opacity = 1;” ya que el valor 1 significa
el 100% de la opacidad.
OPACIDAD
07/12/[email protected]
415
Introduce los códigos necesarios para checkear todo momento la
opción elegida.
NOTIFICACIÓN DEL ICONO
PICRS232.SLN DESCARGA CÓDIGO FUENTE 11
Guarda todo el proyecto, y pulsa “F5” para compilar el programa.
Si has seguido paso a paso esta aplicación, debería funcionar a la primera.
En caso contrario vuelva a repetir los pasos.
Descargue el ejemplo “Fuente 11” para ver el resultado o mire las páginas anteriores. Ejecuta el archivo “PicRS232.sln” para abrirlo junto con el Visual C#.
Fuente 11
Fuente 11
07/12/[email protected]
419
TODO EL CÓDIGO FUENTE
TODO LOS CÓDIGOS PASO A PASO TODOS LOS CÓDIGOS FUENTE
También puedes descargar
todos los pasos en un único
archivo llamado
“PicRS232_todo.zip” en los
enlaces de la derecha. Fuente todo
Fuente todo
07/12/[email protected]
420
CREATE INSTALL FREE
Una vez que termines el trabajo de programación, ahora toca realizar tareas de instalación para el usuario final, en el cual es rápido y fácil.
Con Create Install Free, es un instalador FreeWare y podrás crear una instalador en poco tiempo.
Esta versión que vamos a usar es la CreateInstall Free v4.14.4.
07/12/[email protected]
422
CREATE INSTALL FREE
Puedes descargar la versión free (gratuita) en
esta dirección Web www.createinstall.com en el
cual vamos a aprender lo básico para su
instalación del programa “PicRS232”.
07/12/[email protected]
423
CREATE INSTALL FREE
Pulsa el icono “Guardar
proyecto ” para
guardarlo.
Llámalo “PicRS232.ci” y
lo guardas en la
ubicación C:\CIF.
07/12/[email protected]
435
CREATE INSTALL FREE
07/12/[email protected]
439
Pulsa “InicioAccesoriosHerramienta del sistemaMapa de caracteres”,
selecciona en símbolo Copyriht y cópiala en el portapapeles en el botón copiar.
Para colocarlo en “Texto en pié de página” como indica la imagen anterior.
CREATE INSTALL FREE
Al final se crea el ejecutable llamado
“setup.exe” listo para su distribución.
Lo encontrarás donde hemos indicado que
aparecerá en el instaldor.
C:\CIF
07/12/[email protected]
452
CREATE INSTALL FREE
SETUP.EXE
En los enlaces de la derecha
puedes descargar el
“setup.exe” en formato
“setup_picrs232.zip” para
menor tiempo de descarga.
Puedes comprobar el
funcionamiento como
cualquier instalador.
setup_picrs232.zip
setup_picrs232.zip
07/12/[email protected]
454
CREATE INSTALL FREE
07/12/[email protected]
455
Fíjate que se puede colocar los logos e iconos. Queda muy
atractivo relacionado con el programa.
CREATE INSTALL FREE
Este es el final del manual.
Dejar claro que su idea principal falta la versión en Linux, que por tiempo y cuestiones técnicas no he podido incluir aquí.
Espero tener suficiente tiempo para la próxima actualización que ya incluya Linux con MonoDevelop.
También si es posible, lo básico en otros lenguajes como Visual C++ y Visual Basic .net.
Espero que a parte de aprender, se hayan divertido.
07/12/[email protected]
457
Algunas fotos del proyecto real sobre el puerto serie RS232 con C#.
07/12/[email protected]
459
FOTOS
VÍDEOS (REQUIERE CONEXIÓN INTERNET)
RS232 CON PIC 16F84A Y VISUAL C# EN WINDOWS
Ver vídeo 1
07/12/[email protected]
464
MICROCONTROLADOR PIC16F84. DESARROLLO
DE PROYECTOS
LIBRO HYPERTERMINAL
En este libro podrás
encontrar una guía paso a
paso sobre el puerto serie
RS232 y HyperTerminal.
Cualquier información
consulta su página oficial
www.pic16f84a.org.
07/12/[email protected]
466
ELECTRÓNICA DIGITAL PARA FORMACIÓN
PROFESIONAL
LIBRO DESCRIPCIÓN:
El libro "Electrónica Digital para Formación Profesional" contiene los conocimientos de electrónica digital necesarios para el adiestramiento de técnicos de nivel medio o superior. Está especialmente orientado a la formación profesional en general, ya sea en un centro de enseñanza oficial, en cursos de reciclaje del personal técnico en empresas o para aprendizaje autodidacta. La metodología utilizada en este libro es eminentemente práctica, basada en el desarrollo de gran número de montajes de laboratorio combinados con ejercicios prácticos y exposición de los principios teóricos fundamentales.
http://www.lulu.com/content/3640689
07/12/[email protected]
467
OTROS MANUALES
DESCARGAS DE MANUALES
Puedes descargar otros
manuales relacionado sobre
temas de
microcontroladores.
Manuales.
Manuales.
07/12/[email protected]
469
Enlaces de páginas Web donde podrás encontrar más información.
07/12/[email protected]
470
ENLACES DE INTERÉS
ENLACES DE INTERÉS
http://www.microsoft.com/express Descarga la versión gratuita Visual C# .netExpress.
http://msdn.microsoft.com Encontrarás información sobre el aprendizaje y conceptos del lenguaje C#.
http://forums.microsoft.com Foro en español sobre Visual Studio .net donde podrá encontrar información o resolver dudas sobre el mundo de Visual C#.
http://www.developerfusion.com Un buen enlace para transformar código C# a VB y VB a C# mediante una Web.
http://www.createinstall.com Instalador de aplicaciones muy fácil.
www.todoelectronica.com Revista oficial de electrónica trimestral de España para cualquier lector sea principiante, aficionado o profesional con kit de regalo para su montaje. Podrás entregar tus propios proyectos de electrónica con o sin microcontroladores e incluso ver el de los demás lectores explicado con todo detalle, esquemas eléctricos, esquema de los circuitos impresos, lista de componentes, código fuente, etc. Las bases mínimas para entregar los proyectos está detallada en la revista.
www.microchip.com (En Inglés) Web oficial sobre los PIC entre otros dispositivos de la firma Microchip, donde podrás descargar las hojas de datos, ejemplos, compilador MPLAB y mucha más información.
07/12/[email protected]
471
CONTACTO
Puedes publicar este tutorial o
manual en tu Web, foros, blogs, CD,
DVD o Blue-Ray para revistas
oficiales, etc, libremente.
Cualquier comentario,
sugerencia o mejoras del
manual, me lo envían por
correo electrónico al
07/12/[email protected]
473
