El Cuadrado Mgico

Temas
o
o
o
o
o
o
o

Conceptos bsicos de programacin.

La primera leccin, la primera aplicacin.
Crear el interfaz.
Label. Una etiqueta de texto.
Los botones.
Los eventos.
La gran prueba

Conceptos bsicos de programacin.

En trminos muy generalizados, una aplicacin es algo que recibe unos
datos, los procesa y devuelve unos resultados. A m me gustan
mucho los smiles y en este caso usar el del Tnel de Lavado. Los
datos son los coches sucios que entran en el tnel, la aplicacin es el
tnel mismo y los resultados son los coches limpios que salen del
tnel. Luego, para desarrollar una aplicacin, inicialmente debemos
hacernos las siguientes preguntas:

Para qu?
Cundo?
Con qu?, y
Cmo?

El Para qu? consiste en definir qu resultados queremos que nos

devuelve nuestra aplicacin. (Coches limpios)
El Con qu? define los elementos sobre los que nuestra aplicacin
realizar su cometido.(Coches sucios)
El Cundo? no es ms que determinar el momento en que se
ejecutar nuestra aplicacin. (Cundo se quiere lavar el coche.)
Por ltimo, el Cmo?, que es donde realmente trabajaremos. Esta
parte consiste en definir cmo va a realizar su trabajo nuestra
aplicacin. (Enjabonar, enjuagar, secar, etc.). Esta es la parte ms
importante del desarrollo de aplicaciones. Al definir el cmo te
encontrars que puedes (y debes), dividir las tareas en tareas ms
simples y tratar cada una de stas como si de una aplicacin

independiente se tratara, es decir, definir el Para que?, el Cuando?, el

Con que? y el Como?, de igual manera que hiciste con la aplicacin
principal. Esto se llama modularizar y consiste en tratar un problema
como subproblemas ms simples (mdulos). Todo esto puede parecer a
veces tedioso, pero es muy importante realizar un anlisis exhaustivo de
cmo queremos resolver el problema para no encontrarnos con
sorpresas a la hora de ejecutar nuestra aplicacin. Un error muy
extendido entre los programadores noveles consiste en empezar a
escribir lneas de cdigo sin haber analizado a fondo el problema a
resolver obteniendo de este modo, resultados inesperados en el 90% de
los casos.

La primera leccin, la primera aplicacin.

Como te dije en la bienvenida, desde la primera leccin vamos a
empezar creando una aplicacin.
Empecemos con el Para qu?:
Lo que queremos que haga nuestra aplicacin es crear cuadrados
mgicos, que son aquellos cuadrados en los que colocamos de
determinada forma los nmeros correlativos, empezando por el 1, hasta
llenar el cuadrado de tal forma que tanto las filas, como las columnas,
como las diagonales principales suman lo mismo. He aqu el ejemplo
ms sencillo, un cuadrado mgico de 3x3:
492
357
816
Figura 1.1. Cuadrado Mgico de 3x3

Si no te lo crees, comprueba tu mismo que todas las filas, todas las

columnas y las diagonales principales suman 15.
Bien, ya sabemos el PARA QUE?, es decir, lo que queremos que haga
nuestra aplicacin. Ahora tenemos que decidir el CUANDO?, y en este
caso es muy sencillo ya que la aplicacin har su tarea cuando el
usuario se lo pida y nada ms.
Ahora tenemos que definir el CON QUE?. Esta primera aplicacin es de
aquellas que no necesitan datos de entrada. Volvamos a los smiles.

Supn que tu aplicacin es "Encender el televisor", no necesita datos de

entrada, slo la accin de pulsar el botn de encendido, (ejecutar la
aplicacin), y el televisor se enciende, (mostrar los resultados).
Por ltimo tenemos que definir el COMO?, que es, si no me equivoco,
la parte que ms te gustar. En este primer caso, el Cmo? es muy
sencillo. Simplemente abrir una ventana tpica de Windows, mostrar
el mensaje "Quieres ver un Cuadrado Mgico?" y dos botones, uno para
"SI" y otro para "NO". Si el usuario pulsa "SI", nuestra aplicacin
mostrar un Cuadrado Mgico como el de la figura 1.1, y si pulsa "NO"
mostrar un mensaje de despedida y se cerrar la aplicacin.
Luego nuestra primera aplicacin constar de los siguientes pasos:
1.
2.
3.
4.

Abrir la ventana inicial.

Si el usuario pulsa el botn SI entonces mostrar el Cuadrado Mgico
Si pulsa el botn NO, mostrar el mensaje de despedida.
Cerrar la ventana.

Crear el Interfaz.
Para ello, primero tendremos que familiarizarnos con unos conceptos
bsicos. Que es una ventana?.Una ventana es simplemente una regin
rectangular con sus propios lmites. Dentro de VB se les conoce como
formularios de manera que empecemos ya. Inicia VB y en el cuadro de
dilogo Nuevo proyecto, en la pestaa Nuevo, selecciona el icono "EXE
estndar" y pulsa Abrir. Seguramente tu IDE se mostrar ms o
menos as:

Figura 1.2 Entorno Integrado de Desarrollo.

Por defecto, cuando VB abre un nuevo proyecto (as llamaremos a partir

de ahora a nuestra aplicacin mientras se encuentre en el proceso de
desarrollo), le asigna el nombre Proyecto1 que podemos ver como
ttulo en la ventana principal del IDE. En el rea de trabajo hay una
ventana con el ttulo "Proyecto1 - Form1 (Form)" y dentro de esta
ventana un formulario en blanco (o ms bien en gris) con el ttulo
Form1. Este es el formulario que vamos a convertir en la ventana inicial
de nuestra aplicacin, es decir, en el interfaz.
Para ello debemos configurar algunas de las mltiples propiedades del
formulario. Las propiedades son caractersticas que modifican de alguna
manera el objeto al que pertenecen.

Figura 1.3 La Ventana de propiedades

En el lado derecho del IDE puedes ver la Ventana de propiedades con el

ttulo "Propiedades - Form1". Esto quiere decir que el objeto activo en
este momento es el formulario Form1. Debajo del ttulo puedes ver un
cuadro de lista desplegable que de momento slo contiene "Form1
Form". Esta lista contiene todos los objetos que existen en nuestro
proyecto. En el caso que nos ocupa, slo tenemos un formulario, de ah
la palabra Form cuyo nombre actual es Form1 que es lo que aparece en
primer lugar en el elemento de la lista, Debajo de este cuadro de lista
tenemos una tabla de dos columnas con todas las propiedades
pertenecientes al objeto activo, en este caso el formulario. Esta tabla es
diferente para cada tipo de objeto. En la columna de la izquierda puedes
leer el nombre de la propiedad, y en la columna de la derecha su valor.
En el caso de un formulario, la tabla consta de 51 propiedades, aunque
para nuestro primer proyecto slo usaremos unas cuantas.
Caption
La primera que modificaremos ser, si todo lo has hecho como te
indiqu, la que contiene el cursor de seleccin, es decir, la que se
encuentra seleccionada (resaltada en color amarillo). Esta debe ser
Caption. Si no es as, seleccinala tu mismo. Existen tres mtodos para
seleccionar una propiedad:
1. Pulsa ++ donde letra es la inicial de la propiedad que deseas
modificar, El cursor de seleccin se coloca sobre la primera
propiedad que empieza con dicha letra. Si repites la letra, el
cursor de seleccin pasa sucesivamente a la siguiente propiedad
que empiece por dicha letra hasta que se encuentra con la ltima

que cumple esta condicin saltando entonces a la primera que la

cumpla para empezar de nuevo el ciclo.
2. Pulsar sucesivamente hasta colocar el cursor de seleccin en la
propiedad deseada.
3. Hacer clic con el ratn sobre el nombre o el cuadro de valor de la
propiedad que queremos modificar.
Una vez seleccionada teclea lo siguiente: Cuadrado Mgico. El texto
ir aparecer en el cuadro de la derecha de la propiedad Caption
conforme vas escribiendo y al mismo tiempo, en el Ttulo de nuestro
formulario, y es que Caption es la forma en que VB denomina a la
propiedad que contiene el ttulo del formulario.
(Nombre)
Otra propiedad que vamos a modificar es (Nombre) que es el nombre
con el que identificaremos el formulario internamente, es decir, en el
cdigo. VB por defecto le ha asignado el nombre Form1 que en este
caso nos valdra, ya que tendremos slo un formulario en la aplicacin,
pero cuando el nmero de formularios es considerable, es ms cmodo
saber de qu formulario se trata mediante su nombre. As pues
llammosle frmPrincipal. Por que este nombre? Te lo explicar.
Cuando empieces a trabajar con cdigos verdaderamente grandes, para
poder identificar a que clase de objeto te refieres cuando tratas una
variable, yo recomiendo este tipo de notacin. Las tres primeras letras
en minsculas, identifican el tipo de objeto, en este caso frm=formulario
y seguidamente el nombre que quieras darle, en este caso Principal ya
que es la ventana principal de nuestra aplicacin.
StartUpPosition
Esta propiedad determina la posicin de un objeto la primera vez que
aparece. Es decir, en el caso de nuestro formulario, la posicin en que
aparecer en la pantalla del usuario. Como podrs ver en la columna de
valor de esta propiedad aparece inicialmente "3 - Windows Default" y
una flecha hacia abajo que nos indica que es un cuadro de lista
desplegable. Si pulsas en esta flecha vers que tenemos las siguientes
opciones:
0 - Manual

No se ha especificado ningn valor inicial.

1 - CenterOwner

Centrado en el elemento al que pertenece.

2 - CenterScreen

Centrado en toda la pantalla.

3 - WindowsDefault Esquina superior izquierda de la pantalla.

En este caso vamos a seleccionar la opcin 2 -CenterScreen para que nuestro

formulario aparezca centrado en la pantalla del usuario. Puedes cambiar esta
propiedad con los siguientes mtodos:

1. Desplegando el cuadro de lista mediante la flecha abajo y seleccionando la

2.
3.

opcin deseada ya sea con un clic del ratn o mediante las teclas de cursor
hasta colocar la seleccin sobre el elemento deseado y pulsar .
Haciendo doble clic sobre el cuadro valor de la propiedad. Esto va cambiando
cclicamente los valores posibles.
Pulsando las teclas del 0 al 3, pero en el teclado normal.

Figura 1.4

Bueno, Quieres probar lo que hemos hecho hasta ahora? Pues simplemente pulsa

o pulsa F5, o elige men Ejecutar>Iniciar. Debes obtener una ventana como la de la figura 1.4.
sobre la herramienta Iniciar

Si no es as, algo has hecho mal, as que repasa los pasos que hemos
seguido hasta ahora e intntalo de nuevo.
Una vez comprobada la apariencia inicial de nuestra ventana, cirrala
pulsando sobre la en la esquina superior derecha de nuestra ventana, o
bien pulsa Terminar
, men Ejecutar->Terminar. Cualquiera de
estos pasos nos lleva de nuevo al IDE de VB para poder seguir
trabajando en nuestro proyecto.

Label. Una etiqueta de texto.

Ahora vamos a empezar a "adornar" nuestro formulario. Dijimos que
debe mostrar un mensaje. Para ello selecciona
Label (etiqueta) del
cuadro de herramientas. Una vez seleccionada al pasar el cursor sobre
el formulario vers que cambia a una cruz. Sita la cruz
aproximadamente a dos puntos de distancia de la esquina suoerior

izquierda y arrastra hasta dos puntos antes del borde derecho y unos
cuatro puntos abajo. Suelta el botn del ratn. aparece un rectngulo
delimitado por 6 cuadritos amarillos y el texto Label1 dentro de l. Este
es un objeto Label o etiqueta de texto con el cual, podemos definir un
texto que aparecer en nuestro formulario y que no es editable por el
usuario. Si observas la ventana de Propiedades, ahora ha cambiado, su
ttulo es Propiedades Label1 y muestra las propiedades de la etiqueta
que acabamos de crear. De nuevo, de las 37 propiedades de la etiqueta,
slo modificaremos unas cuantas.
Caption
La primera, igual que en el formulario, es Caption, que en este caso no
corresponde al ttulo sino al texto que aparece en la etiqueta. Modifcalo
tecleando Generador de un Cuadrado Magico. Vers que el texto va
apareciendo en el formulario, pero su aspecto no es muy vistoso. Vamos
a corregir esto.
Font
Primero vamos a modificar la propiedad Font que contiene las
caractersticas del fuente a utilizar en nuestra etiqueta. Si te fijas en la
columna de valor de esta propiedad, aparece un botn con tres puntitos
(elipsis)
a la derecha, esto significa que si lo pulsas se abre un cuadro
de dilogo, en este caso Fuente, en el que puedes definir las
caractersticas del texto. Selecciona Negrita como Estilo de fuente: y
12 como Tamao:. Tambin podemos cambiar el Fuente: pero esto lo
dejamos para ms adelante.

Figura 1.5

Si todo lo has hecho de acuerdo a las instrucciones anteriores, debes

tener un formulario semejante al que aparece en la figura 1.5. No te
extrae que el texto que acabamos de escribir no se vea completo, esto
es porque es ms largo que el tamao que hemos asignado inicialmente
a nuestra etiqueta, sin embargo esto lo podemos modificar sin
problemas. Nuestra intencin es que el texto aparezca todo en una sola
lnea. Podemos alargar la etiqueta, pulsando y arrastrando los dos
cuadritos amarillos de los lados derecho e izquierdo hasta llevarlos a sus
respectivos extremos, es decir, que ocupe todo el ancho del formulario.

Alignment.
Ahora ya tenemos el texto en una sola lnea, pero sigue sin ser perfecto.
Nos gustara que estuviera centrado en el formulario. Para esto tenemos
la propiedad Alignment que nos permite 3 opciones:
1. 0 - Left Justify
2. 1 - Right Justify
3. 2 - Center
Seleccionamos la tercera opcin para que centre el texto dentro de la
etiqueta.
AutoSize.
Por ltimo, y para eliminar zonas sobrantes de la etiqueta,
seleccionamos la propiedad AutoSize que nos permite los valores True y
False. Seleccionamos True y la etiqueta actualiza su tamao al justo y
necesario para el texto contenido. Por ltimo, y para que nuestra
etiqueta quede centrada con respecto al formulario, con la etiqueta
seleccionada, pulsa men Formato->Centrar en el formulario>Horizontalmente.

Figura 1.6

Si todo va bien, tu formulario debe tener una apariencia semejante a la

figura 1.6. Ahora, y como parte del ejercicio de control que haremos en
cada leccin, debes colocar otra etiqueta de texto, debajo de la anterior,
que contenga el siguiente texto: Quieres ver un Cuadrado Mgico?
con el fuente Arial, estilo Negrita y tamao 10, y centrado
horizontalmente con respecto al formulario por supuesto. Si alguna vez
al trabajar con los controles se te abre una ventana de texto que tiene
como ttulo Proyecto1 - frmPrincipal (Cdigo), no te preocupes,
simplemente cirrala y sigue trabajando. Esta ventana la veremos ms
adelante y es en la que escribiremos el cdigo de nuestro programa
cuando sea necesario. De momento seguimos en la fase de diseo y
ahora vamos a aadir los botones.

Los botones.

Como definimos al principio, nuestro formulario debe tener dos botones,

uno con el texto SI y otro con el texto NO. Para aadirlos selecciona la
herramienta CommandButton
del cuadro de herramientas. Igual que
hicimos para la etiqueta, simplemente coloca el cursor donde quieres
que aparezca el botn y arrastra hasta tener un tamao aceptable. No
te preocupes de momento por su aspecto, despus los arreglaremos.
Repite la operacin para tener as dos botones en el formulario, uno al
lado del otro. Ahora selecciona el primero, haciendo clic sobre l, y
observa como cambia la ventana de propiedades. Vamos a modificar
alguna de la 33 que tiene este control.
Caption
Igual que en la etiqueta, esta propiedad contiene el texto que aparece
dentro del control. Ahora debe tener el texto Command1 y lo has de
cambiar a SI, de igual forma que hicimos con el formulario o la etiqueta.
(Nombre)
Ahora modifica el nombre para que sea ms fcil identificarlo, escribe
btnSi en la columna valor de la propiedad (Nombre), como ves,
seguimos con las convenciones, utilizo las letras btn para identificar el
tipo de objeto, en este caso un botn, y el resto, es el nombre Si que
creo que es bastante explcito.
ToolTipText
Busca esta propiedad, y en la columna valor, escribe lo siguiente: Pulsa
aqu si quieres ver un Cuadrado Mgico. Este es el texto que
aparecer cuando el usuario coloque el ratn sobre el botn. Es como
una pequea ayuda que le sirve al usuario para saber que hace un
determinado objeto.
Height
Busca esta propiedad y asgnale el valor 255. As definimos la altura del
botn
Left
Para esta propiedad, que establece la distancia entre el borde izquierdo
del botn y el borde izquierdo del formulario, teclea el valor 1080.
Top

Esta propiedad contiene la distancia del borde superior del formulario al

borde superior del botn. Establcela a 2760.
Width
Por ltimo, establece el ancho del botn a 855.
Estas 4 ltimas propiedades, las puedes establecer dinmicamente, es
decir, trabajando sobre el objeto en el diseo de formulario. Por
ejemplo, para definir la altura del botn, selecciona primero la propiedad
Height en la ventana de propiedades, despus pulsa y arrastra uno de
los cuadritos amarillos que hay en el botn en el lado superior o inferior,
suelta el ratn y comprueba en la ventana de propiedades si el valor que
muestra para la altura es el deseado. Igualmente puedes hacer para
determinar la posicin. Primero selecciona la propiedad para ver su valor
y despus, haciendo clic en el centro del objeto y arrastrando, lo puedes
colocar donde desees. Tambin, si arrastrando dejas un momento el
ratn quieto, aparecen los valores en un cuadro con el fondo amarillo, lo
cual resulta muy til cuando quieres establecer un valor determinado.
Como parte del control de la leccin, de nuevo te dejo para que tu
mismo establezcas las propiedades del segundo botn como sigue:

Nombre: btnNo

Figura 1.7

Caption: No
Height: 255
Left: 2760
ToolTipText: Pulsa aqu si no quieres ver un Cuadrado Mgico.
Top: 2760
Width: 855

Si todo va bien, tu formulario debe parecerse al de la figura 1.7. Ya casi

llegamos al final de la fase de diseo. Nos queda por ltimo el famoso
Cuadrado Mgico, pero Como vamos a mostrarlo?. Para ello vamos a
hacer uso de una propiedad muy interesante que tienen todos los
objetos, Visible. Esta propiedad nos permite colocar un objeto en el
formulario, pero que no sea visible al usuario. Aprovechando esta
caracterstica vamos a colocar el cuadrado mgico en nuestro formulario

y una vez terminado lo ocultaremos para hacerlo visible mediante el

cdigo, es decir en tiempo de ejecucin, cuando el usuario pulse el
botn Si.
Crea una etiqueta con los siguientes valores:

(Nombre): lblElementoCM
Alignment: 2 - Center
Appearance: 0 -Flat
BorderStyle: 1 - Fixed Single
Caption: 0
Font tamao: 12
Height: 330
Left: 1800
Top: 1200
Visible: False
Width: 315

El resto de las propiedades djalas con sus valores por defecto. Este
objeto representa una de las celdas del cuadrado mgico, pero
necesitamos 8 ms prcticamente idnticas pues vamos a mostrar un
Cuadrado Mgico de 3x3, o sea de 9 celdas. Para ello vamos a utilizar
otra apreciable caracterstica del diseador de formularios de VB.
Pulsa sobre la etiqueta que acabas de crear con el botn derecho del
ratn. Aparece un men contextual y selecciona Copiar. Tambin
puedes usar el men Edicin->Copiar. Despus pulsa con el botn
derecho del ratn, pero esta vez sobre cualquier zona del formulario que
no tenga ningn objeto, y en el men contextual selecciona Pegar, o
bien, men Edicin->Pegar. Aparecer un cuadro de aviso con el
siguiente mensaje: "Ya existe un control llamado 'lblElementoCM'.
Desea crear una matriz de controles?" y tres botones: "Si, No y
Ayuda". De momento pulsa , en la siguiente leccin entenders lo til
que resulta crear una matriz de controle, que no es otra cosa que los
controles que pertenecen a la matriz tienen el mismo nombre y se
identifican por un ndice. En este caso tendremos dos etiquetas con los
nombres lblElementoCM(0) y lblElementoCM(1) respectivamente. Coloca
esta nueva etiqueta al lado derecho de la primera. Repite la operiacin
de pegar y ve colicando las etiquetas hasta formar una matriz de 3x3. Si

Figura 1.8

todo va bin, tu formulario debe parecerse al de la figura 1.8. Es muy

importante que hayas seguido el orden que te especifico a la hora de
acomodar las 9 celdas del cuadrado, es decir, llenar primero la primera

fila, despus, y empezando por la izquierda, llenar la segunda fila y, por

ltimo, la tercera fila de la misma forma. Esto es importante porque
ahora te voy a listar los valores que debe tener cada etiqueta en su
propiedad Caption y para ello te doy el nombre con su ndice y el valor,
y si los has colocado de forma diferente, tu cuadrado no sera mgico,
ya que no se cumplira la condicin de que la suma de las filas, las
columnas y las diagonales principales sea la misma. As que asigna los
siguientes valores como se supone que ya sabes hacerlo:

lblElementoCM(0).Caption
lblElementoCM(1).Caption
lblElementoCM(2).Caption
lblElementoCM(3).Caption
lblElementoCM(4).Caption
lblElementoCM(5).Caption
lblElementoCM(6).Caption
lblElementoCM(7).Caption
lblElementoCM(8).Caption

=
=
=
=
=
=
=
=
=

4
9
2
3
5
7
8
1
6

Ahora prueba la aplicacin como hicimos antes. Vers que, si lo has

hecho todo correctamente, aparece el formulario, con los mensajes, los
botones y nada ms. El Cuadrado Mgico no se ve. Pero adems
observars que si pulsas cualquiera de los botones , o , no pasa nada.
No te preocupes, esto es completamente normal, ya que no hemos
definido qu tiene que hacer nuestra aplicacin cuando el usuario pulse
uno de los botones, y esto es lo que vamos a aprender seguidamente.

Los eventos.
Un evento es una accin reconocida por un objeto, como hacer clic con
el ratn o presionar una tecla, para la que se puede escribir cdigo de
respuesta. Los eventos pueden producirse como resultado de una accin
del usuario o del cdigo, o pueden estar desencadenados por el sistema.
En nuestro caso, los objetos son los botones y la accin que deben
reconocer es ser pulsados. Es decir, se debe generar un evento cuando
el usuario pulse y otro evento cuando el usuario pulse .
Poco a poco iremos viendo que cada objeto puede controlar distintos
eventos, y que definir qu es lo que debe de hacer nuestra aplicacin
cuando se lance dicho evento es lo que nosotros definiremos en el
cdigo. Para ello tenemos que entrar en la ventana del Editor de cdigo.
Hay varias formas de entrar en el Editor de cdigo:

Pulsa dos veces sobre el objeto en cuestin.

En el men contextual del objeto, (pulsando el botn derecho sobre l),
seleccionar Ver cdigo

Men Ver->Cdigo

Usa cualquiera de los mtodos anteriores. y se abrir una ventana con

el ttulo Proyecto1 - frmPrincipal (Cdigo). Este es el Editor de cdigo.
Es como un procesador de textos muy especializado con cierto nmero
de caractersticas que facilita en gran medida la escritura de cdigo en
Visual Basic. La ventana del Editor de cdigo se muestra en la figura
5.4.

Figura 1.9 - El Editor de cdigo

Debajo del ttulo hay dos cuadros de lista, el primero lista los objetos
presentes en nuestro formulario, de momento debemos seleccionar
btnSi de la lista (que es el botn del Si). Una vez seleccionado este
objeto, en el cuadro de lista de la derecha aparecen listados los eventos
o Procedimientos que puede lanzar dicho objeto. El que nos interesa de
momento es Click (que corresponde a hacer clic con el botn izquierdo
del ratn sibre el objeto. Si tienes todo seleccionado tal y como te he
indicado, en la zona de edicin del editor, el cursor estar justo debajo
de una lnea que reza lo siguiente:
Private Sub btnSi_Click()

End sub
Esta es la porcin de cdigo que encierra las acciones que se deben
ejecutar cuando un usuario hace click sobre el botn btnSi de nuestro
formulario. Bien, Que es lo que queremos que haga nuestro programa
cuando el usuario pulse ?. La respuesta es "Mostrar el Cuadrado
Mgico". Vayamos por partes: Por un lado tenemos que hacer visible la
matriz de etiquetas que creamos con los nmeros del cuadrado mgico,
por otro lado, hacer invisible la segunda etiqueta, la que dice "Quieres
ver un Cuadrado Mgico?", tambin debemos hacer invisibles los
botones y , ya que ninguno de estos objetos tendrn utilidad una vez
que se muestra el Cuadrado Mgico. Para hacer invisibles estos tres
objetos slo tenemos que modificar una propiedad, Podras decir cul
antes de seguir leyendo?..... Si pensaste en la propiedad Visible
acertaste!. Cuando desde el cdigo queremos modificar una propiedad
de un objeto, la sintaxis es como sigue:
Objeto.Propiedad = Valor
Como ves, primero debemos indicar el objeto al cual queremos
modificar una propiedad, despus, y separada por un punto, la
propiedad en cuestin, por ltimo y separado por un signo "=" el nuevo
valor. Pues bien, para el caso de nuestra etiqueta el cdigo ser:
Private Sub btnSi_Click()
Label2.Visible = False
End sub
Puedes teclearlo tal cual en el Editor de cdigo, pero te ensear una
forma ms fcil y que te evitar muchos errores de sintaxis.

IntelliSense
El Editor de cdigo de Visual Basic posee una caracterstica muy
interesante que Microsoft llama IntelliSense. Consiste en que,
conforme vas escribiendo el cdigo, VB te ayuda a hacerlo. Veamos
como.
Colcate en el Editor de cdigo, justo debajo de la lnea Private Sub
btnSi_Click(), y teclea Label2 que es el nombre de la segunda etiqueta,

en el momento que pulses el punto "." vers que aparece un cuadro de

lista que contiene todas las propiedades del objeto Label2. Como en
cualquier cuadro de lista de Windows, te puedes desplazar con las
flechas de cursor, con las iniciales, etc. Busca la propiedad Visible, vers
que se selecciona con slo pulsar la letra "V", si hubiera ms de una
propiedad con la misma letra, no tienes ms que seguir tecleando las
letras siguientes de la propiedad hasta que sta est seleccionada, o
bien, usar las flechas arriba o abajo o el ratn, para seleccionar la
propiedad que buscas. Una vez seleccionada, puedes:

Pulsar la tecla Tab o hacer doble clic, lo cual copia la propiedad y deja el cursor
justo despus de ella.
Pulsar la tecla Espacio lo cual copia la propiedad y deja el cursor un espacio
despus de ella.
Pulsar ENTER lo cual copia la propiedad y deja el cursor en la siguiente lnea.

Del mismo modo, una vez pulses el sigo "=" aparece un cuadro de lista
con los valores posibles para dicha propiedad, en este caso False o True.
Con cualquiera de los mtodos antes descritos selecciona False y ya
est.
Aprovechando esta caracterstica, si no ests seguro de que objeto es el
que quieres modificar, puedes escribir primero el contenedor, en nuestro
caso, el formulario que contiene los objetos, as, teclea frmPrincipal y
en cuanto teclees el punto ".", aparece la el cuadro de lista que muestra
todos los objetos contenidos en el formulario. La lnea resultante sera:
Private Sub btnSi_Click()
frmPrincipal.Label2.Visible = False
End sub
Teclea las lneas de cdigo para los botones "Si" y "No". Para la matriz
de nmeros es un poco diferente as que lo haremos ms adelante. El
cdigo debe ser como el siguiente:
Private Sub btnSi_Click()
Label2.Visible = False
btnSi.Visible = False
btnNo.Visible = Flase
End sub

o bien:
Private Sub btnSi_Click()
frmPrincipal.Label2.Visible = False
frmPrincipal.btnSi.Visible = False
frmPrincipal.btnNo.Visible = Flase
End sub
segn uses la primera o la segunda sintaxis.
Para el caso de la matriz, y ahora vers que til nos va a resultas haber
creado una matriz con estos objetos en lugar de objetos independientes.
Como puedes ver en la ventana de propiedades, si seleccionas
cualquiera de los cuadros de texto, se llama lblElementoCM(n), donde n
representa un ndice dentro de la matriz. En nuestro caso n va desde 0,
que es el primer elemento, hasta 8, que es el ltimo, es decir, tenemos
9 elementos en nuestra matriz. Un mtodo para hacerlos todos visibles
sera escribir una lnea de cdigo por cada elemento para establecer la
propiedad Visible a True. En este caso, con slo 9 elementos, no resulta
muy engorroso, pero imagina que tuvieras 100 elementos o ms en la
matriz, entonces si sera una tarea un poco larga, tener que escribir una
lnea de cdigo para cada elemento de la matriz. Pero gracias a las
maravillas de la programacin, tenemos una estructura en VB que se
llama bucle For Next que nos va a simplificar mucho el trabajo. La
sintaxis de esta estructura es como sigue:
For
contador
[sentencias]
Next

inicio

To

fin

[Step

intervalo]

El contador debe ser una variable numrica, en nuestro caso usaremos n.

inicio es el valor inicial del contador, en nuestro caso 0.
fin es el valor final, es decir, hasta donde queremos que se repita el bucle, en
nuestro caso 8.
intervalo, que es opcional, define el incremento que sufrir n despus de cada
iteracin (repeticin del bucle). Si no se especifica intervalo se asume un
incremento de 1 que es nuestro caso.
sentencias son las lneas de cdigo que se repetirn en cada iteracin, en
nuestro caso lblElementoCM(n).Visible = True.

Luego en nuestro caso el cdigo queda como sigue:

Private Sub btnSi_Click()

Label2.Visible = False
btnSi.Visible = False
btnNo.Visible = Flase
For
n
=
0
to
8
lblElementoCM(n).Visible = True
Next
End sub
Que traducido a lenguaje coloquial sera:
Para cada caso de n que va desde 0 hasta 8 en intervalos de 1 en 1,
hacer visible el elemento n de la matriz lblElementoCM lo cual es lo que
estbamos buscando. Como puedes ver, hemos reducido a 3 lneas lo
que de otra forma hubiera ocupado 9, esto supone un ahorro del
66.66%, pero lo ms sorprendente es que el cdigo ocupara las mismas
3 lneas si la matriz fuese de 100, 1000, un milln, etc., cualquier
tamao que tuviera la matriz con lo cual el ahorro es exponencial.
Un detalle importante que quiz ya te hayas preguntado: Por que la
lnea dentro del bucle est indentada? (desplazada hacia la derecha con
respecto al resto del texto). Tiene que ser as? La respuesta es NO,
pero es conveniente para la mayor claridad, legibilidad y mejor
entendimiento del cdigo. En este caso son muy pocas las lneas de
cdigo, pero conforme avancemos en el curso, los programas se
complicarn y entenders la utilidad de esta costumbre.

La gran prueba.
Por fin llegamos al final de la primera leccin. Nuestro primer programa
est casi terminado. Vamos a probarlo! (si es que no lo has hecho ya
impaciente). Para probarlo slo tienes que pulsar F5, el botn Iniciar
o men Ejecutar->Iniciar. Si todo va bien, vers tu formulario en el
centro de la pantalla con dos textos y dos botones. Si pulsas el botn ,
no debe pasar nada, pero si pulsas el botn , deben borrarse la segunda
etiqueta y los dos botones y adems aparecer el famoso cuadrado
mgico. Termina pulsando la para cerrar el formulario y volver al IDE.
(Si algo no va bien, anota el mensaje que te da y envamelo por correo)

Ejercicio de control.

Pues bien, y como ejercicio de comprobacin de esta leccin debers

hacer lo siguiente:
1. Escribir el cdigo para el evento Click del botn , de manera que modifique el
2.
3.

texto de la segunda etiqueta (Label2) para que se lea "Pues t te lo pierdes"

Aadir las lneas de cdigo necesarias para que, despus de mostrar el
Cuadrado Mgico, el texto de la segunda etiqueta cambie a "Las filas,
columnas y diagonales suman 15. Comprubalo".
Una vez terminado y comprobado, guarda los cambios y posteriormente
envame por e-mail tu proyecto. Si no sabes como hacerlo pulsa aqu para las
instrucciones detalladas.

Si consideras que ya ests preparado, puedes acceder al examen de la

Leccin 1

Temas
o
o

Introduccin.
La entrada de datos.
Los cuadros de introduccin de datos. Inputbox.
Las Funciones.
La funcin InputBox.
Los cuadros de texto. Textbox
Los cuadros de texto con formato. Rich Textbox
Las estructuras de control de flujo del programa.
Las estructuras de decisin.
If...Then.
If...Then...Else.
Select Case.
El Algoritmo
Los Procedimientos.
Los Parmetros.
El Desarrollo.
El tipo de dato Array.
Ejercicio de control.

Introduccin.
Si has aprobado el examen y la prctica, en estos momentos debes
tener una pequea aplicacin que, a peticin del usuario, dibuja un CM
(Cuadrado Mgico) de 3x3. Pero los Cuadrados Mgicos pueden ser
mayores, de hecho, es infinito el nmero de CM's que podemos crear,
siguiendo
determinadas
reglas.
En esta leccin vamos a ampliar nuestra aplicacin con una nueva

caracterstica. El usuario podr elegir el tamao del CM y para ello

vamos a aprender a utilizar un objeto sumamente til para la
interaccin aplicacin-usuario, la entrada de datos.

La entrada de datos.
En la mayora de las aplicaciones, se requiere la intervencin del
usuario, para algo ms que abrir o cerrar ventanas, pulsar botones o
seleccionar elementos de listas o mens. En todos estos casos, la
aplicacin conoce todas las posibles respuestas, ya que pertenecen a un
conjunto
finito
de
opciones
posibles.
Pero que pasa cuando los datos que necesita la aplicacin son
imprevisibles?; por ejemplo: si necesitamos una fecha, la cantidad de
capital para calcular un rendimiento, un nombre de usuario, el tamao
de
un
CM,
etc.
Para estos casos Vb nos ofrece varias opciones. Cada una la veremos de
forma general y alguna de forma ms especfica. Estas opciones son:

Los cuadros de introduccin de datos. Inputbox.

Los cuadros de texto. Textbox.
Los cuadros de texto con formato. RichTextBox.

Los cuadros de introduccin de datos. Inputbox.

Aunque no es la forma ms comnmente utilizada para la entrada de
datos, la funcin InputBox es, en ocasiones, bastante til.
Si te has fijado, no he hablado de control sino de funcin y es que
InputBox es una funcin y no un control. Veamos que significa esto.
Las Funciones.
Visual Basic como todos los lenguajes de programacin tiene funciones y
procedimientos incorporados aunque tambin puedes definir los tuyos
propios.
Una funcin es una porcin de cdigo que realiza una tarea especfica,
que puede recibir datos de entrada, conocidos en el argot informtico
como parmetros o argumentos y que, a diferencia de los
procedimientos
de
evento
siempre
devuelven
un
valor.
Esta ltima caracterstica es la que te servir para decidir si defines una
funcin o un procedimiento. Si necesitas que devuelva algn valor ser
una funcin lo que definas, si no necesitas que devuelva ningn valor,
definirs entonces un procedimiento.
La sintaxis genrica de las funciones es:

variable = funcin([argumentos])
donde variable es la variable que almacenar el resultado de la funcin,
funcin es el nombre de la funcin y argumentos son los datos que
opcionalmente necesita la funcin.
La funcin InputBox.
Esta funcin muestra un cuadro de dilogo modal (ste es un trmino
tcnico para definir un formulario que ha de cerrarse antes de poder
continuar con el desarrollo normal del programa), que contiene un
Ttulo y un Mensaje (definibles), un cuadro de texto y dos botones y
.
Figura 2.1

La sintaxis general de la funcin InputBox es:

variable=InputBox(Prompt[, Title] [, Default] [, XPos] [, YPos] [, HelpFile, Context])
donde:

Prompt es un mensaje o variable de cadena que Vb presenta

dentro del Inputbox.
Title (opcional) es el texto que aparece en la barra de ttulo del
Inputbox. Si se omite Vb coloca el nombre de la aplicacin.
Default (opcional) es el texto que aparecer por omisin en el
cuadro de texto. Si se omite el cuadro aparece en blanco.
XPos e YPos (opcionales) son valores numricos que contienen
en twips la distancia de los bordes izquierdo y superior del
InputBox a los bordes izquierdo y superior de la pantalla
respectivamente. Si se omite el primero, el InputBox se centra
horizontalmente; si se omite el segundo, el InputBox aparece en
el primer tercio de la pantalla aproximadamente.

HelpFile y Context se utilizan conjuntamente cuando la

aplicacin tiene un fichero de ayuda asociado. Si se omiten no
tiene ningn efecto pulsar para recibir ayuda.

El funcionamiento dc InputBox es el siguiente:

Cuando Vb se encuentra con una lnea como esta:
cMiVariable=InputBox("De que tamao quieres el Cuadrado Mgico?", "Generador de
Cuadrados Mgicos",3)
presenta en pantalla un InputBox como el de la figura 2.2 y espera que
el usuario introduzca algn texto en el cuadro de texto y pulse los
botones o , o las teclas o o pulse el botn para cerrar la ventana.
Figura 2.2

NOTA: Estas son todas las posibilidades que tiene el usuario en este
punto. A menudo vers lo conveniente que es, durante el desarrollo
de una aplicacin, analizar todas las posibles acciones que puede
efectuar el usuario en un momento dado, ya que de esta forma
controlas los errores generados por acciones indebidas y evitas las
sorpresas de acciones inesperadas.
Analicemos todas las posibilidades:
Accin Efecto
Pulsar

cMiVariable=""

Pulsar

cMiVariable=""

Pulsar

cMiVariable=valor

Evidentemente las dos primeras devuelven el mismo valor

independientemente de lo que haya en el cuadro de texto, es decir, una
cadena nula; y la ltima devuelve lo que haya en el cuadro de texto, se
haya
modificado
o
no.

El inconveniente que tiene la sencillez de uso de InputBox es su poca

flexibilidad. Slo en contadas ocasiones ser uno solo el dato
necesario, adems de no poder controlar de ningn modo el Textbox ni
sus eventos. No obstante habr ocasiones en que te ser de gran
utilidad.

Los cuadros de texto. Textbox.

A diferencia de los InputBox, dentro de nuestro formulario, s podemos
tener ms de un TextBox, de hecho, ste ser el caso ms comn
dentro de una aplicacin Vb. Otra gran diferencia es que en los
TextBox s podemos controlar mucho de su comportamiento.

Los cuadros de texto con formato. RichTextBox.

Estos cuadros de texto son muy similares a los TextBox, es decir,
podemos tener varios dentro del mismo formulario y podemos controlar
su comportamiento; pero la gran diferencia con los TextBox es que
pueden mostrar texto con varios tipos de fuentes y tamao, adems de
no estar limitados a 32.000 caracteres.
Tanto los TextBox como los RichTextBox los veremos ms en detalle
cuando sea necesario. De momento para nuestra prctica usaremos un
InputBox como el de a figura 2.2.
Con este InputBox permitiremos que el usuario decida el tamao del
CM. Pero existen unas reglas que ha de cumplir, y esto nos servir para
introducir otro concepto importante en la programacin, las estructuras
de control de flujo del programa.

Las Estructuras de Control de Flujo del

Programa.
El control de flujo de un programa es la herramienta principal que
permite que un programa tome decisiones y efecte as una accin u
otra, es decir, sin estas estructuras, el fluir del programa sera
secuencial, de izquierda a derecha y de arriba a abajo, mientras que,
gracias a ellas, el flujo puede cambiar el orden de las instrucciones.
Podemos decir que existen dos tipos de estructuras de control de flujo:

Las estructuras de decisin que son las utilizadas para bifurcar

y

Las estructuras de bucle que son para repetir procesos.

En nuestro caso, la aplicacin debe tomar una decisin dependiendo del

tamao del CM que el usuario elija, por lo que necesitar una
estructura de decisin, pero primero vamos a explicar algunas de las
reglas que deben cumplirse para poder crear un CM.
La primera limitacin que debemos tener en cuenta a la hora de generar
un CM es que su razn slo puede ser impar, es decir, slo puede ser
3x3, 5x5, 11x11, etc. Luego, nuestra aplicacin debe controlar que el
usuario no introduzca un nmero par como razn del CM.
Otra limitacin es ms bien fsica que real, ya que debemos limitar el
tamao del CM para poder mostrarlo en nuestro formulario. En realidad,
los CMs no tienen lmite de tamao, pero, aunque existen mtodos para
mostrar en una ventana un formulario mayor que el tamao de la
ventana, existe tambin la limitacin del tamao de memoria del
ordenador del usuario. De manera que limitaremos el tamao de
nuestro CM a 15x15.
Luego para nuestro InputBox definiremos los siguientes parmetros:

El Mensaje debe ser "De qu tamao quieres el Cuadrado

Mgico?. (Debe ser un nmero impar y menor o igual a 15)"
El Ttulo ser "Generador de Cuadrados Mgicos".
La Variable para almacenar el resultado se llamar cRazonCM

(El resto de los parmetros los dejaremos con sus valores por omisin.)
La lnea de cdigo entonces ser:
cRazonCM=InputBox("De que tamao quieres el Cuadrado Mgico?. (Debe ser un
nmero impar entre 3 y 15 inclusive)", "Generador de Cuadrados Mgicos")
Esto nos genera un InputBox como el de la figura 2.3:
Figura 2.3

A nivel puramente esttico, podemos preferir que el texto del mensaje

que se encuentra entre parntesis empiece en la siguiente lnea. Esto es
posible cambiando la cadena del mensaje de manera que contenga un
cdigo de salto de lnea. Para ello dividimos la cadena en dos trozos,
que corresponden a las dos lneas del mensaje resultante e intercalamos
entre las dos cadenas el cdigo correspondiente al salto de lnea
Chr(13) mediante el operador de concatenacin &. De manera que la
lnea de cdigo queda como sigue:
cRazonCM=InputBox("De que tamao quieres el Cuadrado Mgico?." & Chr(13) &
"(Debe ser un nmero impar entre 3 y 15 inclusive)", "Generador de Cuadrados Mgicos")
Comprubalo tu mismo

Volviendo a nuestra aplicacin, hemos dicho que necesitar una

estructura de decisin, veamos por qu. Supongamos que el usuario
ha decidido generar un CM, luego aparece el InputBox el cual puede
devolvernos distintos valores en la variable cRazonCM que pueden ser:
I.
II.

Una cadena vaca ""

Una cadena no vaca que puede ser:
A.
Una cadena no numrica
B.
Una cadena numrica que puede ser:
1.
Una cadena numrica par
2.
Una cadena numrica impar que puede ser:
i.
Una cadena numrica impar mayor que 15
ii.
Una cadena numrica impar menor o igual a 15 que puede ser:
a.
Una cadena numrica impar menor o igual a 15 y menor que 3
b.
Una cadena numrica impar menor o igual a 15 y mayor o igual
a3

Aunque te parezca un poco exagerado este estudio, cuanto ms

profundices en las posibles respuestas de los usuarios a tus programas,
controlars mejor los posibles errores de programacin que, por otro
lado, he de decirte que siempre surgirn; es utpico pensar que un
programa funcionar perfectamente a la primera, siempre se nos escapa
algo.

De todas las opciones posibles, vemos que la primera de cada subgrupo

no es vlida ya que no cumple con los criterios establecidos para
nuestro CM y la segunda nos lleva a un nuevo subgrupo de
discriminacin hasta llegar a la ltima subopcin que es la nica que
cumple con dicho criterio. Para que nuestra aplicacin decida si el valor
obtenido es vlido vamos a utilizar una estructura de decisin.

Las estructuras de decisin.

Las estructuras de decisin permiten comprobar una condicin y,
dependiendo del resultado, ejecutar una serie de instrucciones. Vb
contiene las siguientes estructuras de decisin:

If..Then
If..Then..Else
Select Case

La estructura de decisin If...Then.

En lenguaje natural equivale a "Si..entonces". Esta estructura tiene dos
posibles sintaxis:

En una sola lnea

If condicin Then instruccin(es)

En un bloque de varias lneas

If condicin Then
instruccin(es)
End If
donde:

condicin = expresin que devuelve un valor booleano: True

(verdadero) o Flase (Falso); o un valor numrico siendo 0 =
False o cualquier otro nmero = True.
instruccion(es) = Accin(es) que se ejecuta(n) si la condicin
devuelve un valor True.

La estructura de decisin If...Then...Else.

En lenguaje natural equivale a "Si...entonces...si no". Su sintaxis es:

If
condicin1
Then
[bloque de instrucciones 1]
[ElseIf condicin2 Then
[bloque de instrucciones 2]]..
[Else
[bloque de instrucciones n]].
End If
donde primero se comprueba la condicin 1; si devuelve True se
ejecuta el bloque de instrucciones 1, en caso contrario, se comprueba la
condicin 2 y as sucesivamente hasta que una condicin devuelve True
o bien, si ninguna de las condiciones lo hace, se ejecuta el bloque de
instrucciones n,
La estructura de decisin Select Case.
En lenguaje natural equivale a "En el caso que...o que". Esta estructura
es muy similar a If...Then...Else. De hecho todo lo que hace Select
Case se puede hacer con If...Then...Else, slo que Select Case
consigue un cdigo ms legible cuando son varias las opciones. Su
sintaxis es:
Select Case expresinPrueba
[Case
listaExpresiones1
[bloque de instrucciones 1]]..
[Case
listaExpresiones2
[bloque de instrucciones 1]]..
.
.
.
[Case
Else
[bloque de instrucciones n]].
End Select
donde:

expresinPrueba = expresin que es evaluada slo una vez y que

puede devolver cualquier valor de cualquier tipo.
listaExpresiones 1 = es una lista de valores con los que se
compara expresinPrueba, si existe una coincidencia entonces se
ejecuta el bloque de instrucciones 1, si no, se pasa a la siguiente
sentencia Case y as sucesivamente. Si existe ms de una
sentencia Case que contiene un valor coincidente slo se ejecuta
el bloque de instrucciones asociado a la primera coincidencia.

bloque de instrucciones n = es el bloque de instrucciones que se

ejecuta en caso de que no se encuentre ninguna coincidencia.

En concreto
If...Then.

para

nuestra

aplicacin

utilizaremos

el

primer

tipo

En lenguaje natural diramos:

Si el tamao del CM es impar y est entre 3 y 15 entonces
genera el CM del tamao definido.
Para traducirlo a Vb debemos aprender a usar alguna de sus funciones.
Como ves, la condicin debe ser: que cRazonCM sea impar y entre 3 y
15. Otra forma de expresarlo sera: que cRazonCM sea impar y que
cRazonCM sea mayor o igual a 3 y que cRazonCM sea menor o igual a
15. Los operadores lgicos mayor o igual que y menor o igual que son
>= y <= respectivamente, y la unin lgica Y es And. Luego la
segunda parte de la condicin quedar ...(cRazonCM >= 3) And
(cRazonCM <= 15)... En este caso, los parntesis estn slo para mayor
claridad, pero no son indispensables. La primera parte de la condicin es
un poco ms complicada.
Como podemos controlar que un nmero sea o no impar? En la vida
real, simplemente lo sabemos si el nmero en cuestin es o no divisible
por 2, pero en el cibermundo no existe una funcin as; en su lugar
tenemos la funcin Mdulo m Mod n que nos devuelve el resto de
dividir m entre n; de manera que para saber si un nmero es impar slo
debemos comprobar que el mdulo de dicho nmero con respecto a 2 es
distinto de 0 que traducido a Vb ser: ...cRazonCM Mod 2 <> 0 (el
operador lgico distinto de en Vb es <>); de manera que la estructura
de control queda:
If (cRazonCM Mod 2 <> 0) And (cRazonCM >= 3 And cRazonCM <= 15) Then
generar
CM
End If
Este fragmento de cdigo debe insertarse justo despus de la lnea
InputBox.
Bien, ya tenemos claro dnde colocar la estructura de control y el
InputBox y es dentro del evento Click del botn ; pero este evento lo
tenemos que modificar un poco. Para ello sigamos el diagrama de flujo
de la figura 2.4:

Figura 2.4- Diagrama de Flujo

Como podemos ver, nuestra aplicacin slo actuar si el dato

introducido es vlido. Pero que lneas debe haber dentro de la
estructura de control If...Then? Evidentemente ya no nos sirven las que
tenamos, pues esas slo generaban un CM de 3x3, y ahora el usuario
puede pedirlo de 7x7, 11x11, etc. Luego vamos a crear un grupo de
lneas para cada tamao? En nuestro caso sera posible, ya que hemos
definido un nmero finito de opciones al usuario, en concreto slo puede
pedirnos 8 CM's distintos (3x3, 5x5, 6x6, 7x7, 9x9, 11x11, 13x13 y
15x15) lo cual representara ocho grupos de lneas diferentes, un poco
de tedioso trabajo nada ms. Pero que pasa si queremos aumentar las
posibilidades de nuestra aplicacin?, que pasa si queremos que nuestro
programa pueda crear CM's de 100x100 o de1000x1000?, la cosa
cambia. Evidentemente sta no es la solucin. Hagamos que las
computadoras
trabajen
por
nosotros!
pero
Como?
Para que esto sea posible, debe existir un mtodo genrico para rellenar
los CM's y as es.
El Mtodo.

Para rellenar un CM debemos

independientemente del tamao:

seguir

las

siguientes

reglas

1. El nmero 1 se coloca SIEMPRE en la columna central de la ltima fila.

2. Los siguientes nmeros se colocan de forma secuencial, es decir, en el orden
natural, a partir del 2 y hasta el ltimo que ser siempre, el resultado de
multiplicar la razn por s misma.

3. Colocamos cada nmero siempre en la fila siguiente y en la siguiente

columna, excepto el caso de la regla 5.
4. Al aplicar la regla 3, si nos encontramos en la ltima fila, entonces la fila 1 es
considerada como la siguiente fila. Del mismo modo, si nos encontramos en la
ltima columna, la columna 1 se considera la siguiente columna.
5. Como excepcin a la regla 3, cuando el ltimo nmero introducido es igual a
la razn o mltiplo de ella, entonces el siguiente nmero se coloca en la
fila anterior y en la misma columna.
6. Para la regla 5, si nos encontramos en la primera fila, la ltima fila
corresponde a la fila anterior.

Y eso es todo. Parece increble verdad?, pero funciona, te lo aseguro. Y

si no lo crees, comprubalo por ti mismo. Y resumiendo, el cdigo del
evento Click del botn debe quedar as:
Private
Dim

Sub
cRazonCM

btnSi_Click()
As

Integer

cRazonCM = InputBox("De que tamao quieres el Cuadrado Mgico?." & Chr(13) &
"(Debe ser un nmero_ impar entre 3 y 15 inclusive)", "Generador de Cuadrados
Mgicos")
If (cRazonCM Mod 2 <> 0) And (cRazonCM >= 3 And cRazonCM <= 15) Then
GeneraCM
End
If
End Sub

El Algoritmo.
Nuestro siguiente paso es convertir todo lo que hemos visto
anteriormente en un Algoritmo, que es como en lenguaje de
programacin se conoce al conjunto de instrucciones que ejecutan
una
tarea
determinada.
A simple vista sabemos que se van a necesitar varias lneas de cdigo,
las cuales, sin problema, podemos colocar dentro de la estructura de
control If...Then, pero vamos a utilizar una de las caractersticas de Vb,
los procedimientos Sub.

Los Procedimientos Sub.

Ms arriba en esta leccin ya hablamos de las funciones y los
procedimientos. Una de las principales razones para crear
procedimientos es el hecho de que un determinado grupo de lneas de

cdigo se repita varias veces en un programa. Cuantas ms veces se

repita, ms importante es el ahorro en lneas de cdigo. Adems, hacen
los programas ms fciles de mantener, ya que si tenemos que efectuar
alguna modificacin a dicho cdigo, slo lo haremos una vez. Otra razn
es la de simplificar los programas en unidades lgicas ms pequeas.
Tambin es importante su capacidad de reutilizacin para otros
programas.
Aunque en nuestra aplicacin el cdigo para generar el CM slo se va a
ejecutar una vez, vamos a crear un procedimiento ms bien, por
razones de aprendizaje y claridad que por necesidad. A nuestro
procedimiento lo llamaremos GeneraCM y para crearlo, lo nico que
tenemos que hacer es, en el editor de cdigo, situarnos al final de
cualquier funcin o procedimiento existente y teclear:
Sub GeneraCM +
y automticamente aparecen las lneas de divisin (si tienes activada
esta opcin) as como el cdigo de fin de procedimiento:
End Sub
y es entre estas dos lneas en las que desarrollaremos el algoritmo.
Si hemos dicho que este procedimiento debe servir para generar
cualquier tamao de CM, entonces, tiene que haber alguna forma de
que el procedimiento se entere del tamao deseado. Para esto sirven los
parmetros.

Los Parmetros.
A diferencia de las funciones, los procedimientos o procedimientos
Sub no se pueden llamar incluyendo su nombre en una expresin. Para
llamar a un procedimiento Sub desde nuestro cdigo existen dos
mtodos diferentes:

Call
Nombre_del_procedimiento
Parmetro2,...Parmetron])]
Nombre_del_procedimiento
Parmetro2,...Parmetron]]

[(Parmetro1[,
[Parmetro1[,

Observa que cuando utilizas el primer formato, los parmetros deben ir

entre parntesis. Pero que son los parmetros? Es la forma en que
nosotros, desde nuestro cdigo, le pasamos datos a las funciones o

procedimientos para que los utilicen. Tambin se les conoce como

argumentos y se pueden pasar de dos formas:

por valor
por referencia

Cuando se pasa un argumento o parmetro por valor lo que se le pasa

al procedimiento en realidad es una copia de la variable y no la variable
en s, de manera que, si el procedimiento modifica la variable, los
cambios slo afectan a la copia de la variable y no a la variable original.
Para pasar un parmetro por valor se utiliza la palabra clave ByVal en la
definicin del procedimiento, por ejemplo:
Sub Nombre_del_procedimiento (ByVal Parmetro as Tipo_de_dato)
Cuando se pasa una parmetro por referencia, que es la forma
predeterminada para Vb, se le pasa al procedimiento el contenido real
de la variable en su ubicacin original. Si el procedimiento modifica el
parmetro, modifica la variable en s. El formato es:
Sub Nombre_del_procedimiento (Parmetro [as Tipo_de_dato])
Luego nuestro procedimiento quedar como sigue:
Sub GeneraCM (pcRazonCM As Integer)
End Sub
Como puedes ver, he aadido una p al nombre del parmetro para
diferenciarlo de la variable en s y lo definimos del tipo Integer
(entero).

El Desarrollo.
Pasemos por fin al meollo del asunto, el desarrollo del algoritmo para
rellenar el CM. Primero vamos a definir qu tipo de dato necesitamos
para almacenar en memoria el CM antes de colocarlo en nuestro
formulario. Evidentemente no es un tipo de dato sencillo, es decir, no es
ni un Nmero ni una Cadena de caracteres, si no, un conjunto de
nmeros organizados en filas y columnas. A este tipo de datos se le
conoce como Matriz y en Vb se identifica con la palabra clave Array.
El tipo de dato Array.

Para declarar una matriz en Vb usamos la palabra clave Dim, a

continuacin el nombre de la matriz seguido, entre parntesis, del lmite
superior. Las matrices en Vb pueden ser unidimensionales y
multidimensionales. El lmite superior de cada dimensin no puede
exceder de un tipo de dato Long (-2.147.483.648 a 2.147.483.647). A
menos que se indique lo contrario el subndice del primer elemento es 0.
As por ejemplo:

Dim Alumnos(45) As String - define una matriz unidimensional

de 46 elementos del tipo String
Dim dias(11) As Integer - define una matriz unidimensional de
12 elementos del tipo Integer
Dim meses(1 To 12) As Integer - define una matriz
unidimensional de 12 elementos del tipo Integer especificando el
lmite inferior igual a 1
Dim CuadradoMgico() As Integer - define una matriz dinmica
del tipo Integer.

Una matriz dinmica es aquella que durante la ejecucin de la

aplicacin, puede cambiar de tamao. Como la declaracin anterior slo
permite constantes como lmites, no podemos definir los lmites de
nuestra matriz en la declaracin, as que usaremos la sentencia Redim
la cual funciona igual que Dim pero que nos permite el uso de variables
para las dimensiones. Luego en nuestro cdigo debe declararse la matriz
como sigue:
Sub

GeneraCM

(pcRazonCM

As

Integer)

CuadradoMagico()
As
Integer
Redim CuadradoMagico(pcRazonCM, pcRazonCM)
End Sub
de esta forma, nuestro procedimiento crear una matriz diferente segn
el tamao elegido por el usuario.
Por que usar una Matriz? La respuesta es bien sencilla. En primer
lugar, es mucho ms cmodo trabajar en memoria al rellenar el CM que
sobre los labels del formulario y, adems, al tratarse de una matriz
cuadrada con filas y columnas, resulta muy fcil a la hora de referirnos a
cada elemento de la matriz como si de una celda de la matriz se tratara,
utilizando las dos dimensiones como equivalentes de la fila y la columna.
Una vez entendido esto, sigamos con el desarrollo del algoritmo.

En primer lugar definamos su principal tarea. En lenguaje coloquial

diremos "Rellenar el CM" y esto consiste ni ms ni menos que en
recorrer todos los nmeros, desde el 1 hasta el resultado de multiplicar
la razn por si misma. (Por ejemplo: si la razn es 7 los nmeros sern
desde el 1 hasta el 49).
Como esto es una tarea repetitiva, existe un tipo de estructura de
control de flujo que ya hemos visto en la primera leccin, conocida como
"Estructura de bucle" Este tipo de estructura es, en gran medida, lo que
hace realmente tiles los programas ya que pueden repetir una tarea
determinada, cientos, miles, incluso millones de veces.
Estas repeticiones (tambin conocidas como iteraciones), pueden
realizarse un nmero finito de veces y entonces los llamamos "bucles
determinados"; tambin pueden repetirse hasta que se cumpla una
determinada
condicin,
a
estos
los
llamamos
"bucles
indeterminados".
En nuestro caso vamos a necesitar.......
Si pensaste en un bucle determinado acertaste. El nmero de
iteraciones de nuestro programa ser finito, (desde 1 hasta 49 en el
ejemplo). La estructura de control del tipo bucle determinado de Vb
es el conocido como bucle For...Next, que ya utilizamos en la primera
leccin. Su diagrama de flujo es el de la figura 2.n y su sintaxis es como
sigue:
For contador = valor_inicial To valor_final [Step incremento|decremento]
grupo
de
instrucciones
que
componen
la
iteracin
Next [contador]
y su explicacin es como sigue:
Figura 2.5

Cuando Vb se encuentra con un bucle For... Next, inicializa la

variable de control, mejor conocida como contador y le asigna el
valor_inicial
Si el valor del contador es menor que el valor_final, entonces
ejecuta el grupo de instrucciones dentro del bucle e incrementa
el contador el valor incremento si existe o en 1 si no existe un
incremento. y vuelve al principio del bucle.
Si el valor del contador es mayor que el valor_final, entonces se
sale del bucle y el programa contina con las lneas de cdigo que
siguientes al final del bucle (lnea Next)

Luego, para nuestro cdigo tomaremos los siguientes valores:

valor_inicial = 1
valor_final = pcRazonCM x pcRazonCM
incremento = 1 (predeterminado)

esto es, el contador empezar con el valor 1, ejecutar las sentencias

del cuerpo del bucle e incrementar el contador en 1 repitiendo el
cuerpo del bucle hasta que el contador sea mayor que el valor_final
pasando en dicho caso a ejecutar las lneas de cdigo a cuntinuacin del
Next.

De manera que en nuestro cdigo quedar:

For n = 1 To pcRazonCM * pcRazonCM
Cuerpo
del
bucle
Next
Como puedes ver, utilizo n como contador, aunque puedes darle
cualquier nombre. Tambin notars que Vb utiliza el asterisco * como
operador de la multiplicacin. Al ser el incremento igual a 1, que es el
valor predeterminado, no necesita especificarse.
Ahora recordemos la primera regla para rellenar un CM:
1. El nmero 1 se coloca SIEMPRE en la columna central de la ltima fila.

Calcular la ltima fila es fcil ya que coincide con el valor de la razn y

calcular la columna central tambin, ya que es igual a la mitad de la
razn ms uno. Pero como esta regla slo debe cumplirse para un
elemento, es decir, slo para el primer elemento, la asignacin de la fila
y columna correspondiente la haremos fuera del bucle, as:
Sub

GeneraCM(pcRazonCM

As

Integer)

Dim
CuadradoMagico()
As
Integer
Dim nFila As Integer, nColumna As Integer, n As Integer
Redim
CuadradoMagico(pcRazonCM,
pcRazonCM)
nFila
nColumna
For n
Cuerpo
Next

=
=

=
pcRazonCM
To

pcRazonCM
del

pcRazonCM
2
+
1

/
*

pcRazonCM
bucle

Como puedes ver, usamos la operacin pcRazonCM / 2 +1 para calcular

la columna central, pero quiz ests pensando que el resultado real
sera un nmero de columna fraccionario, (por ejemplo, para un rango
de 15, sera igual a 8.5), pero como hemos definido el tipo de dato de
nColumna a Integer (entero) Vb se encarga automticamente de
truncar el nmero para convertirlo en entero.
Ahora debemos asignar el nmero n al elemento de la matriz de fila
nFila y columna nColumna. En Vb la sintaxis para asignar valores a
elementos de una matriz es la siguiente:

CuadradoMagico( nFila, nColumna ) = n

as que aadimos esta lnea a nuestro cdigo, como primera lnea del
cuerpo del bucle. En realidad, esta ser la lnea principal ya que es la
que asignar cada elemento a la matriz hasta llenarla.
Seguidamente tenemos que aplicar las dems reglas del mtodo para
rellenar CM's. Iremos rellenando los elementos de la matriz uno a uno,
pasando a la siguiente fila y siguiente columna, excepto que el ltimo
elemento asignado a la matriz sea igual o mltiplo de la razn en cuyo
caso sera en la fila anterior y misma columna. Pero como traducimos
sto a cdigo Vb? Vayamos por partes.
En primer lugar nos encontramos con que debemos comprobar si n es
mltiplo de pcRazonCM; en caso afirmativo ejecutar una accin y, en
caso contrario, ejecutar otra distinta. Para esto utilizamos la estructura
de decisin If...Then...Else. Para saber si n es mltiplo de pcRazonCM
usamos de nuevo la funcin Mod (mdulo).
If
n
Mod
pcRazonCM
=
0
Then
'Acciones a ejecutar si n es mltiplo de pcRazonCM
Else
'Acciones a ejecutar si n NO es mltiplo de pcRazonCM
End If
Como ves, las lneas en color verde van precedidas de un apstrofe '
que es uno de los mtodos que usa Vb para aadir comentarios al
cdigo. Es muy importante comentar el cdigo, ya que te ser de gran
ayuda si tienes que depurarlo o, sobre todo, cuando tengas que
mantenerlo o bien, que el mantenimiento lo vaya a realizar otra
persona, por ejemplo, de tu grupo de programacin.
Ahora, dentro de las acciones a ejecutar si n es mltiplo de pcRazonCM,
el mtodo de relleno de CM's nos dice que el siguiente elemento debe
colocarse en la fila anterior y en la misma columna, pero si la fila es
igual a 1 entonces la fila debe ser igual a la razn. Luego nos
encontramos con otra toma de decisin que se traduce en una
estructura de control If...Then...Else dentro de la primera, lo que se
conoce con estructuras anidadas. Y el cdigo es el siguiente:
If
n
Mod
pcRazonCM
=
0
Then
'Acciones a ejecutar si n es mltiplo de pcRazonCM
If
nFila
=
1
Then
nFila
=
pcRazonCM

Else
nFila
=
nFila
1
End
if
Else
'Acciones a ejecutar si n NO es mltiplo de pcRazonCM
End If
Observa como indentamos (colocamos un poco ms a la derecha) las
lneas que pertenecen a una estructura; esto no es obligatorio, pero nos
ayuda a ver con mucho ms claridad el cdigo.
Por ltimo, para las acciones a ejecutar si n NO es mltiplo de
pcRazonCM, tenemos que el mtodo nos dice que tanto la fila como la
columna del siguiente elemento debe ser la siguiente pero que tanto si
la fila como la columna son la ltima, entonces deben ser la primera.
Y con esto concluye la Leccin II.

Ejercicio de control.
Como ejercicio de comprobacin de esta leccin debers hacer lo
siguiente:
1. Escribe el cdigo para las acciones a ejecutar si n NO es mltiplo de
2.

3.

pcRazonCM, de manera que cumpla con el mtodo de relleno de CM's.

Comprueba las lneas de cdigo escritas hasta ahora, aunque el programa
funciona, existe un error que probablemente ya has detectado. Si no es as,
trata de encontrarlo y una vez que lo encuentres, documntalo y propn la
solucin.
Una vez terminado y comprobado el cdigo, guarda los cambios y
posteriormente envame por e-mail tu proyecto y la respuesta al nmero 2. Si
no sabes como hacerlo pulsa aqu para las instrucciones detalladas.

Si consideras que ya ests preparado, puedes acceder al examen de la

Leccin II