PicRS232 - 2

metaconta@gmail.
com 07/12/2008
Í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
2
metaconta@gmail.com 07/12/2008
Í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
3
Presentación del manual.
PRESENTACIÓN
4
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.
5
Introducción
VISUAL C# .NET
6
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
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.
8
DESCARGA DEL VISUAL C# .NET EXPRESS

 De entrada vamos a
descargar el compilador
(gratuito) Visual C# .net
Express 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.
9
10
 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.
11
12
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.
13
14
15
16
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,
“VentanasRestablecer diseño de la
ventana”.
EJECUTAR VISUAL C# .NET
17
RESTABLECER DISEÑO DE LA VENTANA
18
 Le hará una pregunta

antes de realizar la
operación.
 Pulse “Sí” para
reestablecer las
ventanas.
19
20
INICIO VISUAL C# .NET
 Como se muestra en la
imagen, aparecerá una
página llamada “Página
de inicio”.
21
CREAR NUEVO PROYECTO

Creamos un nuevo proyecto en “ArchivoNuevaProyecto…”. Antes de
comenzar, vamos a explicar el entorno básico del Visual C# .NET Express.
22
23
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”.
24
25
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.
INICIO DE UN NUEVO PROYECTO
26
 Pulsa el botón “Guardar

todo” como indica en la
imagen o pulsa en la
barra de herramientas
“ArchivoGuardar
todo” para guardar el
proyecto.
27
28
 Al pulsar “Guardar todo”

aparece una ventana
llamada “Guardar
proyectos”. Deja el
nombre como está y
pulsa el botón
“Guardar”.
29
30
 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.
31
32
 Pulsa la pestaña
“Cuadro de
herramientas” para
abrir una ventana
indicado en la imagen
con un rectángulo rojo.
33
34
 Se abrirá el “Cuadro de
herramientas” como
indica en el dibujo, pero
aún no es fija.
35
36
 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.
37
 Ahora permanece fija y

es lo que nos interesa si
estamos añadiendo
componentes al
formulario.
 Así se hará con este tipo
de ventanas.
38

Vamos abrir otro cuadro llamado “propiedades” para tener todo el entorno
preparado y con la chincheta fija.
39
 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”.
40
41
 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.
42
43
Nos familiarizamos con el entorno.
ENTORNO VISUAL C#
44
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.
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.
46
ENTORNO VISUAL C#
47
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.
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.
49
ENTORNO VISUAL C#
50
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();
}
}
}
ENTORNO VISUAL C#
51
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.
ENTORNO VISUAL C#
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. 53
EXPLORADOR DE SOLUCIONES
 En el “Explorador de
soluciones”, para ver y
administrar archivos de
proyecto y
configuraciones.
54
VENTANA DE PROPIEDADES
 En “Propiedades”, para
configurar propiedades
y eventos en los
controles de la interfaz
de usuario.
55
56
 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.
57
EJECUTAR PROGRAMA
58
EJECUTAR TU PROGRAMA
 Para compilar o ejecutar

el programa
simplemente arriba en
la barra de
herramientas pulsa
“DepurarIniciar
depuración” o
simplemente pulsa
“F5”.
59
60
 También puedes pulsar

la flecha verde que
significa lo mismo que
al pulsar “F5”.
61
62
 Para terminar la
depuración
simplemente pulsa
“DepurarDetener
depuración”.
63
64
 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.
65
66
OBJETIVO DE LA INTERFAZ
67
 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.
68
 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.
69
 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.
70
71
 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.
72
CÓDIGO FUENTE
 Asegúrate que el código

fuente es tal como se
muestra.
73
74
 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.
75
76
PROPIEDADES
 En el cuadro de propiedades de Propiedad Cambie a

la derecha, es un breve Text PicRS232
resumen de lo que hemos (Name) Form_Principal
hecho menos la “Propiedad”
“Size”, que es el que debemos StartPosition CenterScreen
tener si no hemos tocado nada Size 300; 300
al principio.
 Ahora en adelante sabrá
interpretar este cuadro, y
podemos cambiar las
propiedades más rápidamente
de cualquier objeto.
77
 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.
78
79
 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.
80
81
PROPIEDADES
 Haz introducido el botón Propiedad Cambie a

llamado “button1” en el Text t
formulario. (Name) button_t
Location 109; 38
 Ahora toca cambiar las
propiedades que se describe
en el cuadro a continuación
para el “button1”.
82
PROPIEDADES
 Arrastra un “button” desde el Propiedad Cambie a

“Cuadro de herramientas” Text b
hacia el formulario en el cual (Name) button_b
se llama “button2” y cambie Location 109; 67
las propiedades como hiciste
en el apartado anterior.
83
PROPIEDADES
 Ahora con button3. Propiedad Cambie a

Text a
(Name) button_a
Location 28; 67
84
PROPIEDADES
 Ahora con button4 pero Propiedad Cambie a

cuidado una cosa, la letra Text l
que estamos usando es la (Name) button_l
letra “L” minúscula que Location 190; 67
podemos confundirnos con
la “I” latina mayúscula.
85
PROPIEDADES
 Ahora con Button5 de la Propiedad Cambie a

tecla “Espacio” BackColor 255; 128; 0
cambiaremos el color del Font.Bolt True
botón y la fuente de letras en Text Espacio
negrita como indica en el (Name) button_Espacio
cuadro. Location 190; 96
 Te lo dice directamente pero

hay otra forma de hacerlo
más cómodo.
86
 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.
87
 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.
88
 Hay una manera más

cómoda y rápida de
ponerlo en “Negrita”
que es pulsando
directamente en “Font”
sin abrirlo como
89
 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.
90
91
 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.
92
 También hay otro

método más cómodo en
seleccionar el orden de
tabulación.
 Accede al “VerOrden
de tabulación”.
93
94
 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.
95
96
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.
97
 Si quieres ver,
seleccionar o modificar
los nombres internos
(Name) de los objetos
más facilmente, pulsa
arriba “VerOtras
ventanasEsquema
del documento”.
98
99
 Esta ventana se llama

“Esquema de
documento”, como dije
antes, puedes
seleccionar los objetos
aquí y cambiar su
nombre interno (Name).
100
CÓDIGO ASM DEL PIC16F84A
101
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.
102

 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 Information
Interchange” o lo que es lo mismo “Código
Estadounidense Estándar para el Intercambio de
Información”.
103
Tabla ASCII 1
104
Tabla ASCII 2
105

 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.
106
 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.
107
108
LISTA DE COMPONENTES
Componentes Valor C8 22pF

IC1 LCD LM016L Y1 4 MHz
IC2 MAX232 R1 ajustable 10 kΩ
IC3 PIC16F84A-04 R2 330 KΩ
C1 1µF R3 330 KΩ
C2 100nF R4 330 KΩ
C3 1µF R5 330 KΩ
C4 100nF D1 Led Rojo
C5 1µF D2 Led Rojo
C6 1µF D3 Led Rojo
C7 22pF D4 Led Rojo

109

 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
110

;************************************ 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>
111

__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.
112

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.
;
113

xorlw TECLA_IZQ ; ¿Es la tecla del movimiento hacia la izquierda?
btfsc STATUS,Z
goto Izquierda ; Sí, se desea movimiento hacia la izquierda.
;
xorlw TECLA_DER ; ¿Es tecla del movimiento hacia la derecha?
btfsc STATUS,Z
goto Derecha ; Sí, se desea movimiento hacia la derecha.
;
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
114

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>
115

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
; ===================================================================
116
RS232_11.HEX
Abre un archivo de texto y pega el

:10012000080085158316051685118312080008300E
:100130008E00051A99288F2191210310051A0314A6
:100140008F0C8F218E0B9D288C210F080800303ECC

:100150008F0008308E0085118F218F0C031CB22870
:100160008515B32885118F218E0BAD2885158C211F código que ves a la izquierda.
Fíjate que al final del código del
:10017000080090000C309002900310080C209100B1
:1001800091080319C628A820900ABD2808000A3043
:1001900092000A30A820920BC9280D30A820080030
todo, debes dejar justo abajo un

:1001A00083160510051185108312851005110510A1
:1001B0009F213030EA20A3213030EA208C213030DA
:1001C000EA2094212030EA209421142112211021C8
:1001D000FE200800F039930006080F3993048316B7
:1001E000060895000F308605831213088600051552
:1001F000051183161508860083120800063015299C
espacio pulsando la tecla “Enter”.
Precisamente aquí :00000001FF
:1002000080301529C030152994301529D43015298E
:1002100080381529C0381529083015290E301529C0
:100220000C3015290130152928300510192905141D

:1002300021219400EA20140EEA20051CA521912119
:1002400008009300F13C031D2829EE309300352966 al final donde hay dos F pulsa
Enter una vez.
:100250001308D13C031D2F29EE30930035291308D4
:10026000BA3C031D3529DF30930013080800103015
:100270003E2901303E2902303E29033096002030CD
:100280001721960B3F2908009700F039031D4C29D0
:10029000203017214E299700170E4F2117080F39CC
:1002A0009600093C031C57291608303E59291608A8  Guarda el archivo de texto con la
extensión .hex o llámalo así
:1002B000373E172998000C309802980318080C2034
:1002C00099009908031967291721980A5E290800DF
:1002D00098000C30980298039A01122110301A02EB
RS232_11.hex.
:1002E000031D7729992199210F3098026C2918084C
:1002F0000C20990099080319812917219A0A980A54
:100300006E2908000000000000000000000000004E
Si deseas guardar los datos al PIC,

:1003100008000000A43095290000403095291F30C6
:10032000952900000E30952905309B009B0B9629DE
:100330000800C830A8296430A8293230A829143010 
hay un manual de cómo hacerlo
:10034000A8290A30A8290530A8290230A829013097
:100350009C00F9309B0000009B0BAB299C0BA9294A
:100360000800C830BC296430BC293230BC291430A4
:10037000BC290A30BC2905309D0064309C00F9304E
:100380009B0000009B0BC1299C0BBF299D0BBD2925 explicado haciendo clic con el
ratón aquí.
:02039000080063
:02400E00F13F80
:00000001FF

117

 Se preguntará el motivo de TECLA MOVIMIENTO
poner esas letras en los t Adelante
botones. ¿Por qué esas
b Atrás
letras?
a Izquierda
 El programa del
microcontrolador l Derecha
PIC16F84A tiene (Espacio) Parada
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.
118
 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”.
119

 En el Visual C# vamos a Hex Carácter
usar los caracteres 74 t
hexadecimales que 62 b
muestra en el cuadro de 61 a
la derecha para enviar 6C l
datos al PIC16F84A. 20 (Espacio)
 No hace falta que mires la
tabla ascii ya que
precisamente vamos a
usar la indicada aquí,
excepto, que desees usar
otros carácteres.
120
Códigos de envío de datos al PIC16F84A.
PRIMER CÓDIGO C#
121
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 Led
al 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#.
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#.
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 Libreria
RS232.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í.
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.
125
PRIMER CÓDIGO C#
 Pulsamos el botón
“Eventos” y hacemos
doble clic con el ratón
donde indica la flecha
roja.
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)
{
}
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”.
128
PRIMER CÓDIGO C#
 Pulsa el botón de
“propiedades”.
129
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.
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.
131
PRIMER CÓDIGO C# (OBJETIVO)
 1) Introducir códigos en los botones para su

funcionamiento.
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.
133
PRIMER CÓDIGO C#
134
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);
135
PRIMER CÓDIGO C#
136
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.
137
PRIMER CÓDIGO C#
 Justo debajo donde

pone:
 using
System.Windows.Forms;
138
PRIMER CÓDIGO C#
 Ahora introduces el
siguiente comando:
 using System.IO.Ports;
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”.
140
PRIMER CÓDIGO C#
141
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.
142
PRIMER CÓDIGO C#
Propiedad Cambiar a
 El programa
BaudRate 9600
RS232_11.asm que
DataBits 8
acompaña el libro, Handshake None
utiliza los datos de Parity None
comunicación es el que PortName COM1
muestra en la imagen StopBits Two
de la derecha.
143
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.
144
PRIMER CÓDIGO C#
145
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());
}
}
146
PRIMER CÓDIGO C#
 Para saber el números

de líneas en el editor de
Visual C#, pulsa:
 Herramientasopcione
s…
147
PRIMER CÓDIGO C#
 Se abre la ventana
opciones.
 Abajo, pincha “Mostrar
todas las
configuraciones”.
148
PRIMER CÓDIGO C#
149
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”.
150
PRIMER CÓDIGO C#
151
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.
152
PRIMER CÓDIGO C#
153
PRIMER CÓDIGO C#
154
PRIMER CÓDIGO C#
 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.
155
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);
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.
157
PRIMER CÓDIGO C#
158
PRIMER CÓDIGO C#
159
PRIMER CÓDIGO C#
160
PRIMER CÓDIGO C#
161
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  Fuente 1
repetir los pasos.  Fuente 1
 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#.
PRIMER CÓDIGO C#
162
Recibir mensajes desde el microcontrolador PIC16F84A.
RECIBIR MENSAJES
163
Objetivos:
Leer los datos del PIC16F84A desde
 1) Arrastrar StatusStrip o barra
la interfaz del PC. 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.
RECIBIR MENSAJES
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.
165
PRIMER CÓDIGO C#
166
RECIBIR MENSAJES
 Arrastra un TextBox al Propiedad Cambiar a
formulario. ScrollsBar Vertical
 Esté donde esté colocado Multilinea True
el TextBox dentro del (Name) textBox_visualizar_
formulario, verás que se mensaje
irá colocando Anchor Top, Bottom, Left,
correctamente según Right
cambies las propiedades Location 0; 132
del recuadro. Size 287; 82
 Fíjate en la página
siguiente que vamos a
cambiar otra propiedad
llamada “Dock”.
167
RECIBIR MENSAJES
 Puedes cambiar la propiedad “Dock” Propiedad Cambiar a
a “Bottom” para pegarlo hacia abajo y
las paredes. Dock Bottom
 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.
168
RECIBIR MENSAJES
Propiedad Cambiar a
 Todo debería quedar así
ScrollsBar Vertical
siguiendo el pie de la
Multilinea True
letra para que al (Name) textBox_visualizar_
Maximizar el formulario, mensaje
el Anchor Top, Bottom, Left,
Right
“textBox_visualizar_men Location 0; 132
saje” lo haga Size 287; 82
correctamente. Dock None
169
RECIBIR MENSAJES
 Esta es una de las

maneras de cambiar a
“Bottom”.
170
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.
171
RECIBIR MENSAJES
Propiedad Cambiar a
 Arrastra un Label en el
Text Mensaje desde el
formulario y cambia sus PIC
propiedades como (Name) label_mensaje_pic
indica el recuadro. Autosize True
Location 25; 146
Size 110; 13
172
RECIBIR MENSAJES
 Pulsa en la barra de
herramientas.
“VerOrden de
tabulación” y muestra
algo similar en l
aimagen.
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, “VerOrden
de tabulación”.
174
RECIBIR MENSAJES
 Si lo deseas, en el Propiedad Cambiar a
control ahora llamado ReadOnly True
“textBox_visualizar_men
saje”, 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”.
175
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,
// Utilizaremos un string como buffer de recepcion

string Recibidos;
justo debajo del

public partial class Form1 : Form
{
176
RECIBIR MENSAJES
177
RECIBIR MENSAJES
 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.
178
RECIBIR MENSAJES
179
RECIBIR MENSAJES
180
RECIBIR MENSAJES
181
hh:mm:ss
Representa hh a horas, mm a  Vamos a poner la hora local
minutos y ss a segundos.
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.
RECIBIR MENSAJES
182
RECIBIR MENSAJES
183
RECIBIR MENSAJES
 Vamos a añadir la hora

local de nuestro
Sistema Operativo en el
“StatusStrip1”.
 Señala con el ratón el
StatusStrip1.
184
RECIBIR MENSAJES
 Eliges “StatusLabel”
como indica la flecha
roja de más bajo.
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.
186
RECIBIR MENSAJES
 Ahora puedes ver que

es hh:mm:ss.
187
RECIBIR MENSAJES
 Selecciona el componente Propiedad Cambiar a
“timer1” y cambie de Enabled True
propiedades como indica en
Interval 1000
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.
188
RECIBIR MENSAJES
 Pincha dos veces al

componente “timer1”
para que puedas
introducir el código
necesario de la hora
local de Windows.
189
RECIBIR MENSAJES
 Se crea unos códigos

pero no tiene función.
190
RECIBIR MENSAJES
191
RECIBIR MENSAJES
 En su interior del código del “timer1”,

introduce:
 statusStrip1.Items[0].Text =
DateTime.Now.ToLongTimeString();
192
RECIBIR MENSAJES
193
RECIBIR MENSAJES
 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.
194
RECIBIR MENSAJES
195
RECIBIR MENSAJES
196
RECIBIR MENSAJES
197
RECIBIR MENSAJES
198
RECIBIR MENSAJES
199
RECIBIR MENSAJES
 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”.
200
READONLY = FALSE READONLY = TRUE
RECIBIR MENSAJES
201
DESCARGA CÓDIGO FUENTE 2
 Perfectamente ya puedes
probar el programa con el
circuito.
 Si algo falla, vuelve a empezar
desde el principio o  Fuente 2
simplemente te descargas el
archivo “Fuente 2”.  Fuente 2
 Este es el final de la aplicación
de la interfaz aunque puedes
ampliar algunos extras en
páginas siguientes.
CÓDIGO C#
202
Puedes ampliar algunas funciones básicas para la interfaz
EXTRAS
203
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.
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.
205
Objetivos:
Vamos a insertar varios tipos de
 1) Insertar un control
cuadros de información “Acerca
de…”.
“MenuStrip” al formulario.
En tu aplicación final, sólo elegirás
uno, en este ejemplo hacemos unos
 2) Salir.
cuantos para que veas cual se te
adapta mejor.  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.
ACERCA DE…
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.
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”.
208
ACERCA DE…
209
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.
210
ACERCA DE…
211
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”.
212
ACERCA DE…
 Se ha creado
“Opciones” y ahora
abajo donde indica la
flecha roja introduce
“Salir”.
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.
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”.
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.
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”.
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.
218
ACERCA DE…
& Resultado
 En este caso
&Opciones Opciones
“&Opciones”, debajo
&Salir Salir
“&Salir” así A&yuda Ayuda
sucesivamente. Ac&erca de… Acerca de…
 No se debe repetir la Ace&rca de 2… Acerca de 2…
misma letra en el
mismo formulario.
 También puedes
introducir la “&” en
botones.
219
ACERCA DE…
 Vamos a introducir el
código Close();
pinchando dos veces en
“Salir”.
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.
221
ACERCA DE…
222
ACERCA DE…
 Ahora nos toca abrir un archivo de ayuda en

pdf dentro de “AyudaContenido”.
 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.
223
ACERCA DE…
 Has doble click en

“Contenido” e introduce
el código que muestra
en la página siguiente.
224
ACERCA DE…
225
ACERCA DE…
 Debe quedar de la siguiente manera.
226
ACERCA DE…
227
ACERCA DE…
 No olvides poner el
“using” que indica en la
imagen si no lo habías
puesto ya.
228
ACERCA DE…

y pulsa “F5” para
depurar.
 Ejecuta
“AyudaContenido”.
 Verás una ventana que
se llama “Aviso:” porque
no encuentra el archivo
“manual.pdf”.
229
ACERCA DE…
230
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 .
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”.
232
ACERCA DE…
233
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.
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.
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.
236
ACERCA DE…
 Pulsa “F5” para depurar

el programa y
comprueba que el
archivo “manual.pdf” se
ejecuta.
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.
238
ACERCA DE…
 Pincha dos veces en

“Acerca de…”.
239
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.
240
ACERCA DE…
241
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.
242
ACERCA DE…
243
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.
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.
245
ACERCA DE…
246
ACERCA DE…
247
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…”.
248
ACERCA DE…
“Agregar nuevo
elemento PicRS232”.
 Seleccionamos en
“Palntilla”, “Cuadro
Acerca de”.
 Abajo en “Nombre”
introducimos
“AcercaDe.cs” y
pulsamos el botón
“Agregar”.
249
ACERCA DE…
250
ACERCA DE…
 Aparece en el
“Explorador de
soluciones” el
formulario llamado
“AcercaDe.cs” que
hemos asignado.
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.
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”.
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.
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”.
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”.
256
ACERCA DE…
 Ahora vamos a
introducir nuestro
logotipo.
 Pulsa el botón
“Importar”.
257
ACERCA DE…
 Este logotipo se llama

145.png.
 Puedes poner la
extensión que quieras
que te acepta muchas.
 Ahora pulsa aceptar.
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.
259
ACERCA DE…

“Acerca de 2…”.
260
ACERCA DE…
 Como vez, se ha
generado código para
introducir más código y
poder llamar el cuadro
de información.
261
ACERCA DE…
 Introduces este código y

podrás invocar el
famoso cuadro de
“Acerca de…” o cuadro
de información.
y pulsa “F5” para que
compruebes el
resultado.
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.
263
ACERCA DE…
264
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?
265
ACERCA DE…
266
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.
267
ACERCA DE…
268
ACERCA DE…
 Guarda el proyecto y
depura con “F5”.
 Después pulsa
“AyudaAcerca de 2…”
y ya tienes el resultado
esperado.
269
ACERCA DE…
270
LICENCIA
Licencia:
 Es bueno dejar claro a las
personas si deseas algún día Este programa es absolutamente freeware.
distribuir tu programa por Si no sabes qué quiere decir que un

programa sea freeware, te lo explico:
internet alguna nota o
Licencia para su uso. 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.
ACERCA DE…
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.
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.
273
ACERCA DE…
274
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á.
275
ACERCA DE…
 Con el segundo botón

del ratón, pinchamos o
hacemos click en
“PicRS232” en el
“Explorador de
soluciones”.
 Pulsa “Propiedades”.
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…”.
277
ACERCA DE…
278
ACERCA DE…
“Información de
ensamblado”.
 Aquí se muestra los
datos que veíamos
antes del “Acerca de…”.
279
ACERCA DE…
280
ACERCA DE…
 Modificamos los valores

que nos interesen y
pulsamos “Aceptar”.
281
ACERCA DE…
282
ACERCA DE…
 Guarda el Proyecto y
 Ejecuta el
“AyudaAcerca de 2…”
y comprueba que has
añadidos los datos que
has introducido.
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.
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.
285
ACERCA DE…
286
ACERCA DE…
 Si te fijas bien, debajo se ve marcado de rojo

porque falta un using.
287
ACERCA DE…
 Guarda el proyecto y depura con “F5” para

probar el enlace y muestra la mano en el
puntero del ratón.
288
ACERCA DE…
 En el ejecutable
“PicRS232.exe”
contiene información
que vamos a ver ahora.
289
ACERCA DE…
 Pulsando las
propiedades del
“PicRS232.exe” como
cualquier otro
programa, vemos toda
la información que
hemos añadido.
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.
291

programa.
CÓDIGO C#
292
293
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?
294
Objetivos:
Enfocaremos el botón “Espacio”  1) Ajustar el enfoque con
(también podríamos llamarlo Stop)
que por seguridad es que debemos
detener con el teclado Enter para
AcceptButton.
 2) Tabulación 0.
parar el sistema.
ENFOQUE DEL BOTÓN
295
ENFOQUE DEL BOTÓN
 En el formulario
principal
“Form1_Principal”,
ajusta la propiedad
“AcceptButton” al botón
que deseas como el
“Button_Espacio”.
296
ENFOQUE DEL BOTÓN
 Para asegurarte que el

botón “Espacio” tiene
su enfoque, introduce el
valor “0” en “TabIndex”.
297
ENFOQUE DEL BOTÓN
 Si quieres ordenar toda

la tabulación, pulsa
“VerOrden de
tabulación”.
298
ENFOQUE DEL BOTÓN
 Puedes dejar el orden

de tabulación o el que
prefieras.
299

programa.
CÓDIGO C#
300
301
REDIMENSIONAR FORMULARIO
 Me gustaría no poder redimensionar la ventana

o formulario del programa ya compilado. ¿Se
puede lograr este objetivo?
302
Objetivos:
El formulario puedo redimensionar al  1) Ajustar el
tamaño que quiera, pero no deseo
que lo haga menor al tamaño
original.
“FormBorderSyle”, es decir,
la apariencia del borde del
formulario.
303
 Hay muchas formas de

comportamiento y
apariencia y la que
vamos a usar para
mantener es el tamaño
de la ventana.
304
 Ya no puedes
redimensionar el
formulario pero si
puedes maximizar.
305
 Ya que estamos, para

los que quieran que el
formulario no maximice,
vamos a poner “False”
en la propiedad del
“MaximizeBox”.
306
 Como podrás ver, se

nota que está
desactivado.
 Ahora ya no podrás
maximizar la ventana o
el formulario.
307

programa.
CÓDIGO C#
308
309
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.
310
Objetivos:
A veces hacemos las ayudas del  1) Introducir código
programa en ciertos formatos como
pdf, xps, doc, docx, htm, html, etc o
los viejos conocidos hlp y chm.
necesario para buscar
Para no sólo dejar un formato en un
programa ya compilado, mejor tener
archivos de ayuda de
la oportunidad de encontrar con su
extensión correspondiente.
extensiones diferentes.
Si no encuentra ningún manual, nos
avisará un mensaje de error o aviso.  2) Mensaje de error o aviso
sobre el archivo de ayuda
no encontrado.
MÁS AYUDA
311
MÁS AYUDA

“Contenido”.
312
MÁS AYUDA

“Contenido”.
 Si has seguido el
manual desde el
principio y has
encontrado el código
anterior, borra sólo lo
marcado en azul.
313
MÁS AYUDA
314
MÁS AYUDA
 Sólo deberás dejar el

código libre para
introducir el nuevo en
él.
315
MÁS AYUDA
316
MÁS AYUDA
 Dentro de un interior dicho anteriormente,

introduce estos códigos.
317
MÁS AYUDA
318
MÁS AYUDA
319
MÁS AYUDA
 Guarda el proyecto y
 Ahora ejecuta
“AyudaContenido”
para que se muestre la
ventana.
320
MÁS AYUDA
 Debería demostrar algo

similar a la imagen.
321
MÁS AYUDA
322
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.
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.
324
MÁS AYUDA
 Introduce todos los

archivos de las
extensiones que has
programado.
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.
326

programa.
CÓDIGO C#
327
328
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?
329
Objetivos:
Vamos a aprender contraer los  1) ¿Qué es y cómo se utiliza
códigos para que no molesten al
programar si empezamos a añadir
códigos nuevos.
#region?
En este tema, se trata de reducir en
el editor de códigos.  2) Contraer códigos con
En los códigos que hemos hecho
hasta ahora lo podemos contraer #region.
todos, o en partes.
Mejor lo vemos con ejemplos.
CONTRAER CÓDIGO
330
CONTRAER CÓDIGO
 Vamos a trabajar en la  #region MyClass definition
pestaña Form1.cs del public class MyClass
formulario principal. {
 #region permite especificar static void Main()
un bloque de código que se {
puede expandir o contraer.
Al final se cierra con }
#endregion . } #endregion
 Vamos a cerrar por parte
ciertos códigos, donde
podamos expandir o
contraer.
 Ver ejemplo a la derecha.
331
CONTRAER CÓDIGO
 Introducimos la
directiva #region donde
indica la flecha roja.
332
CONTRAER CÓDIGO
333
CONTRAER CÓDIGO
 Ahora cerramos la
region con #endregion
que puedes ver en la
flecha roja de la imagen
que muestra en la
derecha.
334
CONTRAER CÓDIGO
335
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.
336
CONTRAER CÓDIGO
337
CONTRAER CÓDIGO
 Pulsa el cuadrado con

el – para contraer el
código. Se te convierte
e + para volver a
expandir.
338
CONTRAER CÓDIGO
339
CONTRAER CÓDIGO
 Para facilitar las cosas,

puedes poner un
comentario sobre la
#region.
 Vuelve a expandir.
 #region Envío de datos
RS232.
340
CONTRAER CÓDIGO
341
CONTRAER CÓDIGO
 Contráelo y ya podrás
ver el nombre de esta
#region.
342
CONTRAER CÓDIGO
343
CONTRAER CÓDIGO
 Contrae arriba los using,

está arriba del todo.
 Como muestra en la
imagen, coloca #region
y contráelo.
344
CONTRAER CÓDIGO
345
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.
346
CONTRAER CÓDIGO
347

programa.
CÓDIGO C#
348
349
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?
350
Objetivos:
Antes que nada debes tener ya un  1) Introducir icono en la
icono hecho con un programa de
retoques fotográficos como
Photoshop, Paint Shop Pro, Gimp,
esquina de las ventanas del
etc.
Guárdalo en .PNG a 32x32 píxeles y
programa.
 2) Introducir icono para el
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, ejecutable PicRS232.exe
nuestro objetivo es introducir el icono
en la esquina de la ventana de
nuestro programa y sobre todo en el
del programa principal.
ejecutable “PicRS232.exe”.
ICONO
351
ICONO
 En “Icon” puedes
colocar el icono del
formulario. Pulsa los …,
elige el “icono.ico” y ya
lo tienes resuelto.
352
ICONO
 Ya tenemos el icono en
el formulario.
353
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”.
354
ICONO
 Si no lo está, selecciona
la pestaña “Aplicación”.
 Busca el “icono.ico”
donde indica la flecha
roja.
355
ICONO
356
ICONO
357
ICONO
 Guarde todo el proyecto

y depura con “F5”.
 Se muestra ya el icono
en la esquina superior
izquierda.
 Cierre el programa.
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.
359
ICONO
 Puedees ver el
ejecutable con su icono
personalizado.
360
ICONO
 También aparece en las

propiedades del
ejecutable.
361

programa.
CÓDIGO C#
362
363
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.
364
Objetivos:
En este caso, al minimizar, muchas  1) Introducir el componente
veces es más cómodo dejarlo como
icono al lado del rejos de Windows al
igual que ocurre con otros
o control “notifyIcon” en el
programas. formulario.
 2) mensajes de notificación
del icono.
365
 En “Controles comunes”
has click dos veces para
agregarlo.
366

Propiedad Cambie a
 Ajusta las propiedades
Icon Icono.ico (32x32 px)
del notifyIcon como
Text PicRS232
muestra en el recuadro Visible True
de la derecha.
367
 Haz doble click en

“DoubleClik”.
368
 Introduces este código tal como muestra en

la imagen.
369
 En “eventos” pulsa dos

veces click en
“SizeChange”.
370

Introduce el código que muestra abajo.
371

No olvide introducir la variable private int uno = 0;
372
 Finalmente ya puedes poner la #region para

simplificar el código.
 Fíjate bien el código fuente de la página
siguiente.
373
374
375
 Ya puedes contraer la
#region del nuevo
código.
376
377

programa.

378
379
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.
380
Objetivos:
Crearemos enlaces Web, Blogs y  1) Modificar la barra de
foros en nuestro programa para
acceder a él directamente, sea web
oficial del programa, foros e incluso
herramientas añadiendo
enlaces amigos. más entradas en “Ayuda”.
 2) Introducir códigos
necesarios para la
ejecución de las Web, blogs
y foros.
ENLACES WEB
381
ENLACES WEB
 Empezamos arriba en la
barra de herramientas,
“Ayuda” a introducir los
datos.
382
ENLACES WEB
 Donde pone “Escriba

aquí” introduces “Web”.
383
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.
384
ENLACES WEB
 Introduces dos Web,

www.pic16f84a.org y
Electrónica Pic.
385
ENLACES WEB
 Fíjate bien en la
imagen, ahora escribes
“Blog” y a su derecha
“electronica-pic”.
386
ENLACES WEB
 Haz lo mismo con

“Foro” y a su derecha
“Foros de electrónica”
387
ENLACES WEB
 Abajo escribe un guión

normal, cuidado, dije un
guión normal, no guión
bajo.
388
ENLACES WEB
 Pulsa “Enter” y ya tienes

la línea grande.
389
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.
390
ENLACES WEB
 Debería quedar algo

similar así.
391
ENLACES WEB
 Arrastra la línea de
abajo justo encima de la
casilla “Web”.
392
ENLACES WEB
 Como verás en la
imagen, la línea debería
estar encima de la
casilla “Web”.
393
ENLACES WEB
 Ahora toca introducir

códigos.
www.pic16f84a.org
para acceder al código.
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.
395
ENLACES WEB
 Introduces estos códigos necesarios para

ejecutar la Web que desees. Debería quedar
como muestra en la imagen.
 Sigue así con las demás direcciones Web,

blog y foros como se muestra en la página
siguiente.
396
ENLACES WEB
397
ENLACES WEB
398
ENLACES WEB
399
ENLACES WEB
 Finalmente ya puedes ponerle una #region y

contraerla como se muestra en la siguiente
imagen.
400
ENLACES WEB
401

programa.

402
403
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.
404
Objetivos:
El objetivo principal es conseguir que  1) Añadir menú “Opacidad”.
el formulario o ventana del programa
principal pueda cambiar su opacidad
o transparencia para ver lo que hay
 2) Introducir códigos para la
detrás de ella o evitar miradas
indiscretas si estás en zona pública. opacidad.
 3) Introducir códigos para
verificación de opacidad.
OPACIDAD
405
OPACIDAD
 En “Opciones” vamos a
introducir el menú de
selección de opacidad.
406
OPACIDAD
 Como muestra en la
imagen. Escribes
“Opacidad”.
407
OPACIDAD
 Después de “Opacidad”,
introduces los demás
datos a su derecha.
 Normal, un guión, 75%
hasta 5% tal como se
408
OPACIDAD
Selecciona “Normal” y pon “True” la propiedad Checked. Automaticamente

la propiedad CheckState se pone en “Checked”.
409
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.
410
OPACIDAD
 Haz doble click en

“Normal” como muestra
la imagen.
411
OPACIDAD
Se genera un código automáticamente.
412
OPACIDAD
En su interior introduce “Opacity = 1;” ya que el valor 1 significa

el 100% de la opacidad.
413
OPACIDAD
414
OPACIDAD
Introduce los códigos necesarios para checkear todo momento la

opción elegida.
415
OPACIDAD
416
OPACIDAD
417
OPACIDAD 100% OPACIDAD 25%
OPACIDAD
418

programa.

419
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
TODO EL CÓDIGO FUENTE

420
421
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 Create
Install Free v4.14.4.
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”.
423
CREATE INSTALL FREE
424
CREATE INSTALL FREE
425
CREATE INSTALL FREE
426
CREATE INSTALL FREE
427
CREATE INSTALL FREE
428
CREATE INSTALL FREE
429
CREATE INSTALL FREE
430
CREATE INSTALL FREE
431
CREATE INSTALL FREE
432
CREATE INSTALL FREE
 Selecciona el espacio
en blanco encima de
“Demo”.
433
CREATE INSTALL FREE
 Selecciona el icono
“Crear nuevo archivo”.
434
CREATE INSTALL FREE
 Pulsa el icono “Guardar

proyecto ” para
guardarlo.
 Llámalo “PicRS232.ci” y
lo guardas en la
ubicación C:\CIF.
435
CREATE INSTALL FREE
436
CREATE INSTALL FREE
437
CREATE INSTALL FREE
438
CREATE INSTALL FREE
Pulsa “InicioAccesoriosHerramienta del sistemaMapa 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.
439
CREATE INSTALL FREE
440
CREATE INSTALL FREE
441
CREATE INSTALL FREE
442
CREATE INSTALL FREE
443
CREATE INSTALL FREE
444
CREATE INSTALL FREE
445
CREATE INSTALL FREE
446
CREATE INSTALL FREE
447
CREATE INSTALL FREE
448
CREATE INSTALL FREE
449
CREATE INSTALL FREE
450
CREATE INSTALL FREE
451
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
452
CREATE INSTALL FREE
453
SETUP.EXE
 En los enlaces de la derecha

puedes descargar el
“setup.exe” en formato
“setup_picrs232.zip” para
menor tiempo de descarga.  setup_picrs232.zip
 Puedes comprobar el  setup_picrs232.zip
funcionamiento como
cualquier instalador.
CREATE INSTALL FREE

454
CREATE INSTALL FREE
Fíjate que se puede colocar los logos e iconos. Queda muy

atractivo relacionado con el programa. 455
CREATE INSTALL FREE
456
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.
457
458
Algunas fotos del proyecto real sobre el puerto serie RS232 con C#.
FOTOS
459
FOTOS
460
461
462
Puedes ver algunos vídeos en youtube.com sobre este proyecto.
VÍDEOS
463
RS232 CON PIC 16F84A Y VISUAL C# EN

WINDOWS
 Ver vídeo 1
VÍDEOS (REQUIERE CONEXIÓN INTERNET)
464
Algunos libros relacionado con este manual.
LIBROS
465
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.
MICROCONTROLADOR PIC16F84. DESARROLLO

DE PROYECTOS
466
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
ELECTRÓNICA DIGITAL PARA FORMACIÓN

PROFESIONAL
467
OTROS MANUALES
468
DESCARGAS DE MANUALES
 Puedes descargar otros

manuales relacionado sobre
temas de
microcontroladores.
 Manuales.
 Manuales.
OTROS MANUALES
469
Enlaces de páginas Web donde podrás encontrar más información.
ENLACES DE INTERÉS
470
ENLACES DE INTERÉS
 http://www.microsoft.com/express Descarga la versión gratuita Visual C# .net
Express.
 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.
471
Publicado por primera vez: 04/12/2008
 Versión: 1.1
VERSIÓN DEL MANUAL
472
 Cualquier comentario,
Puedes publicar este tutorial o sugerencia o mejoras del
manual en tu Web, foros, blogs, CD,
DVD o Blue-Ray para revistas manual, me lo envían por
oficiales, etc, libremente.
correo electrónico al
metaconta@gmail.com
CONTACTO
473
AUTOR:
Ángel Acaymo M. G.
474

PicRS232 - 2

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

PicRS232 - 2

Cargado por

Copyright:

Formatos disponibles

metaconta@gmail.

Presentación del manual.

VISUAL C# .NET EXPRESS

VISUAL C# .NET EXPRESS

 En este manual se ha trabajado en su

 Visual C# Express Edition 2008 FrameWork 3.5

DESCARGA DEL VISUAL C# .NET EXPRESS

DESCARGA DEL VISUAL C# .NET EXPRESS

DESCARGA DEL VISUAL C# .NET EXPRESS

 Puede tardar unos

DESCARGA DEL VISUAL C# .NET EXPRESS

REGISTRO DE VISUAL C# .NET

Desde el botón de inicio de Windows,

EJECUTAR VISUAL C# .NET

RESTABLECER DISEÑO DE LA VENTANA

RESTABLECER DISEÑO DE LA VENTANA

 Le hará una pregunta

RESTABLECER DISEÑO DE LA VENTANA

INICIO VISUAL C# .NET

CREAR NUEVO PROYECTO

CREAR NUEVO PROYECTO

Se abrirá una ventana llamada

CREAR NUEVO PROYECTO

CREAR NUEVO PROYECTO

Como puedes ver en la imagen, se a

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

 Pulsa el botón “Guardar

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

 Al pulsar “Guardar todo”

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

 Ahora permanece fija y

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

 Dentro de la ficha que

INICIO DE UN NUEVO PROYECTO

INICIO DE UN NUEVO PROYECTO

 Una vez que todo esté

INICIO DE UN NUEVO PROYECTO

Nos familiarizamos con el entorno.

 Ahora que ya tenemos

 Hay varias maneras de

 También puedes ver el

CÓDIGO FUENTE DISEÑO

Vamos a explicar cada cuadro para

 Para compilar o ejecutar

 También puedes pulsar

 El objetivo principal de esta aplicación es hacer

 Pincha una vez en el

 Asegúrate que el código

 En el cuadro de propiedades de Propiedad Cambie a

 Haz introducido el botón Propiedad Cambie a

 Arrastra un “button” desde el Propiedad Cambie a

 Ahora con button3. Propiedad Cambie a

 Ahora con button4 pero Propiedad Cambie a