You are on page 1of 43

Captulo 5 Windows Forms

Uno de los principales objetivos de la educacin debe ser ampliar las ventanas por las cuales vemos al mundo La caridad es un deber; la eleccin de la forma, un derecho.

Tabla de Contenido
Windows Forms .......................................................................................................................5.2 Creacin de Proyectos .............................................................................................................5.4 El espacio de nombres System.Windows.Forms......................................................................5.6 Insertando controles dentro de la forma ...................................................................................5.7 Insercin de Cdigo ...............................................................................................................5.10 Caja de Mensajes (MessageBox)...........................................................................................5.16 Caja de Seleccin ..................................................................................................................5.23 Visor de Imgenes y Enlaces .................................................................................................5.26 Web Browser y Creacin de Mens .......................................................................................5.30 Formas que llaman a otras formas .........................................................................................5.33 Creacin de Propiedades en una Clase .............................................................................5.36 Matrices en dataGridView...................................................................................................5.38 Creacin de Mens ............................................................................................................5.40

5.1

Captulo 5: Windows Forms

Windows Forms
Windows Forms es una de las dos tecnologas que se utiliza en Visual C# para crear aplicaciones cliente inteligentes basadas en Windows que se ejecutan en .NET Framework. Windows Forms es especialmente adecuado para escenarios de desarrollo rpido de aplicaciones donde la prioridad principal no es una interfaz grfica de usuario compleja. El Diseador de Windows Forms se utiliza para crear la interfaz de usuario, y permite obtener acceso a otras caractersticas de diseo y ejecucin, tales como las siguientes: Implementacin ClickOnce. Uso avanzado de bases de datos mediante DataGridView (Control, formularios Windows Forms). Barras de herramientas y otros elementos de interfaz de usuario que pueden tener el aspecto y el comportamiento de Microsoft Windows XP, Microsoft Office o Microsoft Internet Explorer. En Visual C#, podemos utilizar el Diseador de Windows Forms o el Diseador de Windows Presentation Foundation (WPF) para crear interfaces de usuario de forma rpida y cmoda. Los tres pasos bsicos para crear interfaces de usuario son: 1. Agregar los controles a la superficie de diseo. 2. Establecer las propiedades iniciales de los controles. 3. Escribir los controladores para los eventos especificados.

Agregar controles En cualquiera de los diseadores se utiliza el mouse para arrastrar controles, que son los componentes con representacin visual, como botones y cuadros de texto, hasta una superficie de diseo A medida que se trabaja visualmente, el Diseador de Windows Forms traduce las acciones en cdigo fuente de C# y las escribe en un archivo de proyecto llamado nombre.designer.cs donde nombre es el nombre asignado al formulario. De igual forma, WPF Designer traduce las acciones de la superficie de diseo a cdigo de lenguaje de marcado de aplicaciones extensible (XAML) y lo escribe en un archivo de proyecto que se denomina Window.xaml. Cuando se ejecuta la aplicacin, ese cdigo fuente (Windows Forms) o cdigo XAML (WPF) ajustar la posicin y el tamao de los elementos de la interfaz de usuario de modo que aparezcan como en la superficie de diseo. Establecer propiedades Despus de agregar un control a la superficie de diseo, podemos utilizar la ventana Propiedades para establecer sus propiedades, como son el color de fondo y el texto predeterminado.
5.2 Captulo 5: Windows Forms

En el Diseador de Windows Forms, los valores que especifique en la ventana Propiedades son los valores iniciales que se asignarn a la propiedad cuando se cree el control en tiempo de ejecucin. En el Diseador de WPF, los valores que especifique en la ventana Propiedades se almacenan como atributos en el archivo XAML de la ventana. En muchos casos, se puede tener acceso a estos valores o modificarlos mediante programacin en tiempo de ejecucin; para ello, basta con obtener o establecer desde la aplicacin la propiedad para la instancia de la clase del control. La ventana Propiedades resulta til en tiempo de diseo porque permite examinar todas las propiedades, eventos y mtodos que admite un control. Controlar eventos Los programas con interfaces de usuario grficas son principalmente controlados por eventos. Estos programas esperan a que un usuario haga algo, como escribir texto en un cuadro de texto, hacer clic en un botn o cambiar la seleccin de un cuadro de lista. Cuando esto sucede, el control, que es simplemente una instancia de una clase de .NET Framework, enva un evento a la aplicacin. Tiene la opcin de controlar un evento escribiendo un mtodo especial en la aplicacin al que se llamar cuando se reciba el evento. Podemos utilizar la ventana Propiedades para especificar qu eventos desea tratar en el cdigo. Si seleccionamos un control en el diseador y hacemos clic con el icono Rayo en el botn Eventos de la barra de herramientas de la ventana Propiedades para ver los eventos del control. El icono siguiente muestra el botn de eventos. Al agregar un controlador de evento desde la ventana Propiedades, el diseador escribe automticamente el cuerpo del mtodo vaco. Debemos escribir el cdigo de manera que el mtodo haga algo til. La mayora de los controles generan muchos eventos, pero normalmente una aplicacin slo tendr que tratar algunos de ellos o incluso slo uno.

5.3

Captulo 5: Windows Forms

Creacin de Proyectos
Para abrir Visual C# Express Edition 2008 ejecutamos el programa directamente o con los acceso directos.

5.4

Captulo 5: Windows Forms

Automticamente nos aparece la siguiente pantalla:

El entorno de desarrollo de Visual C# podr ser diferente al mostrado en la pantalla superior para modificar el entorno nos podemos ir al men Ver y agregamos los elementos que necesitemos, por ejemplo uno elementos imprescindible es el Cuadro de Herramientas, podemos seleccionar para visualizarlo como se muestra en la pantalla de la izquierda o tambin dar clic en el botn de la barra de herramientas o con las teclas de acceso rpido que serian Ctrl+W, X.

En el cuadro de herramientas tenemos tres opciones desde cerrar para desaparecer el cuadro, ocultar automticamente o colocarla flotante, acoplable, etc.

5.5

Captulo 5: Windows Forms

El espacio de nombres System.Windows.Forms


El espacio de nombres (namespace) System.Windows.Forms contiene clases para crear aplicaciones basadas en ventanas que toman ventaja completa de las caractersticas de una interfaz de usuario disponibles en el sistema operativo Windows de Microsoft. La siguiente tabla muestra las clases en este espacio de nombres agrupadas en categoras. Categora de la clase Detalles La mayora de las clases dentro de este espacio de nombres derivan de la clase Control. La clase Control provee la funcionalidad bsica para todos los controles Control, Control de que se despliegan en una forma. La clase Form representa usuario y Forma una ventana en una aplicacin. Esta incluye cajas de dialogo, ventanas modales e Interfaces de Mltiple Documento. Tambin se pueden crear controles propios de usuario derivndolos de la clase UserControl. Las Formas contienen un conjunto muy rico de clases para crear sus propias barras de herramientas y mens con apariencia moderna y comportamiento. ToolStrip, Mens y Toolbars MenuStrip, ContextMenuStrip y StatusStrip se pueden usar para crear barras de herramientas, barras de men, mens de contexto y barras de status respectivamente. Este espacio de nombres provee una variedad de clases control que se pueden usar para crear interfaces de Controles usuario como TextBox, ComboBox, Label, ListView, Button, WebBrowser, HtmlDocument, MaskedTextBox y PropertyGrid. Algunas clases ayudad a controlar la distribucin de una Layout superficie de despliegue como: FlowLayoutPanel, TableLayoutPanel y SplitContainer. Las formas Windows definen una arquitectura ideal para ligarlas a fuentes de datos tales como bases de datos y Data y Data Binding archivos XML, estos controles son: DataGridView, BindingNavigator, BindingSource Adems de controles este espacio de nombres provee otras clases que no derivan de la clase Control pero que proveen caractersticas visuales a una aplicacin Componentes Windows. Tales clases como ToolTip y ErrorProvider proveen informacin al usuario as tambin las clases Help y HelpProvider. Windows provee cajas de dialogo con propsitos especiales como son OpenFileDialog, SaveFileDialog, FontDialog, Cajas de Dilogos PageSetupDialog, PrintPreviewDialog y PrintDialog. Este comunes espacio de nombres provee la clase MessageBox para desplegar una caja de mensaje que puede desplegar y obtener datos del usuario. Las Formas contienen un conjunto muy rico de clases para Mens y Toolbars crear sus propias barras de herramientas y mens con apariencia moderna y comportamiento. ToolStrip,
5.6 Captulo 5: Windows Forms

MenuStrip, ContextMenuStrip y StatusStrip se pueden usar para crear barras de herramientas, barras de men, mens de contexto y barras de status respectivamente. Hay algunas clases dentro de System.Windows.Forms que proveen soporte a las clases mencionadas arriba. Ejemplos son: enumeraciones, clases argumento evento y delegados usados por eventos dentro de controles y componentes.

Insertando controles dentro de la forma


Una ventana muy til es la ventana de propiedades si no la tenemos disponible nos vamos al men Ver Ventana Propiedades esta nos muestra la propiedad de cualquier control, por ejemplo un botn, cuadro de texto, etiqueta. Vamos a modificar las propiedades de la forma Form1 en primer lugar la seleccionamos y nos vamos a la ventana de propiedades, aqu vemos en la parte superior el recuadro con el siguiente texto: Form1 System.Windows.Forms.Form al final contiene una flecha hacia abajo en ella podemos seleccionar los diferente elementos y modificar sus propiedades, en este momento no tenemos ningn otro elemento solo la forma. Seleccionamos la forma, haciendo clic sobre ella en la ventana Propiedades es posible modificar las propiedades de la misma vamos a modificar el titulo de la ventana que por default es Form1 a Multiplica para ello nos vamos a Apariencia Text y escribimos Multiplica como se muestra en la siguiente pantalla.

5.7

Captulo 5: Windows Forms

Algunas propiedades tienen un botn a la izquierda con un signo + lo cual indica que estas propiedades se componen de varias partes, por ejemplo en Font aparece el smbolo de mas porque es posible cambiar el tipo de letra.

Podemos expandir en el cuadro de herramientas que necesitemos, por ejemplo si expandimos la opcin de Controles comunes dando clic en el smbolo de ms. Las componentes estn acomodadas por funcionalidad y en forma alfabtica. Si deseamos insertar algn control a la forma simplemente lo seleccionamos y lo arrastramos en el interior de la forma en la posicin que queramos, posteriormente podemos mover el control dentro de la forma, cambiar las propiedades, posicin tamao, nombre, color, etc. Vamos a insertar en la forma dos etiquetas . El objetivo de las etiquetas es proveer de los elementos necesarios para ingresar dos nmeros y efectuar la multiplicacin mostrando el resultado. , tres cajas de texto y un botn

Por default Visual C# asigna los nombres a las etiquetas como label1, label2, button1, textBox1, etc. Desde la ventana propiedades podemos modificar el nombre y las caractersticas de la ventana. En la imagen siguiente se muestra el procedimiento a seguir para cambiar las propiedades de cualquier elemento, en particular, la imagen se refiere al cambio de propiedades del control button1. Otra forma de ver las propiedades es seleccionar cualquier control damos clic con el botn derecho en la opcin Propiedades y automticamente nos muestra las propiedades de dicho control, esto se ilustra en la siguiente figura:

5.8

Captulo 5: Windows Forms

Las figuras siguientes muestran ambas formas antes y despus de ser modificadas.

5.9

Captulo 5: Windows Forms

Insercin de Cdigo
Antes de describir como insertar cdigo en nuestra aplicacin es muy importante identificar el nombre de cada uno de los controles, en la imagen se identifican cada uno de ellos, dichos nombres los asigna automticamente Visual C# al insertar cada control, es posible cambiar el nombre de cada uno de ellos, al seleccionarlo y en la ventana de Propiedades, apartado Diseo campo (Name) modificar el nombre , en nuestro ejemplo vamos a dejar intactos cada nombre de los controles utilizados esto facilita la programacin de nuestra aplicacin pues es ms fcil identificar los elementos. Un error comn es confundir esta propiedad con Text en el apartado Apariencia cambiamos button1 por Multiplicar, esto debido a que inicialmente Visual C# asigna el mismo nombre en ambas propiedades, pero uno es como se observa en la ventana dentro de la forma y la propiedad (Name) en Diseo es como lo identifica Visual C# al momento de programar.
5.10 Captulo 5: Windows Forms

Para insertar cdigo es importante identificar la utilidad de cada control insertado como se describe en la siguiente tabla.

Control (Diseo) label1 textBox1 label2 textBox2 button1 textBox3

Control (Apariencia) Operador 1 ---------Operador 2 ---------Multiplicar ----------

Objetivo Mostrar un texto que ayude al usuario a identificar que dato debemos introducir. Recibir un nmero . Mostrar un texto que ayude al usuario a identificar que dato debemos introducir. Recibir otro nmero. Dar clic en el botn para realizar la multiplicacin de los datos introducidos en textBox1 y textBox2 Mostrar el resultado de la multiplicacin.

En la columna Control (Apariencia) aparece ---------- significa que no aplica, es decir no se modific la propiedad. Si analizamos nuestros elementos, el control que efectuar la Multiplicacin es button1 por lo tanto para insertar cdigo damos doble clic sobre l y nos trasladara de Form1.cs (Diseo) que digamos es la parte grfica a la ventana Form1.cs que bsicamente sera el cdigo de nuestra aplicacin.

El cdigo que se inserta aparece encerrado en el rectngulo, vemos que el mtodo se llama button1_Click que nos indica que realizar cuando demos doble clic sobre el botn.

Veamos que realiza cada lnea.

5.11

Captulo 5: Windows Forms

En la lnea 51 double ct1, ct2; declaramos dos variable de tipo doubl esto llamadas ct1 y ct2 para hacer referencia a cuadro de texto 1 y 2, el tipo es para que podamos multiplicar cualquier tipo de nmero y no solo enteros. ct1 = Convert.ToDouble(textBox1.Text); lnea 53 extrae la entrada del usuario de textBox1 y lo convierte a doble esto debido a que por default la entradas las maneja como cadena y el valor se lo asignamos a ct1.En la lnea 54 es similar pero para el cuadro de texto dos. En textBox3 es donde mostramos el resultado de la multiplicacin, para dar formato escribimos {0:F2} el cero significa que es el primer argumento, la letra F que vamos a imprimir un valor de tipo doble y el nmero 2 permite imprimir el resultado con dos decimales. Y multiplicamos los valores ct1*ct2 que es el resultado que aparecer en textBox3. En la lnea 56 String.Format La clase String dispone del mtodo Format que nos permite formatear una expresin. Podemos copiar el cdigo aqu:

Multiplica.cs
// cdigo que debemos insertar en el mtodo button1_Click private void button1_Click(object sender, EventArgs e) { double ct1, ct2; // extrae la entrada del usuario ct1 = Convert.ToDouble(textBox1.Text); ct2 = Convert.ToDouble(textBox2.Text); // muestra el resultado textBox3.Text =String.Format("{0:F2}", ct1*ct2); }

Para ejecutar el programa presionamos la tecla F5 o en el men Depurar damos clic en Iniciar depuracin.

5.12

Captulo 5: Windows Forms

Una tercera opcin es dar clic en el botn

que aparece en la barra de herramientas.

La pantalla muestra un ejemplo de la ejecucin del programa. Observamos que efectivamente el resultado lo muestra con dos decimales.

Un cdigo ms elaborado que mostrara exactamente el mismo funcionamiento de nuestra aplicacin sera: Multiplica.cs
// cdigo que debemos insertar en el mtodo button1_Click private void button1_Click(object sender, EventArgs e) { double ct1, ct2, m; string r; // extrae la entrada del usuario ct1 = Convert.ToDouble(textBox1.Text); ct2 = Convert.ToDouble(textBox2.Text); m = ct1 * ct2; r = (String.Format("{0:F2}", m)); textBox3.Text = r;// muestra el resultado }

5.13

Captulo 5: Windows Forms

Insertamos la variable string r y le asignamos el resultado antes de asignarla a textBox3.Text, tambin declaramos otra variable de tipo doubl llamada m, este cdigo tiene ms lneas que el anterior, pero podra ser ms claro. Vamos a insertar dos controles de tipo botn, el primero para limpiar los campos y el otro para salir de la aplicacin como se muestra en la siguiente figura:

Mostramos el cdigo sombreado en color amarillo, para el botn 2, que nos sirve para limpiar los campos de las tres cajas de texto, despus de realizar un clculo podemos limpiar el campo con este botn.

private void button2_Click(object sender, EventArgs e) { textBox1.Text = ""; textBox2.Text = ""; textBox3.Text = ""; }

5.14

Captulo 5: Windows Forms

Para salir de la aplicacin simplemente escribimos Close();, veamos el cdigo insertado: private void button3_Click(object sender, EventArgs e) { Close(); }

Veamos ahora un segundo ejercicio, crearemos un convertidor de temperaturas de grados Centgrados a grados Fahrenheit, y viceversa, el usuario tiene la opcin de elegir en qu sentido desea realizar la conversin, la siguiente figura muestra los controles insertados en la forma. Ejemplo de la ejecucin: Del lado izquierdo convierte de C a F y del lado derecho convierte de F a C

El cdigo insertado para convertir de C a F es: private void button1_Click(object sender, EventArgs e) { double gfarenheit, ct1; ct1 = Convert.ToDouble(textBox1.Text); gfarenheit = ct1 * 1.8 + 32.0; textBox2.Text = String.Format("{0:F3}", gfarenheit); } El cdigo insertado para convertir de F a C es:

5.15

Captulo 5: Windows Forms

private void button2_Click(object sender, EventArgs e) { double gcentigrados, ct1; ct1 = Convert.ToDouble(textBox1.Text); gcentigrados = (ct1 - 32.0)/1.8; textBox2.Text = String.Format("{0:F3}", gcentigrados); } El cdigo para los botones de Limpiar y Salir, son identicos al del ejemplo Multiplica.

Caja de Mensajes (MessageBox) Vamos a estudiar el mtodo Show de la clase MessageBox. Dicho mtodo es polimorfo y puede mandarse llamar de 21 diferente maneras. La que veremos aqu tiene la forma:

DialogResult MessageBox.Show(string text, string caption, MessageBoxButtons buttons, MessageBoxIcon icon);

La primera cadena (text), se despliega como mensaje en una caja de dialogo. La segunda cadena (caption), se despliega como ttulo de la caja de dialogo o ventana
buttons es un elemento de la enumeracin MessageBoxButtons que puede tomar uno de seis diferentes valores y que dependiendo de ello mostrar 1, 2 o 3 botones en la caja de dialogo: OK OKCancel YesNo YesNoCancel RetryCancel AbortRetryIgnore icon es un elemento de la enumeracin MessageBoxIcon que puede tomar uno de cuatro diferentes valores y que dependiendo de ello mostrar el icono correspondiente: Information Exclamation Question Error

5.16

Captulo 5: Windows Forms

Este mtodo Show de MessageBox siempre nos regresar un resultado del tipo DialogResult y ste depender del botn que oprimamos al cerrar el dialogo de Mensaje. DialogResult es una enumeracin que tiene los siguientes valores: DialogResult.OK DialogResult.Cancel DialogResult.Yes DialogResult.No DialogResult.Ignore DialogResult.Abort DialogResult.Retry

Crearemos un nuevo proyecto al que llamaremos MessageBoxes. En la forma Form1 generada, depositaremos:

2 Etiquetas (Label) 2 Cajas de agrupamiento (GroupBox) 1 Botn (Button) 10 Botones de radio (RadioButton)

Nuestra forma quedara de la siguiente manera:

5.17

Captulo 5: Windows Forms

Cambiemos las propiedades segn se muestra en la siguiente tabla, la propiedad Name de cada elemento no se cambia: Componente Form1 label1 label2 button1 groupBox1 groupBox2 radioButton1 radioButton2 radioButton3 radioButton4 radioButton5 radioButton6 radioButton7 radioButton8 radioButton9 radioButton10 Propiedad Text Text Name Text Text Text Text Text Checked Text Text Text Text Text Text Checked Text Text Text Valor Ejemplos MessageBox Elige el MessageBox para visualizarlo label2 == nada == Visualizar Tipo de botn Tipo de icono OK True OK Cancel Yes No Yes No Cancel Retry Cancel Abort Retry Cancel Information True Exclamation Question Error

De tal manera que nuestra forma quedara as:

5.18

Captulo 5: Windows Forms

Ahora programemos el evento para que se genere un cambio en la seccin Tipo de Botn del lado izquierdo, teniendo seleccionado el radioButton1 con etiqueta OK, hagamos clic en el botn que tiene un rayo en la ventana de propiedades (para seleccionar eventos) y seleccionemos CheckedChange, a la derecha escribamos como nombre para el mtodo que se va a ejecutar cuando este evento se lleve a cabo, tipoDeBoton_CheckedChange, hagamos lo mismo para los otros cinco radioButtons restantes seleccionando siempre el mismo mtodo.

Lo que sigue es agregar una variable privada a la clase y lo hacemos antes del constructor: private MessageBoxButtons tipoDeBoton = MessageBoxButtons.OK;
5.19 Captulo 5: Windows Forms

Luego insertemos el siguiente cdigo para el mtodo tipoDeBoton_CheckedChanged private void tipoDeBoton_CheckedChanged(object sender, EventArgs e) { if (sender == radioButton1) tipoDeBoton = MessageBoxButtons.OK; else if (sender == radioButton2) tipoDeBoton = MessageBoxButtons.OKCancel; else if (sender == radioButton3) tipoDeBoton = MessageBoxButtons.YesNo; else if (sender == radioButton4) tipoDeBoton = MessageBoxButtons.YesNoCancel; else if (sender == radioButton5) tipoDeBoton = MessageBoxButtons.RetryCancel; else tipoDeBoton = MessageBoxButtons.AbortRetryIgnore;

En el cdigo anterior se investiga cual de los radioButtons (mediante sender) cambi su estatus de desactivado a activado y se pone la variable tipoDeBoton con uno de los 6 posibles valores que tiene la enumeracin MessageBoxButtons. Ahora programemos el evento de que se genere un cambio en la seleccin de los botones de la derecha es decir en Tipo de Icono, teniendo seleccionado el radioButton7 con etiqueta Information, hagamos clic en el botn que tiene un rayo en la ventana de propiedades (para seleccionar eventos) y seleccionemos CheckedChange, a la derecha escribamos como nombre para el mtodo que se va a ejecutar cuando este evento se lleve a cabo, tipoDeIcono_CheckedChanged, hagamos lo mismo para los tres radioButtons restantes seleccionando siempre el mismo mtodo.

5.20

Captulo 5: Windows Forms

Lo que sigue es agregar una variable privada a la clase y lo hacemos tambin antes del constructor: private MessageBoxIcon tipoDeIcono = MessageBoxIcon.Error; Luego insertemos el siguiente cdigo para el mtodo tipoDeIcono_CheckedChanged private void tipoDeIcono_CheckedChanged(object sender, EventArgs e) { if (sender == radioButton7) // display error icon tipoDeIcono = MessageBoxIcon.Information; else if (sender == radioButton8) tipoDeIcono = MessageBoxIcon.Exclamation; else if (sender == radioButton9) tipoDeIcono = MessageBoxIcon.Question; else // only one option left--display question mark tipoDeIcono = MessageBoxIcon.Error; } Como en el primer mtodo, se investiga cual de los radioButtons (mediante sender) cambi su estatus de desactivado a activado y se pone la variable tipoDeIcono con uno de los cuatro posibles valores que tiene la enumeracin MessageBoxIcon. Por ltimo queremos programar el botn Mostrar para que al hacer clic sobre l se ejecute el mtodo button1_Click desplegando el MessageBox configurado con el valor que en su momento tengan las variables tipoDeBoton y tipoDeIcono. private void button1_Click(object sender, EventArgs e) { DialogResult result = MessageBox.Show("Mensaje a desplegar", "Ttulo de la Ventana",
5.21 Captulo 5: Windows Forms

tipoDeBoton, tipoDeIcono); switch { case case case case case case case } } El cdigo fuente completo de nuestro proyecto puede consultarse en el apndice 5: Caja de Mensajes -- Form1.cs A continuacin dos ejecuciones de nuestro programa: (result) DialogResult.OK: label2.Text = "Seleccion OK."; break; DialogResult.Cancel: label2.Text = "Seleccion Cancel."; break; DialogResult.Yes: label2.Text = "Seleccion Yes."; break; DialogResult.No: label2.Text = "Seleccion No."; break; DialogResult.Ignore: label2.Text = "Seleccion Ignore."; break; DialogResult.Abort: label2.Text = "Seleccion Abort."; break; DialogResult.Retry: label2.Text = "Seleccion Retry."; break;

5.22

Captulo 5: Windows Forms

Caja de Seleccin
Ahora crearemos un nuevo proyecto C# del tipo de Aplicacin de Windows Forms, al que llamaremos CajadeSeleccion. A la forma principal Form1 agreguemos los siguientes controles: 4 Etiquetas (Label) 12 Cajas de seleccin (CheckBox) 2 Botones (Button)

En la etiqueta uno escribimos el texto UACM POO en C#, las otras tres etiquetas las utilizaremos para colocar los ttulos Estilo, Fuente, Tamao, las doce cajas de seleccin nos ayudaran a modificar el texto de la etiqueta uno en cuanto al tipo de letra, tamao y estilo, el botn Salir cierra la aplicacin y el botn Limpiar, regresa al texto original sin aplicar ningn formato. En la siguiente figura observamos como quedara el diseo de la forma:

A continuacin, a los eventos CheckedChanged de cada una de las cajas de seleccin agreguemos un mtodo pulsando con el mouse a la derecha del evento que queremos programar.

5.23

Captulo 5: Windows Forms

Este sera el cdigo del mtodo para cambiar el texto de la etiqueta uno a negrita: private void Negrita_CheckedChanged(object sender, EventArgs e) { this.label1.Font = new Font(this.label1.Font.FontFamily, this.label1.Font.Size, this.label1.Font.Style ^ FontStyle.Bold); } Repetimos el mismo paso para crear otros tres mtodos para cambiar al estilo itlica, tachado o subrayado, lo que harn estos mtodos es cambiar la fuente de la etiqueta label1 para que el estilo cambie a Bold o Italic o Strikeout o Underline El principio que estamos usando aqu es el hecho de que para crear una Fuente hay que hacerlo de la siguiente manera new Font(FontFamily family, float emSize, FontStyle style); donde FontFamily es una familia de fuentes como por ejemplo Arial o Consolas y FontStyle puede ser Bold, Italic, Strikeout, Underline o la combinacin de ellos, el tamao se pude especificar con un nmero por ejemplo 10, 12, 20. Para cambiar el tipo de fuente de la etiqueta nuevamente al evento CheckedChanged de cada una de las cuatro cajas de seleccin agreguemos un mtodo pulsando con el mouse a la derecha del evento que queremos y escribimos el siguiente cdigo: private void Consolas_CheckedChanged(object sender, EventArgs e) { FontFamily csl = new FontFamily("Consolas"); this.label1.Font = new Font(csl, this.label1.Font.Size, this.label1.Font.Style); }
5.24 Captulo 5: Windows Forms

csl es el nuevo tipo de fuente que creamos puede llamarse como queramos respetando la reglas de identificadores vlidos, entre comillas en color rojo aparece "Consolas" aqu debemos seleccionar un tipo de fuente vlido podemos ver la ventana de propiedades cuando cambiamos la fuente los tipos disponibles o tambin en el procesador de texto Word de Office los tipos de fuentes, realizamos lo mismo para los otros tres tipos de fuentes. Finalmente en la ltima columna con las cuatro cajas de seleccin cambiamos el tamao del texto de la etiqueta uno con un procedimiento similar a los dos anteriores primero configurando el evento y despus escribiendo en el mtodo lo siguiente: private void Ocho_CheckedChanged(object sender, EventArgs e) { this.label1.Font = new Font(this.label1.Font.FontFamily, 8, this.label1.Font.Style); }

Observemos que nuevamente aqu de los tres parmetros o argumentos solo modificamos el tamao. En cuanto a los botones el botn salir solo agregamos el cdigo: Close(); private void button1_Click(object sender, EventArgs e) { Close(); } El botn limpiar regresa el texto de la etiqueta uno al formato original, por ejemplo si cambiamos el tipo de letra a Broadway, Tachado y tamao 20, al darle limpiar simplemente regresamos al texto con el formato original para saber cul era el formato original seleccionamos la etiqueta uno y en propiedades vemos el tipo de letra y tamao utilizado. private void button2_Click(object sender, EventArgs e) { FontFamily mss = new FontFamily("Microsoft Sans Serif"); this.label1.Font = new Font(mss, 12, FontStyle.Regular); } Si observamos aqu para cambiar el estilo del texto utilizamos simplemente FontStyle.Regular, por otro lado en las cajas de seleccin escribimos this.label1.Font.Style ^ FontStyle.Bold, esto se debe a que si utilizamos la forma ms simple es decir FontStyle.Bold, solo lo efectuara una vez y despus ya no lo cambiara debido a que no especificamos a que control deseamos aplicar el cambio.

5.25

Captulo 5: Windows Forms

El cdigo fuente completo de nuestro proyecto puede consultarse en el apndice 5: Cajade Seleccin -- Form1.cs Un ejemplo de la ejecucin del programa sera el siguiente:

Visor de Imgenes y Enlaces


Este proyecto abarca dos secciones, en la primera se trata de un visor de imgenes, es una aplicacin muy simple que lee archivos grficos, el botn Elegir Imagen en combinacin con el control openFileDialog nos permite seleccionar la ubicacin de nuestra imagen, una vez seleccionada la imagen se mostrara en el recuadro pictureBox1. La segunda parte son los enlaces a tres elementos el primero abre la calculadora de Windows, la segunda abre una liga a la pgina de la Universidad, por ltimo abre el Explorador de Windows en el disco local C:\, esto se logra mediante los controles linkLabel. La siguiente figura muestra los controles necesarios para elaborar nuestro proyecto

5.26

Captulo 5: Windows Forms

Noten que el control openFileDialog1 no aparece dentro de la forma si no en la parte inferior de nuestro proyecto., Los controles necesarios para llevar a cabo el proyecto son: 1 Caja de Imagen (pictureBox) 1 Caja de dialogo para abrir un archivo (openFileDialog) 2 Botones (Button) 3 Etiquetas de Enlace (linkLabel)

Al botn 1 que dice Elegir Imagen al darle doble clic nos traslada al cdigo e insertamos lo siguiente: private void button1_Click(object sender, EventArgs e) { if (openFileDialog1.ShowDialog() == DialogResult.OK) { // Carga la imagen dentro del cuadro picture box. pictureBox1.Image= Image.FromFile(openFileDialog1.FileName); // Muestra el nombre del archivo en el titulo de forma
5.27 Captulo 5: Windows Forms

this.Text = string.Concat("Visor de Imagenes(" + openFileDialog1.FileName + ")"); } } Un ejemplo de la ejecucin del proyecto con esta primera parte del Visor de Imgenes:

En la segunda parte del proyecto se refiere a los Enlaces, usamos el control linkLabel el cual tiene la peculiaridad de poseer una liga (como las pginas Web) a directorios de nuestro sistema de archivos, a direcciones electrnicas de sitios Web o FTP y tambin a aplicaciones que se encuentren en el Registro de Windows. Ya tenemos agregados los tres linkLabel, ahora necesitamos la programacin de los eventos de hacer click en el control, en los tres eventos utilizaremos la llamada del mtodo:
System.Diagnostics.Process.Start(parametros);

En donde los parametros pueden ser: o o Una cadena de caracteres con el nombre de un directorio ejemplo. "C:\\Documents and Settings\\users\\avalera" Una cadena de caracteres con el nombre de un programa Navegador de Internet y una segunda cadena con una direccin electrnica ejemplo. "http://google.com" que se quiere visitar

5.28

Captulo 5: Windows Forms

Una cadena de caracteres con el nombre de un programa que se quiere mandar ejecutar

En cada una de las etiquetas de enlace insertamos el siguiente cdigo: private void linkLabel1_LinkClicked(object sender, LinkLabelLinkClickedEventArgs e) { linkLabel1.LinkVisited = true; System.Diagnostics.Process.Start("Calc"); } private void linkLabel2_LinkClicked(object sender, LinkLabelLinkClickedEventArgs e) { linkLabel2.LinkVisited = true; System.Diagnostics.Process.Start("IExplore", "http://www.uacm.edu.mx"); } private void linkLabel3_LinkClicked(object sender, LinkLabelLinkClickedEventArgs e) { linkLabel3.LinkVisited = true; System.Diagnostics.Process.Start("C:\\"); } Observemos que normalmente no cambiamos el nombre de los controles por ejemplo aqu utilizamos el nombre por default linkLabel1, linkLabel2, linkLabel3, esto digamos que es por simplicidad, aunque si quisiramos que fuera mas intuitivo nuestro programa podramos llamar en lugar de linkLabel1, quizs calculadora, o en lugar de linkLabel2 el nombre de uacm, etc. La ejecucin de esta segunda parte del proyecto abrir las siguientes aplicaciones:

5.29

Captulo 5: Windows Forms

Web Browser y Creacin de Mens


En la siguiente aplicacin vamos a crear un Web Browser dentro de la misma forma, insertaremos algunas direcciones para seleccionar por cual navegar y mediante un men nos trasladaremos a la pgina principal, atrs o adelante, funciones bsicas que cualquier navegador tiene incorporadas, para lograr tal fin incorporaremos los siguientes controles: 1 Men (menuStrip) 1 Caja del tipo combo (comboBox) 2 Botones (Button) 1 Navegador Web (webBrowser)

Noten que el control menuStrip1 no aparece dentro de la forma si no en la parte inferior de nuestro proyecto, aqu por cuestiones de espacio se muestra del lado derecho. Veamos los pasos a seguir para crear el proyecto en primer lugar insertemos el control menuStrip, Cuando liberemos el control de men, veremos que crea un men por defecto en la parte superior que nos mostrara un cuadro que muestra Escriba Aqu, introducir el nombre del men; en este caso, Navegar. Cuando presionamos entrar o enter, aparecen nuevos cuadros vacos para crear otros mens y elementos de men. En el cuadro inferior, teclear Home. Presionar enter, y se mostrarn ms cuadros. Teclear Adelante. Presionar enter, y teclear Atras. Estos elementos de men constituyen nuestros controles bsicos de navegacin de sitios Web.

5.30

Captulo 5: Windows Forms

Como segundo paso vamos agregar el comboBox y llenarlo, un ComboBox provee una lista desplegable de opciones que el usuario puede seleccionar. En este programa, el ComboBox contendr una lista de nuestros sitios Web favoritos para tener un rpido acceso. Para crear la lista de sitios, seleccionar el ComboBox y visualizar sus propiedades. Hacer clic en la columna junto a la propiedad Items, y aparecer Coleccin y adelante un cuadro con puntos suspensivos hacer clic en ese botn para editar el contenido del ComboBox. Aadir tantas ligas de sitios Web como se desee, presionando enter tras introducir cada una de ellas.

Insertamos dos botones uno que seleccionara el link o enlace al cual queremos ir y el segundo para salir del programa, luego vamos a insertar el control webBrowser y ajustarlo al tamao adecuado. Ahora ya hemos finalizado la fase de diseo de nuestra aplicacin, y hemos llegado al punto donde necesitamos aadir algn cdigo en C# para proporcionar la funcionalidad del programa. Necesitamos aadir controladores para el botn y para cada opcin de men. Un controlador es un mtodo que se ejecuta cuando se activa un determinado control. Visual C# Express crea controladores vacos para nosotros automticamente. Hacer doble clic sobre el botn, y aparecer el editor de cdigo para nuestro proyecto. Veremos que el controlador para el evento asociado al evento de mensaje que sucede cuando el usuario hace clic sobre un botn ha sido creado por nosotros. Aadir cdigo al mtodo del controlador de modo que tenga una apariencia similar al ejemplo siguiente. private void button1_Click(object sender, EventArgs e) { webBrowser1.Navigate(comboBox1.SelectedItem.ToString()); }

5.31

Captulo 5: Windows Forms

Este cdigo toma el elemento del control ComboBox que est seleccionado, una cadena que contiene una URL Web, y lo pasa al mtodo de navegacin del navegador Web. El mtodo de navegacin carga y visualiza el contenido de una pgina Web en esa ubicacin. Vamos a aadir el cdigo para las opciones del men, (volver a la ventana de diseo o diseador presionar Shift + F7 y para ir al cdigo insertar F7), hacer doble clic sobre cada uno de los elementos de men. Visual C# Express crea mtodos de controladores para cada uno. Editar estos mtodos de modo que tengan una apariencia similar al cdigo siguiente. private void homeToolStripMenuItem_Click(object sender, EventArgs e) { // Opcin del Men Home o Pgina Principal webBrowser1.GoHome(); } private void adelanteToolStripMenuItem_Click(object sender, EventArgs { // Opcin del Men Adelante webBrowser1.GoForward(); } private void atrasToolStripMenuItem_Click(object sender, EventArgs e) { // Opcin del Men Atras webBrowser1.GoBack(); } La ltima tarea es aadir cdigo de inicializacin al mtodo Form1. Este mtodo es el constructor para el objeto Form1 y se invoca cuando se crea el Windows Form. Es, por tanto, la ubicacin ideal para situar cualquier cdigo que se requiera para cambiar los valores iniciales de los controles u otras configuraciones. El siguiente cdigo provocar que el control Web Browser visualice la pgina de inicio por defecto en nuestro ordenador, y tambin establecer el valor inicial del ComboBox. Cambiar el mtodo para que contenga el siguiente cdigo: public Form1() { InitializeComponent(); comboBox1.SelectedIndex = 0; webBrowser1.GoHome(); } El cdigo fuente completo de nuestro proyecto puede consultarse en el apndice 5: WebBrowser_Menus -- Form1.cs Un ejemplo de la ejecucin del proyecto:

5.32

Captulo 5: Windows Forms

Formas que llaman a otras formas


Vamos a crear tres Formas (Clases) Form1, Form2 y Form3, y la idea es que Form1 pueda llamar mediante respectivos botones a Form2 o Form3. Tanto Form2 como Form3 son dos Formas del tipo modal (mientras que no se cierren no puede accederse a otra parte del programa). Una vez que la aplicacin quede terminada lucir semejante a la que se muestra a continuacin:

5.33

Captulo 5: Windows Forms

Una vez llena la forma de captura Form3, la informacin es pasada a Form1, en la forma 3 tenemos 5 campos a llenar, Calle, Colonia, Delegacin, Cdigo Postal y Telfono, una vez que llenamos estos datos y damos clic al botn OK, automticamente los datos los copia a la forma 1, a las etiquetas label2, label3, label4, label5 y label6, respectivamente. Podemos dejar en blanco el campo Text de estas 5 etiquetas, para ilustra estos controles aparecen en el proyecto. Este es un ejemplo de la ejecucin:

5.34

Captulo 5: Windows Forms

En la Forma 1 vamos a ingresar: 6 Etiquetas (Label) 1 Caja de texto (textBox) 2 Botones (Button) En el Explorador de Soluciones haciendo clic derecho en el nombre del proyecto, vamos a insertar la forma 2 y 3.

En la Forma 2 vamos a ingresar: 2 Etiquetas (Label) 1 Botn (Button) En la Forma 3 vamos a ingresar: 6 Etiquetas (Label) 5 Caja de texto (textBox) 1 Botn (Button)

5.35

Captulo 5: Windows Forms

Creacin de Propiedades en una Clase


Cuando en una clase est declarado un campo (variable) privado por ejemplo Informacion del tipo string (vase el siguiente segmento de cdigo), la manera para acceder a l es mediante mtodos pblicos de la clase o a travs de la declaracin de una propiedad relacionada con l. En C# la manera de declarar una propiedad info para darle un valor al campo Informacion (set) o para poder leer el contenido de ste (get) es la siguiente: private string Informacion; public string info { set // para escritura { Informacion = value; } get // para lectura { return Informacion; } } Para nuestra Clase Form3 creremos 6 propiedades: public string Nombre { set { label1.Text = value; } } public string Calle { get { return textBox1.Text; } } public string Colonia { get { return textBox2.Text; } }
5.36 Captulo 5: Windows Forms

public string Delegacin { get { return textBox3.Text; } } public string CdigoPostal { get { return textBox4.Text; } } public string Telfono { get { return textBox5.Text; } } private void button1_Click(object sender, EventArgs e) { Close(); } El Mtodo para los dos botones de Form1 A continuacin se muestra el cdigo que debemos ingresar a los dos mtodos del botn Ingresar Datos y Acerca de..., anteriormente creado para Form1. private void button1_Click(object sender, EventArgs e) { Form2 acercaDe = new Form2(); acercaDe.ShowDialog(); } private void button2_Click(object sender, EventArgs e) { Form3 data = new Form3(); data.Nombre = textBox1.Text; data.ShowDialog(); label2.Text = "Calle: " + data.Calle; label3.Text = "Colonia: " + data.Colonia; label4.Text = "Delegacin: " + data.Delegacin; label5.Text = "Cdigo Postal " + data.CdigoPostal;
5.37 Captulo 5: Windows Forms

label6.Text = "Cdigo Postal " + data.Telfono; } El cdigo fuente completo de nuestro proyecto puede consultarse en el apndice 5: llamarFormas -- Form1.cs Form2.cs Form3.cs

Matrices en dataGridView
El control DataGridView proporciona una tabla personalizable para mostrar datos. La clase DataGridView permite personalizar celdas, filas, columnas y bordes mediante propiedades. El siguiente proyecto suma dos matrices cuadradas de NxN, consta de 3 dataGridViews en primer lugar se le asignan columnas y filas segn el tamao que le asignemos a la matriz por default, as como dos botones los cuales uno es para calcular el tamao de la matriz y rellenar los valores aleatorios dentro del grid, y el segundo botn nos sirve para calcular la suma de las dos matrices. Podemos modificar los valores de nuestros grids, y volver a sumar, para obtener la matriz resultante. Controles utilizados: 4 Etiquetas (Label) 3 Grid (dataGridView) 2 Botones (Button) 1 Caja de texto (textBox) El proyecto en vista del diseador tendr la siguiente apariencia:

Al botn Generar Matriz se le insertara el siguiente cdigo:


5.38 Captulo 5: Windows Forms

private void button1_Click(object sender, EventArgs e) { dataGridView1.Columns.Clear(); dataGridView2.Columns.Clear(); dataGridView3.Columns.Clear(); int tam = int.Parse(textBox1.Text); int i = 1; while (i <= tam) { DataGridViewColumn columna = new DataGridViewColumn(new DataGridViewTextBoxCell()); columna.Width = 25; //ancho this.dataGridView1.Columns.Add(columna); DataGridViewColumn columna2 = new DataGridViewColumn(new DataGridViewTextBoxCell()); columna2.Width = 25; this.dataGridView2.Columns.Add(columna2); DataGridViewColumn columna3 = new DataGridViewColumn(new DataGridViewTextBoxCell()); columna3.Width = 25; this.dataGridView3.Columns.Add(columna3); i++; } int[,] _matriz1 = new int[tam, tam]; // se declaran variables de tipo matriz int[,] _matriz2 = new int[tam, tam]; int[,] _matriz3 = new int[tam, tam]; dataGridView1.Rows.Add(tam); dataGridView2.Rows.Add(tam); dataGridView3.Rows.Add(tam); Random r = new Random(); // genera un dato de manera aleatoria, se utiliza para revolver los datos llena los datos de las casillas vacias. for (int f = 0; f < tam; f++) { for (int c = 0; c < tam; c++) { _matriz1[f, c] = r.Next(10); // valor inicial que agarra valores del 0 al 10 _matriz2[f, c] = r.Next(10); _matriz3[f, c] = 0; dataGridView1[f, c].Value = _matriz1[f, c]; // se agrega filas y colmnas dataGridView2[f, c].Value = _matriz2[f, c]; dataGridView3[f, c].Value = _matriz3[f, c]; } } }

Y botn Sumar el cdigo:


private void button2_Click(object sender, EventArgs e) { int tam = int.Parse(textBox1.Text); int[,] _matriz1 = new int[tam, tam]; int[,] _matriz2 = new int[tam, tam]; int[,] _matriz3 = new int[tam, tam]; for (int f = 0; f < tam; f++) // filas { for (int c = 0; c < tam; c++) //columnas { _matriz1[f, c] = int.Parse(dataGridView1[f, c].Value.ToString()); // almacena _matriz2[f, c] = int.Parse(dataGridView2[f, c].Value.ToString()); _matriz3[f, c] = _matriz1[f, c] + _matriz2[f, c]; dataGridView3.CurrentCell = dataGridView3[f, c]; dataGridView3.CurrentCell.Value = _matriz3[f, c]; } } }

5.39

Captulo 5: Windows Forms

La clase DataGridViewTextBoxCell es un tipo especializado de DataGridViewCell utilizado para mostrar una nica cadena de informacin basada en texto modificable. La clase DataGridViewColumn representa una columna lgica de un control DataGridView. Podemos recuperar las columnas a travs de la coleccin Columns del control. Al contrario que DataGridViewRow, que contiene la coleccin real de celdas de un control DataGridView, DataGridViewColumn se utiliza principalmente para ajustar la apariencia y comportamiento de la interfaz de usuario de la columna, como el ancho de columna y el estilo de celda. DataGridView.Rows Es una propiedad que obtiene una coleccin que contiene todas las filas del control DataGridView. Del lado izquierdo se muestra la ejecucin cuando damos una dimensin de 5 para nuestra matriz cuadrada en esta parte cada elemento de la matriz resultante se inicializa en cero, del lado derecho cuando damos clic en Suma obtenemos el resultado de cada elemento de la matriz resultante.

Creacin de Mens
El siguiente proyecto muestra la creacin de mens, utilizamos tres etiquetas y mediante las opciones del men Formato y Fondo, cambiamos el color de fondo, el tipo y color de la fuente o letra, mediante el men Acerca de mostramos informacin de contacto del autor del proyecto y la opcin Salir. Como parte complementaria y para no incluirla en un solo proyecto agregamos el control dateTimePicker y el botn Fecha, esto simplemente muestra un calendario seleccionamos una fecha y al dar clic en el botn nos muestra la fecha elegida y del da actual, esto con ayuda de un MessageBox.Show.
5.40 Captulo 5: Windows Forms

La estructura general del proyecto es la siguiente:

Controles utilizados: 3 Etiquetas (Label) 1 Men (menuStrip) 1 DateTimePicker 1 Botn (Button)

Con ingresar un solo menuStrip se pueden derivar todos los mens que necesitemos, en las siguientes imgenes se muestran cada una de las opciones del men, es importante aclarar que la opciones que aparecen como Ctrl+N, Ctrl+B, Ctrl+S, no se escriben si no son accesos rpidos para trabajar con el proyecto por ejemplo con Ctrl+S, sale uno del proyecto, en la siguiente pantalla se muestra como se configura esta propiedad.

5.41

Captulo 5: Windows Forms

En las siguientes figuras se muestra a detalle cada una de las opciones del men:

El cdigo del botn fecha nos da la informacin de la fecha seleccionada y el da actual junto con la hora, su cdigo es: private void button1_Click(object sender, EventArgs e) { // Muestra la fecha seleccionada: MessageBox.Show("Has seleccionado la fecha: " + dateTimePicker1.Value.Date); // Muestra la fecha de hoy: MessageBox.Show("Hoy es: " + DateTime.Now); }

5.42

Captulo 5: Windows Forms

Por razones de espacio el cdigo de cada men puede consultarse en el apndice 5: menuCalendario -- Form1.cs

Ejemplo de la ejecucin del proyecto:

5.43

Captulo 5: Windows Forms

You might also like