Requerimientos

Para poder realizar nuestro sistema de base de datos utilizaremos:

DBDesigner
MySQL para Windows
MySQL Administrator
MySQL Connector
Son programas que se pueden descargar gratis desde internet y fáciles de instalar y configurar, y por supuesto
Visual studio 2008.

Para el ejemplo que vamos a desarrollar vamos a partir de la idea de que el lector ya tiene conocimientos
básicos de .NET, de manejo y análisis de bases de datos utilizando “DBDesigner” y SQL, por lo mismo no voy a
abundar en detalles de algunas acciones realizadas en este manual.

Modelo conceptual de datos

Primeramente veamos de qué se trata nuestro sistema:

Se trata de llevar el control de las ventas de de productos de una refaccionaria X de piezas para autos,
debe mostrar un punto de venta e imprimir facturas, esta refaccionaria pertenece exclusivamente a un
taller mecánico por lo tanto se necesita llevar control de los vehículos que tiene cada cliente
(probablemente esto ultimo es absurdo e inútil, pero nos va a servir como práctica de relación maestro-
detalles de las tablas).

Así de sencillo, entonces utilizando DBDesigner el primer paso es

realizar el modelo conceptual de datos, se supone que en este
momento ya se ha realizado un análisis mediante algún modelo
entidad-relación.

Nuestro modelo debe quedar de esta manera:

Tenemos 5 tablas relacionadas y una tabla auxiliar para controlar los números de las facturas, si te preguntas de
donde salió la tabla “detallesVenta” recuerda que al hacer una relación de muchos a muchos se genera
automáticamente una nueva tabla, a la que en este caso editamos agregándole 3 campos mas.

Aureliux Página 1
Hasta ahora tenemos el “dibujo” de nuestra base de datos, pero a nosotros lo que realmente nos interesa es
crear la base de datos y no solo dibujarla, para eso desde DBDesigner crearemos un script el cual manejaremos
desde MySQL, para ello debemos seleccionar la opción File ->
Export -> SQL Create Script…

Nos debe aparecer un cuadro como el que se muestra en la

figura del cual podemos copiar el código del script directamente
al portapapeles o guardarlo en un archivo de texto, es mejor la
segunda opción ya que así podemos editarlo si algo anda mal en
el diseño de las tablas.

Damos clic en el botón “Save Script to file” y seleccionamos

donde queremos guardarlo, en este ejemplo yo lo he llamado
“refaccionaria” y lo guardé en una carpeta llamada “tutorialDB”.

Esto genera un archivo de texto con la extensión .sql en la

dirección seleccionada.

El archivo creado (refaccionaria.sql) contiene el código

SQL de lo que hemos diseñado, de las tablas y de las
relaciones e índices, ese archivo es solo texto y por si
solo no sirve para nada (por ahora).

Podemos ver el contenido del archivo, busca en la

dirección donde lo guardaste y ábrelo, seguramente se
abrirá con el bloc de notas.

Si sabes algo de SQL seguramente el código te a ser

familiar, sino no te debe afectar ya que MySQL para
Windows es bastante amigable y te permite trabajar
liberándote de la parte de la codificación, aunque es
recomendable que sepas un poco del
lenguaje para que sepas como actuar en caso
de que algo salga mal y lo debas corregir
manualmente.

Hasta este punto hemos terminado con

nuestro modelo conceptual de datos, es decir
nuestra base de datos apenas es un diseño,
una idea plasmada en una imagen,
independientemente que hemos creado un
script no hemos comenzado aún a crear
nuestra base de datos.

Aureliux Página 2
Crear la base de datos utilizando MySQL para Windows.

Al instalar MySQL para Windows se debe instalar también

una herramienta llamada “MySQL Query Browser”, esta
herramienta debe estar en el menú inicio de Windows,
búscale y por ahí debe estar el acceso directo.

Dependiendo de cómo hayas hecho la instalación, te va a

pedir unos datos para poder ingresar, por lo general el
servidor es “localhost” a no ser que al momento de
instalarlo lo hubieras configurado de manera diferente, el
nombre de usuario por defecto es “root” que también pudo
haber cambiado en la instalación y la contraseña depende
totalmente de la que hayas registrado al momento de
instalarlo, en mi caso es “sysdba”, la ultima opción la que
dice “Defaul Schema” representa el nombre de la base de datos con la que vamos a trabajar, por defecto se
utiliza una llamada “test”, pero es mas rápido colocar ahí el nombre de nuestra base de datos, en nuestro
ejemplo la llamaremos “RefaccionariaX”. Si es la primera vez que estas entrando con este nombre de base de
datos, te va a avisar que el nombre que escribiste no existe y te da la opción de crearlo, obviamente decimos
que “Yes” (Este proceso es el mismo si
quieres volver a entrar posteriormente).

Si todos los datos están correctos pulsa el

botón OK y sin problema debes ingresar a la
siguiente ventana.

En la solapa donde dice

“Schemata” se encuentra
un listado con todos los
esquemas de base de datos
creadas, en mi caso son
varios, si es el primero que
creas seguramente solo vas
a tener este que creaste y
uno llamado test, aunque
esto es irrelevante.

En ese listado se encuentra

“refaccionariax” debemos
dar doble clic sobre el para
sea la base de datos activa y
asi poder trabajar con ella
(Podemos identificar cual es
la base de datos activa
porque su nombre de encuentra en negritas diferenciándose de todos los demás de la lista), otra forma mas
laboriosa de hacer esto es dar clic derecho sobre el nombre y seleccionar la opción “Make default schema”.

Aureliux Página 3
 Como podremos observar tenemos un esquema de base de datos vacío, sin tablas,
sin nada, debemos hacer que todo lo que dibujamos en “DBDesigner” se convierta
en algo mas que un simple dibujo de un diagrama, para ellos vamos a utilizar el
script que generamos anteriormente (refaccionaria.sql), el cual habíamos dicho
que por si solo no sirve para nada, pero ahora utilizando “MySQL Query Browser”
es un complemento que nos liberará de diseñar las tablas manualmente.

Para ellos vamos al menú File -> Open Script y abrimos el archivo “refaccionaria.sql”, podemos ver que en la
ventana de resultados de en medio aparece el código SQL del script, en la parte superior de la ventana hay un
botón que dice “Execute”, pulsamos sobre el.

Y si no hay ningún error veremos que las tablas diseñadas en “DBDesigner”

aparecen en el esquema de “refacionariax”, si hubiera habido algún error
aparecerá en la parte inferior de la pantalla, en este caso lo mejor es
regresar y revisar que salió mal, pueden ser diversos motivos por los que
podría marcarse error.

Hasta ahora ya hemos creado el esquema de la base de datos en MySQL con

tablas, relaciones e índices… en este momento ya podemos ingresar a
“Visual studio 2008” y comenzar a diseñar.

Aureliux Página 4
Capa de datos (Configurando el acceso a datos a MySQL)

A partir de este momento ya podemos comenzar a diseñar nuestro sistema desde visual studio 2008, el lenguaje
que utilizaremos es Visual basic.net por ser mas sencillo y desde mi punto de vista (respeto todos los puntos de
vista) el mas enfocado para trabajar con bases de datos entre todos los lenguajes de visual studio, o por lo
menos el mas ameno para hacerlo.

Creamos un nuevo proyecto utilizando “Visual basic” y como plantilla seleccionamos “Aplicación de Windows
Forms”, guárdalo donde tu quieras (Supongo que esto ya lo deben dominar a la perfección).

La primera gran tarea es configurar nuestro acceso a datos con MySQL, es decir, lograr que “visual basic” logre
establecer comunicación con MySQL, por si solo no puede hacerlo ya que por defecto su administrador de bases
de datos es “SQL Server” y viene configurado para trabajar con el, sin embargo en un principio dije que
deberíamos instalar “MySQL Connector” ya que este paquete nos permite establecer conexión entre “Visual
studio” y “MySQL” si no lo tenemos instalado será imposible configurar nuestro acceso a datos.

Agregar referencia a MySQL: Aunque este paso se supone que se

hace automáticamente es mejor prevenir ya hacerlo manualmente,
consiste en agregar una referencia hacia los dll de “MySQL
Connector”, para ello en el explorador de soluciones damos clic
derecho sobre el nombre del proyecto y elegimos la opción
“Agregar referencia”.

Del cuadro de dialogo que aparece buscamos en la lista el elemento

MySQL.Data lo seleccionamos y damos clic en aceptar.

Agregar origen de datos: En la ventana de orígenes de datos damos clic en donde dice “Agregar nuevo
origen de datos” (Si la ventana orígenes de datos no aparece debes mostrarla seleccionando el menú
Datos -> Mostrar orígenes de datos).
Al hacer esto inicia un asistente que permite configurar el origen de datos, la primera pantalla nos pide
elegir el tipo de origen de datos, marcamos la que dice “Base de datos” y damos clic en el botón

Aureliux Página 5
 siguiente, la siguiente ventana es muy importante ya que nos pide elegir la conexión de datos, si es la
primera vez que entras seguramente te aparecerá un cuadro como este (o por lo menos algo parecido).

Para configurar la conexión es necesario

dar clic en el botón “Nueva conexión”.

Esto abre un nuevo cuadro de dialogo

donde se debe especificar el proveedor
de datos y la base de datos con los que
vamos a trabajar, entre los cuales
podemos encontrar Microsoft Access, o
SQL Server, y entre ellos también
encontramos a MySQL.

Para ello donde dice “Origen de datos”

encontramos una lista de todos los
proveedores disponibles en ese momento
en tu sistema, entre ellos está el de
MySQL, para seleccionarlo debes dar clic
en el botón “Cambiar”.

Es necesario rellenar los campos que pide, como ya habíamos dicho anteriormente, el nombre del
servidor en este ejemplo es localhost, el usuario es root y la contraseña es sysdba.

El campo correspondiente a la base de datos debe rellenarse

con el mismo nombre del esquema creado en “MySQL Query
Browser” en este caso es “refaccionariax”. La ventana debe

quedar mas o menos como se muestra en la figura de la

derecha:

Para saber si vamos por buen camino podemos probar la

conexión dando clic en el botón que dice “Probar conexión”,
si no hay ningún error saldrá un mensaje que dice: La
conexión de prueba se realizó correctamente.

Si todo va bien aceptamos dando clic en el botón “Aceptar”.

Acto seguido se nos muestra la misma ventana que estaba originalmente pero ahora ya tiene
establecido los parámetros correspondientes a la conexión con el servidor de datos y el archivo de base
de datos, nos pregunta si queremos incluir los datos de estos parámetros en la cadena conexión o si
queremos excluirlos, lo correcto es marcar la opción que dice “Si incluir los datos confidenciales…”, otro
dato importante a considerar es que enla cadena conexión aparecen los datos de lo que estamos
hablando.

Aureliux Página 6
 Teniendo claro lo anterior damos clic en el botón “Siguiente”.

En la siguiente ventana debemos guardar la cadena conexión con algún nombre, por defecto se le asigna
uno el cual podemos cambiar, en este caso le pondremos refaccionariaxCnn.

Damos clic en el botón siguiente.

Finalmente podemos crear el dataset correspondiente, podemos crear un dataset para todas las tablas
o dividir dependiendo de la lógica diferentes dataset’s.

En este ejemplo y para mayor simplicidad utilizaremos uno solo, al cual le pondremos como nombre
“refaccionariaxDs” y marcamos todas las tablas, con esto tenemos que en un solo dataset estarán
incluidas todas las tablas, y damos clic en el botón “Finalizar”.

Aureliux Página 7
Con todo esto ya tenemos configurado nuestro acceso a datos, ya podemos
comenzar nuestra aplicación, pero como un último dato antes de continuar
podemos ver en la ventana de orígenes de datos reflejado nuestro dataset con sus
respectivas tablas, y en la ventana del explorador de
soluciones el archivo creado para ese dataset, si en
momento deseamos eliminar el dataset por el motivo
que sea basta con eliminar este archivo del explorador
de soluciones y listo.

Capa de negocios

Estamos utilizando la arquitectura de N capas, que en ese caso son en realidad tres capas, la primera capa es la
de datos (ya a hicimos anteriormente al configurar la conexión), la segunda capa es la de negocio en donde
creamos todas las rutinas y métodos que ayudan a crear ciertas tareas para acceder y manipular los datos de la
base de datos.

Una manera fácil para comenzar a realizar nuestra capa de negocios es editando el dataset creado
anteriormente,

Damos clic derecho sobre el refaccionariaxDS en la ventana de

orígenes de datos y seleccionamos la opción “Editar Dataset
con el diseñador”, o también en la barra de herramientas esta
un botón que permite hacerlo de manera directa (En la figura
ambas opciones están encerradas con un circulo) puedes elegir
la que quieras.
Se nos despliega una nueva ventana (editor del tadaset) donde
encontramos todas las tablas (Estas tablas están acomodadas
desordenadamente,
pero puedes
arrastrar las tablas y
acomodarlas), en
esta ventana
podemos agregar
rutinas a cada tabla
que nos ayuden a
realizar
determinadas tareas
como por ejemplo:
guardar, eliminar,
consultar, listar,
etc..., todo esto
mediante
instrucciones SQL.

Aureliux Página 8
 Antes de empezar se debe tener muy claro las rutinas que se desea hacer con cada tabla, en este
ejemplo solo lo plasmaremos en una sola tabla tomando en cuenta que el proceso es el mismo para
todas las demás.

Trabajaremos con la tabla “articulos”, primeramente haremos:

o Guardar datos
Damos clic derecho sobre la tabla artículos del
submenú escogemos Agregar -> Query

Se ejecutará un asistente para configurar

alguna operación SQL, primeramente nos
pregunta que deseamos hacer, dejamos
remarcado la opción que dice “Usar
instrucciones SQL” y damos clic en el
botón “Siguiente”.

En el siguiente cuadro nos pregunta que

tipo de consulta deseamos, podemos
realizar una consulta típica para buscar
algún solo dato, o para buscar varios datos
dependiendo de un criterio de búsqueda,
etc…, entre estas opciones podemos
encontrar una que dice “INSERT” que nos
permite insertar directamente los datos en
las tablas, pues bien remarcamos esta
opción y damos clic en el botón
“Siguiente”.

Aureliux Página 9
 En el cuadro de diálogo “Especifique una
instrucción de SQL” nos muestra el código
que permite guardar los datos, este código
podríamos modificarlo (aunque no es
recomendable hacerlo en este caso), si
utilizas campos autoincrementables,
seguramente este no aparecerán aquí, ya
que como se genera automáticamente el
sistema no los incluye en esta operación.

El último paso es colocarle un nombre a

esta instrucción SQL que acabamos de
realizar, por defecto se le asigna uno, pero
lo recomedables es personalizarlo, en este
caso lo guardaremos con el nombre
“InsertArticulo” y pulsamos el botón
“Finalizar”.

Podemos ver ahora que en la tabla del editor del

dataset se encuentra reflejado esto que acabamos de
hacer.

Acabamos de hacer la instrucción para poder guardar

datos en la tabla artículos la cual invocaremos mas
adelante.

o Borrar datos

Así como hicimos una rutina SQL para insertar los datos directamente en la base de datos, también
podemos hacer una para eliminarlos, el proceso es similar al anterior, damos clic derecho sobe la
tabla y ejecutamos Agregar -> Query y avanzamos hasta el cuadro de dialogo donde nos pide elegir
un tipo de consulta.

Aureliux Página 10
 En este cuadro debemos remarcar la opción que dice “DELETE” y damos clic en el botón siguiente. A
continuación nos aparece el cuadro donde debemos especificar una instrucción DELETE de SQL

Por defecto se muestra un código

SQL de eliminación que puede
funcionar perfectamente, pero
debido a la gran cantidad de
parámetros se nos haría difícil
utilizarlo, podemos hacerlo mas
simple, para ello debemos dar clic en
el botón que dice: “Generador de
consultas”, a continuación nos
aparece un nuevo cuadro de diálogo
donde podemos configurar nuestro
query de borrado.

Este cuadro está divido en tres

partes, la parte superior contiene la
tabla y los campos utilizados en el
query, podemos eliminar campos y también agregarlos (pero por ahora es mejor no tocarlos), vemos
que está remarcada la opción que dice “Todas las columnas” lo cual es correcto porque así decimos que
estamos utilizando todos los campos de la tabla, la parte del centro contiene parámetros que realizan la
configuración del query, y la parte de abajo el código generado automáticamente.

Como dije anteriormente el código es muy confuso, ya que para borrar el registro bastaría tan solo
mandar como única parámetro el campo llave, es decir algo como esto:

DELETE FROM artículos WHERE codigo = @codigo

Aureliux Página 11
 Pues bien, modifiquemos el código, podemos seleccionarlo y borrarlo (no es necesario borrarlo todo
solo la parte que queremos modificar) de tal manera que nos quede de la siguiente manera:

Podemos observar que la parte de la configuración de los parámetros desaparecieron los

campos, esto no nos debe afectar al ejecutar el query asi que no debemos preocuparnos por
eso.

Si todo está correcto debemos dar clic en botón “Aceptar” y nos regresa al cuadro que estaba
originalmente, en donde podemos dar clic en el botón “Siguiente” avanzamos y guardamos la
instrucción SQL con el nombre que quieras, en este caso la guardamos con el nombre:
“DeleteArticulo” y seguimos avanzando hasta finalizar, veremos que en el editor del dataset
aparecerá listada esta instrucción en la sección que dice “articulosTableAdapter” junto con
“InsertArticulo”.

Es importante aclarar que si la esta tabla no estuviera relacionada hasta aquí bastaría, sin
embargo podemos ver que la tabla ”detallesVenta” depende de esta tabla ya que los detalles de
la venta dependen de los artículos, por lo tanto se debe eliminar primero los datos que
coincidan con este campo en la tabla “detallesVenta” pero a su vez la tabla detalles venta
también depende de la tabla “ventas”, asi que también hay que borrar en la tabla ventas, algo
asi como un borrado en cascada, esto con el fin de evitar inconsistencia en la integridad de los
datos, los querys nos quedarían como se muestran en las figuras de abajo.

Aureliux Página 12
 El primero lo llamaremos “DeleteDetallesVenta” y el segundo “DeleteVenta”, este asunto de
borrar datos no es nada irrelevante, al contrario es tan importante que de un mal borrado
podríamos dejar datos sueltos y que a la larga podrían darnos problemas.

o Buscar un dato (Consultas)

Aparte de insertar y eliminar otra tarea importante es buscar datos, consultar, podemos hacer
tantas consultas como necesitemos, por ejemplo podemos buscar por código, por nombre, etc…
podemos buscar un solo dato específico o un conjunto de datos que cumplan con un mismo
criterio por ejemplo todos aquellos cuya existencia sea menor de 50 artículos, bueno
primeramente hagamos una búsqueda por código, para ello el proceso es similar a los anteriore
querys: Agregar -> Query, avanzamos hasta el cuadro que nos pide elegir un tipo de consulta en
el cual remarcamos la opción que dice “SELECT que devuelve filas”, vemos que nos aparece un
cuadro similar a los vistos en los ejemplos anteriores, en el cual se nos muestra un código de
consulta que debemos modificar
para poder establecer que
queremos buscar por medio del
código, damos clic en el botón
“Generado de consultas” el cual nos
abrirá un el mismo cuadro donde
configuramos el “DELETE”.

Pues bien, en la parte de en medio

debemos establecer nuestro criterio
de búsqueda asi que en la fila
correspondiente al campo “codigo”
en la columna “Filtro” escribimos
“@codigo” lo cual le indicará a SQL
que para realizar la búsqueda deberá recibir como parámetro un valor que nos servirá de filtro.

Vemos el que código también ha cambiado, damos clic en “Aceptar” y avanzamos hasta
guardar el query con el nombre “FillByCodigo” y donde dice Nombre del método pongámosle
“GetDataByCodigo”, y avanzamos hasta finalizar.

Aureliux Página 13
 Podemos hacer otra consulta, donde nuestro criterio sea el nombre del artículo (descripción),
pues bien , repitamos todo el proceso anterior, lo único que vamos a cambiar es nuestro
criterio, quedando como se muestra en la figura:

Si ya manejas SQL seguramente este criterio te va a ser familiar, ya que utilizamos el operador
“LIKE”, funciona de manera similar al operador “=” pero con la diferencia que es aplicado solo a
cadenas y que nos permite utilizar comodines para buscar al principio de la cadena, al final, en
medio, etc…, por ejemplo si buscamos una palabra podemos buscarla en el principio, en el final
o en medio, ya lo retomaremos mas adelante, pero si no sabes como funciona te recomiendo
que lo investigues ya que en un principio dije que no abundaría en detalles.

Avanzamos y lo guardamos con los nombres “FillByNombre” y “GetDataByNombre” y listo

tenemos nuestras dos consultas.

o Actualizar datos (Modificaciones)

Hasta ahora tenemos insertar, borra y consultar, pero nos falta un query que nos permita
modificar datos, es importante determinar cuales queremos modificar, en este ejemplo solo
podremos modificar la descripción del producto, el precio y el punto de venta, podríamos hacer
un query por separado para cada uno, o uno solo que modifique a los tres, en este caso haremos
este último.

El proceso es similar a los

anteriores vistos, “Agregar ->
Query” avanzamos y donde
nos pide elegir un tipo de
consulta seleccionamos la
opción “UPDATE” y avanzamos,
nos aparece el cuadro donde
aparece el código por defecto
el cual debemos modificar
pulsando el botón “Generador
de consultas”.

En el generador de consultas
debemos modificar

Aureliux Página 14
 directamente el código tal como lo hicimos cuando queríamos borrar registros, para modificar
solo necesitamos especificar el nombre de la tabla, los campos a modificar con sus respectivos
parámetros y una referencia que en este caso es el campo llave.

Algo como esto:

Damos clic en el botón “Aceptar” y

continuamos hasta guardarlo con el
nombre “UpdateArticulos”, y
avanzamos hasta finalizar.

Hemos terminado con la tabla

artículos, de ti depende hacer lo demás en las otras tablas, es necesario hacerlo ya que de eso
depende el trabajo que haremos después, se puede hacer a medida que vayamos diseñando, así
que si ahora no sabes que exactamente que hacer en las otras tablas puedes avanzar y regresar
a este editor del dataset cuando sea necesario, pero lo recomendable es hacerlo desde ya y
dejar lo mínimo para después, por ahora tenemos nuestra tabla “articulos” de la siguiente
manera:

Capa del cliente(Formulario)

Ya configuramos el acceso a datos, ya hicimos las rutinas necesarias para manejar los datos, ahora solo falta
diseñar la interfaz del usuario, se muy bien que a veces cuando empezamos a hacer un sistema lo que queremos
es comenzar a diseñar y tirar código a diestra y siniestra, pero también se que eso es un error muy grande que
nos hace perder tiempo y regresar a modificar y corregir (si es que se puede corregir) muchas situaciones que no
se previeron, así que al desarrollar un sistema nos debemos armar de mucha paciencia y hacer las cosas en el
orden correcto.

Disculpen por ser tan insistente en este punto, pero debo repetir que no voy a ser tan detallado en algunas
acciones que realice, ya que este no es un tutorial de VB.NET si alguna de las cosas que aquí realizo no saben
como se hicieron lo mejor es investigarle en manuales que abundan en internet.

Aureliux Página 15
En este manual solo vamos a realizar las operaciones para la tabla “artículos” y cuando sea necesario nos
extenderemos a otras tablas.

o Menú principal

Mediante la herramienta “MenuStrip” creemos el menú principal el cual debe quedar como se muestra
en la figura de abajo, o por lo menos algo parecido, las imágenes puedes personalizarlas a tu manera.

Las principales propiedades quese deben cuidar son:

El nombre del formulario, lo llamaremos “menu”.

La propiedad “IsMdiContainer” la debemos establecer en verdadera para

poder incluir formularios dentro de ella (leer acerca de formulario mdi).

El titulo del formulario en esta caso le pondré “Menu del sistema de la

refaccionaria X”.

La propiedad “windowsState” le pondremos el valor “Maximized” para que

cuando se ejecute el formulario desde el inicio aparezca la ventana
maximizada.

Y si ya sabes utilizar las demás propiedades puedes personalizarlas a tu gusto, puedes ejecutar el
programa(pulsando F5) para ver como va quedando la aplicación y corregirle lo que no te haya gustado.

Como es de imaginarse cuando seleccionemos alguna opción del menú se debe abrir un nuevo
formulario, asi que debemos crear todos los formularios que necesitemos, comencemos con el formlario

Aureliux Página 16
 que permitirá controlar los datos de los productos (para seguir con los ejemplos con los que comencé
desde un principio), pero por ahora en el botón “Salir”coloquemos el siguiente código:

o Catalogo de productos

Este será un formulario que nos permitirá agregar,

eliminar, consultar, etc…, ralizar las operaciones mas
importantes que configuramos en la “capa de
negocios” para los productos. Para cada opción
importante deberemos crear un catálogo el cual será
llamado desde el menú princpal.

Primeramente debemos crear un nuevo formulario,

para ellos damos clic derecho sobre el nombre del
proyecto en el explorador de soluciones y
seleccionamos “Agregar -> Windows Forms”.

Enseguida podremos agregar un nuevo formualario al cual debemos colocarle un nombre, para ello en
el nuevo cuadro de diálogo que aparece debemos escribir el nombre del formulario sin borrar la
extensión “.vb”, en nuestro
ejemplo le llamaremos
productos.

Pulsamos el botón
“Agregar” y acto seguido
podremos ver en el
explorador de soluciones un
nuevo elemento con el
nombre del formulario que
acabamos de crear.

S
i

en un determinado momento quisieramos borrar el formulario solo

debemos eliminarlo de esta lista, asi mismo si
queremos acceder a este formulario solo
debemos dar doble clic sobre este elemento (esto ya lo deben saber), lo
mismo si quisieramos cambiarle de nombre, por ejemplo si te fijas el
formulario principal se llama “Form1.vb” lo cual no es muy ilustrativo o
adecuado, lo correcto sería que se llamara “menuPrincipal.vb”(o algo
parecido) asi que vamos a cambiarle el nombre, para ellos damos clic derecho sobre el y elegimos

Aureliux Página 17
 “Cambiar nombre” y sin borrar la extensión .vb escribimos “menuPrincipal”, ahora tenemos dos
furmarios (y pronto tendremos mas) facilmente identificables.

Sin embargo lo que a primera vista podremos ver cuando creamos un nuevo formulario es precisamente
un formulario vacío, el cua debemos darle forma y crear lo que queremos, podemos hacerlo de una
manera muy fácil aprovechando las herramientas que nos ofrece visual studio.

Las propiedades que vamos a cambiar a este formulario para ir iguales son:

ControlBox = Falso para que no se pueda maximizar, minimizar o cerrar, en

lugar de esto utilizaremos botones.

FormBorderStyle = FixedSingle para evitar que la ventana se redimensione,

esto para evitar que la ventana se distorsione al cambiarla de tamaño.

Text = Catálogo de productos… para que aparezca en la barra de título de la

ventana.

Y puedes personalizar las demás propiedades que tú consideres.

El tamaño del formulario también lo vamos a redimensionar a medida

que lo necesitemos (porque lo vamos a necesitar).

Coloquemos un botón y cuyo nombre sea “btnCerrar”, su texto

“Cerrar catálogo ” y la propiedad Anchor sea “Top, Left”, el
formulario nos debe quedar de esta
manera.

Vemos un formulario sencillo con un botón el cual está vacío, no

funciona porque no le hemos puesto nada, este botón debe cerrar
el formulario así que debemos programarlo para tal tarea, damos
doble clic sobre el botón y en el editor de código escribimos “Me.Close()” tal como se ve el la figura.

Otra cosa importante es invocar a este formulario que estamos

creando desde el menú, así que debemos cambiarnos al formulario
“menuPrincipal” y dar doble clic sobre el botón “Productos” del
menú.

En el editor de código escribimos

el siguiente código:

Aureliux Página 18
 La primera línea es para que el formulario aparezca en el centro de la pantalla, la segunda para indicar
que el formulario “productos” va aser una ventana hija de formulario “menuPrincipal”, y la ultima es
para mostrar la ventana, podemos correr el programa y veamos que está pasando.

Al ejecutar el programa y dar clic en el menu “Productos” podemos ver que aparece el formulario que
creamos.

Es tiempo de dar forma a nuestro catálogo, para ello debemos colocar un

“DataGridView” sobre el formulario, si nos pide seleccionar un origen de
datos no lo hagamos, como nombre (propiedad name) le ponemos
“grdArticulos”y lo redimensionamos junto con el formulario para que
tenga un tamaño mas o menos aceptable como se ve en la figura.

Las otras propiedades que debemos configurar de “grdarticulos” son:

o AutoSizeRowsMode en DisplayedCell para que el tamaño de las

celdas se ajusten al contenido dao de alta.
o Multiselect en falso para que no puedan seleccionar mas de una
fila al mismo tiempo.
o ReadOnly en falso para que no puedan editar el contenido del
datagridView.
o SelectionMode en FullRowSelect para que se selecciona todo el
renglón completo y no solo una columna

Para poder realizar cualquier operación con los datos se puede hacer de distintas maneras, algunas mas
fáciles que otras, de igual forma algunas menos funcionales que otras, respeto todas las formas de
diseñar en VB.NET, pero en este artículo voy a explicar la mía.

Aureliux Página 19
 Primeramente vamos a crear una nueva clase que nos
permita administrar los datos y los métodos que
configuramos en la capa de negocios.

Para agregar una nueva clase damos clic derecho sobre el

proyecto en la ventana del “Explorador de soluciones” y
escogemos “Agregar -> Nuevo elemento” con lo cual nos
muestra un nuevo cuadro de diálogo con una serie de
plantillas entre las cuales se encuentra una llama “Clase” la
cual seleccionamos y en el campo Nombre debemos colocar “adminDatabase” sin borrar la extensión
.vb (procedimiento similar al que utilizamos cuando agregamos un nuevo formulario), el nombre
“adminDatabase” es un nombre que a mi se me ocurrió ponerle a la clase, pero pudo haber sido
cualquier otro nombre.

Damos clic en el botón “Aceptar” y podemos ver el nuevo elemento en el “Explorador de soluciones” en
la ventana de diseño vemos el editor de texto de la clase vacía.

Primeramente debemos declarar un “dataset” y un “tableadapter” de la tabla “articulos” y luego crear

los métodos que realicen lo que queremos.

Todo lo que necesitamos está en el “dataset” configurado anteriormente, es decir solo debemos invocar
los métodos que se encuentran en “articulosTableAdapter”.

Fill retorna todos los elementos de una tabla.

DeleteArticulo borra un artículo.
FillByCodigo devuelve los campos que tengan un determinado
código.
FillByNombre devuelve los registros que tengan un determinado
nombre, etc…

Teniendo esto claro hagamos pues el siguiente código:

Aureliux Página 20
 Como podemos observar hemos declarado el dataset y el adaptadro, asi mismo hemos creado un método
que devuelve todos los registros de la tabla “articulos”, ahora regresamos el formulario “productos” y
damos doble clic sobre el para ir al evento “Load”, nos aparece el editor de código en el evento Load, pero
antes de programar este evento debemos crear el objeto de la clase que definimos anteriormente, y luego
afectar las propiedades “datasource” y “datamember” del datagridView para establecer la fuente de datos
y después de ello invocar el métdo “todosArticulos” tal y como se muestra en la figura siguiente:

Ahora podemos correr el programa y navegar en el menú “Productos” veremos que al cargarse el
formulario, este aparecerá con los datos de la tabla “articulos”, por supuesto que por ahora todavía está
vacía.

Por ahora nuestro formulario está muy

triste, parece que no sirve para nada, sin
embrago recordemos que todavía lo
estamos diseñando, ahora lo que vamos a
hacer es agregarle 5 botones mas y
configurarlos con las opciones “Agregar,
Eliminar, Modificar, Imprimir”.

La propiedad “anchor” le asignamos los

valores “Top,Rigth”.

Tenemos ahora 5 botones, uno de ellos es

para salir del formulario y a continuación comenzaremos a trabajar con los otros 4.

o Agregar datos

Comenzaremos agregando datos a nuestra tabla para poder ver como se vería cuando insertáramos datos,
para ello podríamos hacerlo directamente en este mismo formulario, sin embargo para una mejor

Aureliux Página 21
 presentación utilizaremos uno nuevo que nos permita capturar los datos y guardarlos, para eso agreguemos
un nuevo formulario con el nombre “addProductos”.

A este nuevo formulario agreguémosle 5 textBox, 5 Label y 2 botones, y debemos configurarlo de tal
manera que nos quede como se muestra en la figura:

txCodigo

txPrecio txDescripcion

txExistencia
btnGuardar

txPVenta
btnCancelar

Debemos ser consientes de la propiedad “MaxLength” de cada textBox

basándonos en el tamaño de cada campo, con el fin de evitar errores de
desbordamiento al momento de guardar datos, es decir si en mi campo código lo
definí como varchar(20) entonces significa que como máximo solo puede
guardar 20 caracteres, asi que a la propiedad MaxLenght de txCodigo le debo
asignar 20, en el caso de los numéricos debemos aplicar sentido común y determinar cuantos dígitos tendría
como máximo el campo y en base a eso asignarle un valor, de no hacerlo asi el textBox aceptaría hasta
32767 caracteres lo cual podría ser una causa de error al momento de guardar los datos.

Es evidente que al presionar el botón “Guardar” los datos deben almacenarse en la tabla y contrariamente
al presionar “Cancelar” el formulario debe cerrarse sin que nada suceda.

Debemos retomar la clase “adminDatabase” y crear un método que permita guardar los datos, agregamos
un método como este:

Ahora este método lo vamos a invocar desde el botón “Guardar” asi que damos doble clic sobre este botón
situado el en formulario “addProductos” y escribimos el siguiente código:

Aureliux Página 22
 Y en el botón “Cancelar” el siguiente código:

Y por último en el evento “Load” del formulario debemos limpiar los “TextBox” ya que siempre se quedan
con la última información utilizada y eso es muy molesto:

Hemos terminado con la codificación que nos permite guardar los datos, ahora debemos hacer que al pulsar
el botón “Agregar” del formulario “Productos” aparezca lo que hemos hecho, para ello escribimos el
siguiente código:

Listo podemos ejecutar nuestra aplicación y agregar un nuevo artículo:

A estas alturas ya podemos guardar

datos, pero el principal problema aquí
es la falta de validaciones como por
ejemplo que en el precio se teclee
letras en lugar de números o algo
parecido.

Para ayudarnos a validar utilizaremos

un nuevo control llamado “ErrorProvider”, coloca uno sobre el formulario
y ponle como nombre “Validaciones”.

Este control se coloca en la parte inferior del

formulario.

Aureliux Página 23
 Para poder validar cada “TextBox“ se debe hacer mediante el evento “Validating” en este ejemplo
comencemos con “txCodigo” dando doble clic sobre el evento “validating” y ahí validemos que no deje el
control en blanco:

Pero para que tenga un mejor funcionamiento debemos cambiar la

propiedad “AutoValidate” del formulario “addProductos” como se
muestra en la figura.

Para que veas para que sirve esto, corre el programa sin modificar
esta propiedad y luego córrela modificándola, verás que sin
modificarla no puedes avanzar hasta que corrijamos el error, de la
otra forma nos muestra el error pero nos deja continuar.

De esta misma manera valida los otros “textBox” para que no

queden vacíos.

Un asunto importante es validar el botón “Guardar” para que no deje guardar nada vacío, para esto
debemos desactivar el botón “Guardar” para tener mayor control al momento de guardar, es decir mientras
haya algún TextBox vacío este debe permanecer desactivado y se activará hasta que todos los controles
tengan algún valor. Agreguemos una función que retorna verdadero cuando haya algún TextBox vacío:

Lo que hacemos es recorrer todos los objetos que estén

en el formulario por medio del ciclo “For Each” y a
través de la propiedad “textLength” determinamos si
alguno está vacío y de esta manera sabemos que valor
retornar.

Teniendo esta función solamente debemos invocarla

desde el evento “KeyUp” de cada “TextBox”
asignándoselo a la propiedad “Enabled” del botón, y de
esta manera el botón se activará automáticamente cuando ya no haya TextBox vacíos..

Esto mismo para cada TextBox, ahora hagamos unas pruebas e

intentemos dejar algún valor en blanco y veremos el resultado
de nuestras validaciones, cuando dejemos algún campo vacío
nos marcará el error correspondiente y no se activará el botón
guardar.

Aureliux Página 24
 Hemos terminado de trabajar con nuestro formulario para guardar los datos, podemos personalizar otras
propiedades, en este ejemplo lo dejamos hasta aquí, es probable que se nos haya escapado algún detalle
pero debe ser mínimo.

o Eliminar datos

Eliminar registros será una tarea fácil, primeramente debemos agregar un método a la clase
“adminDatabase” que permita borrar un registro:

Regresamos al formulario “productos”, debemos saber que fila del dataGridView tenemos seleccionada
para que sea precisamente esa la fila a eliminar, para ello vamos a la propiedad RowStateChanged de
“grdArticulos” y escribimos:

Primeramente definimos una variable pública denominada

“valorCodigo” de tipo string en el inicio de la clase.

Y ahora si codificamos el evento RowStateChange:

Ahora debemos codificar el botón eliminar:

Ahora puedes agregar nuevos artículos a tu tabla y eliminarlos sin ningún problema, sin embargo como dije
anteriormente eliminar no es algo que no tenga repercusiones futuras, ya que antes de eliminar debemos
tener en cuenta si esta tabla tiene relaciones con otras tablas, en nuestro ejemplo si tiene, así que debemos
eliminar primero en las tablas que estén relacionadas (pero esto lo haremos después), por ahora dejémoslo
así.

o Modificar datos

Primero recordemos que en la capa de negocios definimos un método que permitía modificar los datos
de los artículos, pero dijimos que solo podríamos modificar la descripción del producto, el precio y el
punto de venta, el método lo llamamos “UpdateArticulos”.

Aureliux Página 25
 Creemos un nuevo formulario llamado “updateProducto” similar que utilizamos cuando dimos de alta a
un artículo.

Los nombres que utilizaremos para cada textBox serán

los mismos que se utilizaron para el formulario
“addProducto”, pero la propiedad “Enabled” de
txExistencia y de txCodigo las ponemos en falso, esto con
el fin de que esos campos no se puedan editar.

En el formulario “productos” debemos invocar a este

formulario por medio del botón “Modificaciones” asi que
colocamos este código en ese botón:

Si ejecutamos el programa podremos ver que nuestro

formulario va quedando como se muestra en la figura:

Podemos ver que los campos pertenecientes al código y

a la existencia no podemos modificarlos, sin embargo el
formulario está vacío, debemos hacer que nos muestre
los datos que queremos modificar.

Para ello debemos primeramente debemos regresar a la

clase “adminDatabase” y agregar este método, que lo
que hace es buscar un artículo por medio de su código:

Luego de eso debemos regresar al formulario “updateProducto” hacer el siguiente código en el evento
“Load” del mismo:

Con esto logramos que al ejecutarse el formulario aparezca con los datos que en ese momento estén
seleccionados en el datagridView del formulario “Productos”.

Aureliux Página 26
 Hasta ahora no hemos hecho nada para modificar los datos, para ello primeramente debemos regresar
nuevamente a la clase “adminDatabase” y agregar otro método que permita modificar los datos:

Regresando al formulario “updateArticulo” en el botón “Guardar” colocamos el siguiente código:

e
n

e
Por último en el botón “Cancelar”
colocamos:

Con esto ya podemos modificar cualquier dato.

o Reportes (Imprimir)

Ya podemos hacer altas, bajas, modificaciones, nos falta el reporte de los datos para verlo en pantalla o
mandarlo a la impresora, en este caso vamos a imprimir todos los artículos listados dados de alta.

Primeramente debemos colocar tres controles del cuadro de herramientas sobre el formulario
“productos”: El primero será un “PrintDialog”, el segundo será un “PrintDocument”, y el tercero un
“PrintPreviwDialog”, los configuraremos asi como se muestra en la figura:

Es importante fijarnos que la propiedad “document” apunta a al control documento, pues bien,
documento contendrá la información que se mandará a la impresora, este control es que debemos

Aureliux Página 27
 codificar, el control “impresora” nos mostrará un cuadro de diálogo que nos permitirá seleccionar la
impresora en la que queremos imprimir, asi como el número de copias, etc.., y por último “contenido”
nos mostrará una vista preliminar del documento antes de imprimirlo.

Antes de continuar debemos hacer una clase que nos permita hacer todo el trabajo de la impresiones,
se podrían utilizar algunas herramientas como CrystalReports o el generador de reportes que trae por
defecto visual studio que nos liberaría de código, pero repito que yo voy a enseñar este método que me
ha funcionado, si alguien quiere implementar sus métodos de reportear debe funcionar perfectamente
con este ejemplo.

Agreguemos una nueva clase a la que le llamaremos “reporte.vb”, primeramente declaremos las
variables que queremos utilizar:

Lugo creemos un método que inicializa la impresión:

Y por último el método que lanza la impresión a la impresora:

Aureliux Página 28
Explicar el código sería muy extenso así que si quieres saber como funciona cada instrucción vas a tener que
investigar por tu cuenta, pero funciona a la perfección.

Ya hicimos la clase ahora debemos regresar al formulario “productos” e invocar a

la clase desde ahí, primeramente seleccionamos el control “documento” y
codificamos el evento “BeginPrint”

Colocando el siguiente código:

Antes que nada agremos un nuevo objeto de la clase “reporte”

Ahora si inicializamos la impresión en el evento BeginPrint

Aureliux Página 29
 Ya inicializamos la impresión, pero no la hemos mandado a la impresora, para ello debemos ahora
codificar el evento PrintPage y colocamos el siguiente código:

Ahora para poder ver el reporte debemos codificar el botón “Imprimir” colocando el siguiente código:

Listo con esto ya puedes imprimir reportes…

o Busquedas (Consultas)

Para este ejemplo vamos a hacer una búsqueda por nombre, es decir que cuando se teclee el nombre
que lo busque en los datos de la tabla, para eso primeramente vamos a modificar un poquito nuestro
formulario añadiendo un TextBox y un Label, de tal manera que quede como se muestra en la figura (Al
TextBox lo llameremos “nameProduct”)

Antes de dontinua debemos agregar un método a nuestra clase “adminDatabase” que permita buscar
por medio del nombre:

De regreso a nuestro formulario “productos”, vamos a hacer nuestra búsqueda de tal manera que
cuando se vaya tecleando el nombre del producto se vaya filtrando la tabla al mismo tiempo, para ello
debemos codificar el evento KeyUp de “nameProduct” colocando el siguiente código:

Listo hemos terminado nuestro sistema, con muchas carencias que en otros textos se irán
enriqueciendo.

Aureliux Página 30
 Examen:
En base al texto anterior debes realizar un sistema de altas, bajas, modificaciones, consultas y
reportes del siguiente caso:

Una biblioteca desea tener el control de sus libros y de sus préstamos internos y externos de
libros, asi como un control de sus usuarios registrados.

Hacer un sistema que permita dar de alta los libros y los usuario, debe permitir buscar a los
libros por medio de su nombre lo mismo con los empleados.

Calificar:

Modelo conceptual de datos: 20%

Sistema 80%

Altas Tanto para los libros como para los usuarios.

Bajas Tanto para los libros como para los usuarios.
Modificaciones Tanto para los libros como para los usuarios.
Consultas por nombre Tanto para los libros como para los usuarios.
Reportes Tanto para los libros como para los usuarios.

Aureliux Página 31