miércoles, septiembre 05, 2007

Tutor Embedded Visual Basic - Capitulo 7

Por: Roberto Alvarado

Capitulo 7

En este nuevo capítulo del tutorial de eVB les muestro como debe quedar aproximadamente nuestra pantalla en tiempo de desarrollo de nuestra aplicación de tareas:

En este capítulo vamos a poner a funcionar las opciones del Menú que creamos en el capítulo anterior.

Para nuestro menú de Tablas tenemos tres opciones: Tareas, Clientes y Aplicaciones, vamos a colocar el código para cada vez que escojamos esta opción nos muestre la pantalla correcta.

Para esto, el código del evento MenuClick quedaría de la siguiente manera:

Private Sub MenuBar1_MenuClick(ByVal Item As MenuBarLib.Item)

Select Case Item.Key

Case "mnuTabTareas"

'TAREAS

fraTareas.Top = 0

fraTareas.Left = 30

fraTareas.Visible = True

Case "mnuTabClientes"

'CLIENTES

fraClientes.Top = 0

fraClientes.Left = 30

fraClientes.Visible = True

Case "mnuTabApp"

'APLICACIONES

fraAplicaciones.Top = 0

fraAplicaciones.Left = 30

fraAplicaciones.Visible = True

Case "mnuNuevo"

'NUEVO

Case "mnuEditar"

'EDITAR

Case "mnuborrar"

'BORRAR

Case "mnuCancelar"

'CANCELAR

Case "mnuGuardar"

'GUARDAR, GRABAR O SALVAR

Case "mnuCerrar"

'CERRAR LA OPCION ACTUAL

If fraTareas.Visible Then

fraTareas.Visible = False

End If

If fraClientes.Visible Then

fraClientes.Visible = False

End If

If fraAplicaciones.Visible Then

fraAplicaciones.Visible = False

End If

End Select

End Sub

Como podemos apreciar colocamos cada uno de los frames en la posición superior de la pantalla y lo mostramos, en la opción de cerrar ocultamos el frame si esta visible.

Lo más importante y esperados por todos.... la BD

Ahora vamos a empezar a trabajar con la base de datos, lo primero es verificar si el archivo cdb existe para ir a crearlo, al igual que las tablas que conforman nuestra base de datos.

Para poder hacer esto necesitamos el control FileSystem, y necesitamos activarlo en el proyecto, vamos al menú Project, y escogemos la opción Componnents, aquí seleccionamos Microsoft CE File System Control 3.0. Con esto en nuestra barra de herramientas de la parte izquierda nos van a aparecer dos controles: FileSystem y File.

Para insertar el control FileSystem en nuestro proyecto hacemos doble clic sobre el icono de la barra de herramientas , se inserta el control en la forma con el nombre FileSystem1; se puede cambiar el nombre de este control que seria la mas relevante de las 5 propiedades que muestra, ya que en ejecución este control es totalmente invisible a la vista del usuario.

Este es el código en el evento Load de la forma para verificar si existe el archivo o no:

'Verifico si existe el archivo CDB

If FileSystem1.Dir(App.Path & "Tareas.cdb") = "" Then

'No existe el Archivo

Call CrearBaseDatos

End If

Como podemos apreciar si el archivo no existe llamamos a una rutina o procedimiento llamada CrearBaseDatos. Esta rutina la vamos a colocar en un Modulo .BAS. Para crear este modulo .Bas nos vamos a la opción Project, escogemos Add Module y hacemos clic sobre el botón Open, esto nos creara un modulo en blanco, al cual le vamos a asignar el nombre de modTareas. Esto lo podemos hacer en la propiedad Name del Modulo.

En el modulo modTareas vamos a desarrollar la rutina CrearBasedatos, como vamos a crear las tablas que vamos a utilizar en el programa me permito colocar tal y como vienen en la ayuda de las EVT la descripción de los tipos de campos que podemos utilizar para nuestras tablas. No traduzco la descripción, porque considero esta sencilla y no quiero entrar en errores de interpretación. Así que aquí esta la descripción de los campos que podemos utilizar:

Data Type

Description

Varchar[(n)]

NULL-terminated Unicode character string of length n, with a maximum of 255 characters. If n is not supplied, then 1 is assumed.

Text

Variable length string that can hold up to 32,000 characters. It is typically used for more than 255 characters.

Varbinary[(n)]

Binary value of less than 256. If n is not specified, the default is 1.

Long Varbinary

Binary value of less than 65,469 bytes. This type is also known as OLE Object.

Integer, int

4-byte signed integer.

Smallint

2-byte signed integer.

Float

Double-precision floating point value.

Datetime

Date object value.

Bit

Logical or Boolean value. Zero is FALSE and nonzero is TRUE.

Uint

Unsigned 4-byte integer, which is provided for backward compatibility only.

Usmallint

Unsigned 2-byte integer, which is provided for backward compatibility only.

Enseguida les muestro el código de la rutina para crear la base de datos cdb y sus respectivas tablas, de acuerdo al diseño de la tercera entrega.

Sub CrearBaseDatos()

'Creo el archivo de Base de datos en la

'misma carpeta de la aplicacion

Dim rs As ADOCE.Recordset

Dim DB As String

Dim cnn As ADOCE.Connection

'Creamos el archivo CDB

DB = App.Path & "Tareas.cdb"

Set rs = CreateObject("ADOCE.Recordset.3.0")

rs.Open "CREATE DATABASE '" & DB & "'"

Set rs = Nothing

'Creamos las tablas

'Tabla de Tareas

Set cnn = CreateObject("ADOCE.Connection.3.0")

cnn.Open DB

cnn.Execute "CREATE TABLE Tareas (IdTarea Int, " & _

"Aplicacion varchar(5), " & _

"Tarea varchar(50), " & _

"Cliente Int, " & _

"Tiempo varchar(8), " & _

"FecIni DateTime, " & _

"FecFin DateTime, " & _

"Estado Varchar, " & _

"HoraInicio Varchar(8), " & _

"HoraFinal Varchar(8), " & _

"ValorHora Int, " & _

"Descripcion Varchar(255) )"

'Ahora la Tabla existe en la Base de Datos CDB

cnn.Close

'Tabla de Clientes

cnn.Open DB

cnn.Execute "CREATE TABLE Clientes (IdCliente Int, " & _

"Nombre varchar(50), " & _

"Direccion varchar(50), " & _

"Telefonos Varchar(20), " & _

"Celular varchar(20), " & _

"Fax Varchar(20), " & _

"ValorHora Int )"

cnn.Close

'Tabla del LOG

cnn.Open DB

cnn.Execute "CREATE TABLE Log (Fecha DateTime, " & _

"Hora varchar(8), " & _

"IdTarea Int), " & _

"Tipo Varchar, " & _

"Observacion varchar(255) )"

cnn.Close

'Tabla Aplicaciones

cnn.Open DB

cnn.Execute "CREATE TABLE Aplicaciones (IdApp Varchar(5), " & _

"Aplicacion varchar(30) ) "

cnn.Close

Set cnn = Nothing

End Sub

Con esto contesto una de las preguntas que más se hacen en los post, Como se pueden crear base de datos en Windows CE.

Esta es una muy buena opción para trabajar con la base de datos en el emulador, lo único es crear una rutina que suba los datos desde un archivo en formato de texto a las tablas de la base de datos. Esto lo realizaremos en un próximo capitulo.

Tutor Embedded Visual Basic - Capitulo 6

Por: Roberto Alvarado

Capitulo 6

En este capítulo vamos a crear la pantalla para los maestros de clientes y aplicaciones.

Clientes

Luego de abrir el proyecto Tareas, vamos a hacer click sobre la barra de titulo de la forma frmTareas y en la ventana de propiedades, vamos a buscar la propiedad Width, y le vamos a asignar el valor 7665.

Agregamos a nuestro proyecto un nuevo control frame con las siguientes características:

· Visible False

· Width 3405

· Height 2835

· Caption [Clientes]

· Left 3510

· Top 60

· Name fraClientes

Y dentro del frame colocamos los siguientes controles, fíjense que aquí están de nuevo las características del Frame:

Begin VBCE.Frame fraClientes

Height = 2835

Left = 3510

Top = 60

Visible = 0 'False

Width = 3405

Caption = "[Clientes]"

Begin VBCE.Label Label13

Height = 285

Left = 90

Top = 2040

Width = 705

Caption = "Vr. Hora:"

End

Begin VBCE.TextBox Text7

Height = 285

Left = 810

Top = 2010

Width = 1545

Text = ""

End

Begin VBCE.TextBox Text6

Height = 285

Left = 810

Top = 1710

Width = 1545

Text = ""

End

Begin VBCE.Label Label12

Height = 255

Left = 90

Top = 1770

Width = 645

Caption = "Fax : "

End

Begin VBCE.TextBox Text5

Height = 285

Left = 810

Top = 1410

Width = 1545

Text = ""

End

Begin VBCE.Label Label11

Height = 225

Left = 90

Top = 1470

Width = 675

Caption = "Celular :"

End

Begin VBCE.TextBox Text4

Height = 285

Left = 810

Top = 1110

Width = 1545

Text = ""

End

Begin VBCE.Label Label10

Height = 255

Left = 90

Top = 1140

Width = 705

Caption = "Telefono:"

End

Begin VBCE.TextBox Text3

Height = 285

Left = 810

Top = 810

Width = 2505

Text = ""

End

Begin VBCE.Label Label9

Height = 195

Left = 90

Top = 840

Width = 675

Caption = "Direcc. :"

End

Begin VBCE.TextBox Text2

Height = 255

Left = 810

Top = 540

Width = 2505

Text = ""

End

Begin VBCE.Label Label8

Height = 255

Left = 90

Top = 540

Width = 735

Caption = "Nombre :"

End

Begin VBCE.TextBox Text1

Height = 255

Left = 960

Top = 240

Width = 2055

Text = ""

End

Begin VBCE.Label Label7

Height = 255

Left = 90

Top = 240

Width = 945

Caption = "Id Cliente :"

End

End

Ahora ya tenemos la pantalla para capturar los clientes de nuestra aplicación. Entonces vamos a crear también la pantalla para capturar las aplicaciones que vamos a atender y enlazar a una tarea:

Begin VBCE.Frame fraAplicaciones

Height = 1215

Left = 3510

Top = 2940

Visible = 0 'False

Width = 3435

Caption = "[Aplicaciones]"

Begin VBCE.TextBox Text9

Height = 285

Left = 1230

Top = 570

Width = 2145

Text = ""

End

Begin VBCE.Label Label15

Height = 285

Left = 150

Top = 570

Width = 1005

Caption = "Aplicacion : "

End

Begin VBCE.TextBox Text8

Height = 255

Left = 1170

Top = 240

Width = 1725

Text = ""

End

Begin VBCE.Label Label14

Height = 285

Left = 120

Top = 270

Width = 1035

Caption = "Id Aplicacion :"

End

End

Quizás en este punto a muchos les es difícil colocar los controles en la misma posición en la cual yo estoy dando y esto se debe a que tienen la grilla (los puntos que aparecen en la forma) muy separados y no saben como configurarlos. Entonces, vamos a configurar el espacio de los puntos de la grilla, en el menú Tools, escogemos la opción Options... y nos muestra la siguiente pantalla:

En donde vamos a escoger la pestaña General y vamos a modificar los datos Width y Height del recuadro Form Grid Settings, tal como se muestra en la figura.

Una vez hecho esto presionamos el botón OK para guardar los cambios.

Tutor Embedded Visual Basic - Capitulo 5

Por: Roberto Alvarado

Capitulo 5

En este nuevo capítulo vamos a detallar más sobre los controles utilizados en el capítulo anterior.

Control MenuBar

Como pudimos ver en el anterior capítulo, este control nos permite crear menús y / o barras de herramientas o Toolbars como son más conocidas. Podemos utilizar o crear menús de textos, menús de botones (barras de herramientas), o la combinación de ambos como en el ejemplo de la entrega anterior.

Dim mnuTablas As MenuBarMenu

Dim mnuAccion As MenuBarMenu

Observamos se debe declarar dos variables de tipo MenuBarMenu, una para cada opción del menú a crear.

'Configuro el MenuBar

Set mnuTablas = MenuBar1.Controls.AddMenu("Tablas", mnuTablas)

mnuTablas.Items.Add 1, "mnuTabTareas", "Tareas"

mnuTablas.Items.Add 2, "mnuTabClientes", "Clientes"

mnuTablas.Items.Add 3, "mnuTabApp", "Aplicaciones"

Set mnuAccion = MenuBar1.Controls.AddMenu("Accion", mnuAccion)

mnuAccion.Items.Add 1, "mnuNuevo", "Nuevo"

mnuAccion.Items.Add 2, "mnuEditar", "Editar"

mnuAccion.Items.Add 3, "mnuBorrar", "Borrar"

mnuAccion.Items.Add 4, "mnuSepara1", "------------"

mnuAccion.Items.Add 5, "mnuCancelar", "Cancelar"

mnuAccion.Items.Add 6, "mnuGuardar", "Guardar"

mnuAccion.Items.Add 7, "mnuSepara2", "------------"

mnuAccion.Items.Add 8, "mnuCerrar", "Cerrar"

mnuAccion.Items("mnuSepara1").Enabled = False

mnuAccion.Items("mnuSepara2").Enabled = False

Luego configuramos cada uno de estos objetos Menú. En cada una de las instrucciones Set estamos creando una instancia de los objetos declarados antes, e inmediatamente les asignamos el texto o Caption que va a aparecer en la pantalla, como primer parámetro del método Addmenu de la colección Controls del control MenuBar, el segundo parámetro es la llave o Key del objeto, la cual nos va a permitir llamarlo o identificarlo en forma correcta.

Para el caso de la colección Ítems, o sea los submenús de cada uno de los objetos menú, llamamos al método Add para crear un Ítem, y los parámetros son, el índice del elemento dentro de la colección, el segundo es la llave o Key (para nosotros es nuestro identificador), el tercer parámetro es el Caption o mensaje que va a aparecer en la pantalla, existe un cuarto parámetro que es el estilo, pero hasta el momento no he podido ubicar los valores que deben ir y sus correspondientes efectos sobre el menú.

Como podemos ver en el código anterior he agregado un par de opciones para simular unos separadores dentro del menú de Acción.

En las dos ultimas líneas del código anterior, desactivamos las opciones mnuSepara1 y mnuSepara2 para simular una línea de separación de menús. gris.

Para capturar el evento de clic sobre alguno de las opciones del menú, utilizamos el evento:

Private Sub MenuBar1_MenuClick(ByVal Item As MenuBarLib.Item)

Select Case Item.Key

Case "mnuTabTareas"

'TAREAS

Case "mnuTabClientes"

'CLIENTES

Case "mnuTabApp"

'APLICACIONES

Case "mnuNuevo"

'NUEVO

Case "mnuEditar"

'EDITAR

Case "mnuborrar"

'BORRAR

Case "mnuCancelar"

'CANCELAR

Case "mnuGuardar"

'GUARDAR, GRABAR O SALVAR

Case "Cerrar"

'CERRAR LA OPCION ACTUAL

End Select

End Sub

A medida que avancemos iremos colocando el código necesario para cada una de las opciones del menú.

Ahora con botones

Ahora vamos a explicar los menús como barras de herramientas o Toolbars.

Podemos utilizar botones utilizando los iconos predefinidos del sistema, estos íconos son los que aparecen en la gráfica siguiente:

Primero definimos los objetos MenuBarButton que representa cada botón de la barra que vallamos a crear.

'Configuro los botones

Dim btnSepara As MenuBarButton

Dim btnInicio As MenuBarButton

Dim btnPrevio As MenuBarButton

Dim btnSigte As MenuBarButton

Dim btnFin As MenuBarButton

Luego configuramos cada uno de los botones. En nuestro caso, el primer botón es un separador para diferenciar el menú de texto del de los botones gráficos.

'Boton Separador

Set btnSepara = MenuBar1.Controls.AddButton

btnSepara.Width = 80

btnSepara.Style = mbrSeparator

'Boton Inicio

Set btnInicio = MenuBar1.Controls.AddButton("btnInicio")

btnInicio.Image = 1

btnInicio.Style = mbrDefault

'Boton Previo

Set btnPrevio = MenuBar1.Controls.AddButton("btnPrevio")

btnPrevio.Image = 2

btnPrevio.Style = mbrDefault

'Boton Sgte

Set btnSigte = MenuBar1.Controls.AddButton("btnSigte")

btnSigte.Image = 3

btnSigte.Style = mbrDefault

'Boton Ultimo

Set btnFin = MenuBar1.Controls.AddButton("btnFin")

btnFin.Image = 4

btnFin.Style = mbrDefault

Para nuestro caso las imágenes que estamos asociando a cada botón las colocamos en un control ImageList, el cual configuramos en esta parte del código:

' Configuro el tamaño de las imagenes

ImageList1.ImageHeight = 16

ImageList1.ImageWidth = 16

' Agrego las imagenes

ImageList1.Add App.Path & "Primero.bmp"

ImageList1.Add App.Path & "Atras.bmp"

ImageList1.Add App.Path & "Adelante.bmp"

ImageList1.Add App.Path & "Ultimo.bmp"

'Le decimos al MenuBar que use el ImageList

MenuBar1.ImageList = ImageList1.hImageList

Por eso asignamos a los botones las imagines 1, 2, 3 y 4 respectivamente.

Si vamos a utilizar los iconos del sistema no necesitamos crear un imagelist, eVB lo crea automáticamente con solo decirle el numero de los íconos del sistema en la propiedad Image, teniendo en cuenta la imagen de arriba de los íconos del sistema.

Para capturar los eventos click que se ejecuten sobre cada botón entonces usamos el siguiente evento:

Private Sub MenuBar1_ButtonClick(ByVal Button As MenuBarLib.MenuBarButton)

Select Case Button.Key

Case "btnInicio"

Case "btnPrevio"

Case "btnSigte"

Case "btnFin"

End Select

End Sub

Para finalizar con el control MenuBar, eliminamos de memoria los objetos utilizados

' Luego que los botones y los menus son agregados

' al MenuBar, los Objectos se liberan

Set mnuTablas = Nothing

Set mnuAccion = Nothing

Set btnSepara = Nothing

Set btnInicio = Nothing

Set btnSigte = Nothing

Set btnPrevio = Nothing

Set btnFin = Nothing

Frames

Me parece muy importante hablar de este control, particularmente en el desarrollo de aplicaciones para Windows CE, principalmente por la característica de que no se pueden descargar los forms (formas) de memoria en Windows CE.

El control Frame es intrínsico en eVB, eso quiere decir que viene dentro de los archivos del runtime de eVB, y no es necesario ir a la opción de referencias y referenciarlo, o ir a la opción de Componentes y escogerlo de allá.

El control Frame es un contenedor de controles, esto quiere decir que este control puede contener todos o casi todos los controles que maneja eVB dentro de él.

Particularmente yo, utilizo los frames para simular diferentes ventanas de la aplicación, solamente los pongo invisibles y los muestro cuando son necesarios y los muevo a las posiciones de la pantalla correspondiente. Esto lo veremos a medida que desarrollemos la aplicación y lo entenderán mejor.

Las propiedades que más utilizo de los frames son: Visible, Top, Left.

Con Visible muestro u oculto el frame de la pantalla

Con Top coloco la posición superior del frame en donde la necesito

Con Left coloco la posición izquierda del frame donde la necesito.

Resumen

Bien, en este Capitulo explicamos el control MenuBar para crear menús y barras de herramientas o botones gráficos, además se explica como podemos utilizar el control ImageList y como asignarle imágenes.

Aprendimos como asignarle un control ImageList a un control MenuBar, para poder usar las imágenes con botones en una barra de herramientas.

Además que podemos usar los iconos del sistema para utilizarlos en un MenuBar.

Que los frames van a ser nuestros mejores aliados para el desarrollo de aplicaciones en Pocket PC y Windows CE para simular diferentes ventanas o pantallas (como quieran decirles J ).