Conceptos del lenguaje Visual C#
Cómo crear una aplicación Windows
en C#
Esta página ha sido
extraída de los archivos
de ayuda locales
instalados con Visual C#
Express y como tal es
documentación preliminar
que está sujeta a
cambios en futuras
versiones.
El propósito de este
tema es informar de
los elementos del
entorno de
desarrollo Visual C#
Express mientras
creamos un
programa en
C# relativamente
sencillo utilizando
Windows Forms.
Windows Forms
proporciona a
nuestro proyecto los
componentes que
integran una interfaz
de usuario de una
aplicación Windows
estándar, incluyendo
cuadros de diálogo,
menús, botones y
muchos otros
controles.
Este ejemplo muestra
cómo crear nuestra
propia aplicación
basada en el
navegador Web, que
podemos personalizar
con accesos directos
a nuestros sitios
Web favoritos.  Nota:
|
|---|
|
Muchas
de las
características
del
entorno
de
desarrollo
que se
describen
en este
tema
también
las
encontraremos
cuando
desarrollemos
aplicaciones
de
consola;
por
ello, es
importante
que no
nos saltemos
esta
parte
simplemente
porque
no
tengamos
previsto
escribir
aplicaciones Windows.
|
En esta sección,
aprenderemos: -
Cómo crear una
nueva aplicación
Windows
-
Cómo alternar
entre las vistas
de código y
diseño
-
Cómo cambiar las
propiedades de Windows Forms
-
Cómo añadir un
menú de control
-
Cómo crear y
poblar un
control ComboBox
-
Cómo utilizar un
control de
navegador Web
-
Cómo crear
controladores
para controles
Para crear una
aplicación Windows en C#-
Abrir
Visual C#
Express.
-
En el menú File,
hacer clic en New
y, a
continuación,
hacer clic en Project.
Aparece el
cuadro de
diálogo New
Project.
Este cuadro de
diálogo lista
los diferentes
tipos de
aplicaciones predeterminadas que
puede crear Visual C#
Express.
- Seleccionar
Windows
Application
como nuestro
tipo de proyecto.
-
Cambiar el
nombre de
nuestra
aplicación por
Web Browser.
La ubicación por
defecto debería
ser correcta,
pero siempre
podemos
introducir una
nueva ruta si lo
deseamos.
-
Hacer clic en OK.
Visual C# Express
crea una nueva
carpeta para nuestro
proyecto, denominada
según el título de
proyecto, y a
continuación abre la
ventana principal de
Visual C# Express.
La vista por defecto
es la de nuestro
nuevo formulario
Windows Forms,
cuyo título es Form1.
Podemos cambiar
esta vista por la
vista de código
fuente en cualquier
momento presionando F7,
y regresar a la
vista de diseño
presionando
MAYÚSCULAS + F7. 
El formulario Windows Form
es la ventana que se
abre cuando se
inicia nuestra
aplicación. Podemos
arrastrar diversos
controles a esta
ventana, aceptar
entradas del usuario,
visualizar texto y
gráficos y hacer
cualquier cosa que
una aplicación
Windows puede hacer.
Entre bastidores, el
código requerido
para gestionar la
ventana ha sido
creado por Visual C#
Express y está
contenido en un
archivo que
normalmente se
oculta. Podemos ver
este archivo,
denominado
Form1.designer.cs, si
abrimos Solution
Explorer,
hacemos clic en el
icono Show All
Files de la
barra de
herramientas del
explorador de
soluciones y a
continuación
expandimos Form1.cs.
El archivo está
oculto porque
generalmente el
diseñador de
Visual C# Express
gestiona el código
que contiene, en
lugar de permitirnos
editarlo manualmente. - Cambiar
el tamaño del
Windows Form.
Si no estamos
en la
vista de diseño,
presionar
MAYÚSCULAS +
F7. Hacer clic
en la esquina
inferior derecha
del Windows Form,
y cuando el
cursor se
convierta en una
flecha doble,
hacer clic y
estirar la
esquina del
formulario hasta
que ocupe
aproximadamente una
cuarta parte de
nuestra
pantalla. Ésta
es la ventana en
la que se
mostrarán
nuestros sitios
Web, por ello
no deseamos que
tenga poco
espacio.
-
Cambiar el
título del
Windows Form.
Si la ventana
Properties
no está abierta,
seleccionar
Properties
Window en
el menú View.
Esta ventana
lista las
propiedades del Windows
Form o del control
seleccionado en
ese momento,
y es aquí donde
podemos modificar
los valores
existentes.
Para cambiar el
título
Form1 del Windows Form
por
Web Browser,
buscaremos la
propiedad Text,
y modificaremos el
valor de la
columna de al
lado. Cuando
confirmamos el
cambio
presionando las
teclas ENTRAR o TAB
para quitar el
foco del
control, veremos
que el nombre de
nuestro
Windows Form ha
cambiado.
Observar que hay
un campo similar
denominado (Name).
Éste es el
nombre de la
clase que
contiene el Windows Form.
También podemos
cambiarla, pero si
lo hacemos,
deberemos
recordar que el
resto del código
de esta tarea
hace referencia
al viejo nombre
Form1. 
Para modificar
rápidamente el
nombre de un
control sin
abrir el panel
de
Properties,
hacer clic con
el botón
secundario
sobre el
control, y
seleccionar Edit
Properties
en el menú
contextual.
- Añadir
un control de menú.
Abrir el cuadro
de herramientas
Toolbox
haciendo clic en
el icono Toolbox
de la barra de
herramientas, o
seleccionando
Toolbox
en el menú View.
Desplazarse
hacia abajo por
la lista de
controles hasta
llegar a
MainMenu.
Hacer clic y
arrastrar este
control a
cualquier parte
del Windows Form.
Cuando liberemos
el control de
menú, veremos
que crea un menú
por defecto en
la parte
superior del
formulario.
- Poblar
el menú.
En el cuadro que
muestra
Type Here,
introducir el
nombre del menú;
en este caso,
Navigate.
Cuando
presionamos
ENTRAR, aparecen
nuevos cuadros
vacíos para
crear otros
menús y
elementos de
menú. En el
cuadro inferior,
teclear
Home.
Presionar ENTRAR,
y se mostrarán
más cuadros.
Teclear Go Back.
Presionar ENTRAR,
y teclear Go
Forward.
Estos elementos
de menú
constituyen
nuestros
controles
básicos de
navegación de
sitios Web.
Para hacer
nuestro código
fuente más
legible,
deberíamos
cambiar los
nombres predeterminados de los
elementos de
menú. Si abrimos
la ventana Properties
y hacemos clic
sobre cada
elemento de
menú, veremos
que tienen
nombres de
diseño como
menuItem1,
menuItem2,
y así
sucesivamente.
Cambiar los
nombres de los
elementos de
menú, de modo
que el elemento
Home
se denomine menuItem_Home,
Go Back
se denomine
menuItem_GoBack,
y Go
Forward se
denomine
menuItem_GoForward.
-
Añadir un botón.
Desde Toolbox,
arrastrar un
control de botón
aproximadamente
hacia la mitad
del Windows
Form, justo
debajo de la
barra de menú.
Visualizar los
botones en la
ventana
Properties,
cambiar la
propiedad Text
a
Go en lugar
de button1
y cambiar el
nombre de diseño
de
button1
a button_go.
- Añadir
un ComboBox.
Arrastrar un
control ComboBox
desde
Toolbox
y posicionarlo a
la izquierda del
nuevo botón.
Hacer clic y
arrastrar los
márgenes y
esquinas para
cambiar el
tamaño y
reposicionar el
ComboBox
hasta que esté
alineado con el
botón, como se
muestra en la
siguiente
imagen de
pantalla.
|
Nota:
|
|---|
|
Cuando movemos controles alrededor de un Windows Form, vemos que aparecen líneas azules. Estas líneas son guías
que nos ayudan a alinear los controles vertical y horizontalmente. También podemos alinear controles seleccionando
más de uno a la vez. Podemos hacerlo haciendo clic y arrastrando un cuadro de selección alrededor de los controles,
o mantener presionado MAYÚSCULAS mientras hacemos clic sobre ellos. A continuación, aplicamos los iconos de alineación
y cambio de tamaño que aparecen en la barra de herramientasLayout en la parte superior de la ventanaDesign.
|
-
Rellenar el ComboBox.
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 rápido 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á un botón elipse (). Hacer clic en este botón para editar el contenido delComboBox.
Añadir tantas URLs de sitios Web como se desee, presionando ENTER tras introducir cada una de ellas.
- Añadir el control WebBrowser.
Abrir el Toolbox, y desplazarse
hacia abajo hasta localizar el control WebBrowser. Hacer clic y arrastrar el control al Windows Form. Modificar el
tamaño del control WebBrowser hasta ajustarlo adecuadamente dentro del Windows Form, sin ocultar los
controles ComboBox yButton. Si no es posible modificar el tamaño del control
fácilmente WebBrowser,
abrir sus
propiedades,
localizar la
propiedad
Dock, y
comprobar que
está establecida
a
none.
Establecer las
propiedades
Anchor
a
Top, Bottom,
Left, Right
y establecer la
propiedad AutoRelocate
a
True hará
que el control
WebBrowser
cambie su tamaño
apropiadamente
cuando cambiemos
el tamaño de la
ventana de
aplicación.
El control
WebBrowser
es el
control que
realiza
todo el
trabajo duro de
representar las
páginas Web.
-
Añadir un
controlador para
el control Button.
Ahora ya hemos
finalizado la
fase de diseño
de nuestra
aplicación, y
hemos llegado al
punto donde
necesitamos
añadir algún
código en C#
para
proporcionar la
funcionalidad
del programa.
Necesitamos
añadir
controladores
para el botón y
para cada opción
de menú. Un
controlador es
un método que se
ejecuta cuando
se activa un
determinado
control. Visual C#
Express crea
controladores
vacíos para
nosotros
automáticamente.
Hacer doble clic
sobre el botón,
y aparecerá el
editor de código
para nuestro
proyecto.
Veremos que
el controlador
para el evento
asociado al
evento de
mensaje que
sucede cuando el
usuario hace
clic sobre un
botón ha sido
creado por nosotros. Añadir
código al método
del controlador
de modo que
tenga una
apariencia
similar al
ejemplo
siguiente.
private void button_go_Click(object sender, System.EventArgs e)
{
webBrowser1.Navigate(comboBox1.SelectedItem.ToString());
} |
Este código toma
el elemento
del control
ComboBox que
está
seleccionado, una
cadena que
contiene una
URL
Web, y lo
pasa al método
de navegación
del navegador
Web. El método
de navegación
carga y
visualiza el
contenido de una
página Web en
esa ubicación.
- Añadir
controladores
para las
opciones de menú.
Volver a la
ventana de
diseño
presionando F7 y
hacer doble clic
sobre cada uno
de los elementos
de menú. Visual C#
Express crea
métodos de
controladores
para cada uno.
Editar estos
métodos de modo
que tengan una
apariencia
similar al
código siguiente.
private void menuItem_Home_Click(object sender, System.EventArgs e)
{
// Go to Home Page menu option
webBrowser1.GoHome();
}
private void menuItem_GoForward_Click(object sender, System.EventArgs e)
{
// Go forward menu option
webBrowser1.GoForward();
}
private void menuItem_GoBack_Click(object sender, System.EventArgs e)
{
// Go back manu option
webBrowser1.GoBack();
} |
Cada uno de
estos
controladores de
menú invoca un
método de
navegación que
forma parte de la
clase WebBrowser. | Nota:
|
|---|
|
Podemos
ver
en
este
código
que
los
nombres
por
defecto
asociados
a
las
opciones
de
menú
pueden
llegar
a
ser
confusas.
Por
esta
razón,
es
una
buena
idea
modificar
el
nombre
de
cada
control
de
menú
a
medida
que
los
creamos,
utilizando
el
editor
de
propiedades.
El
nombre
del
controlador
reflejará
entonces
el
nombre
de
la
opción
de
menú.
|
- Añadir
código de
inicialización.
La última tarea
es añadir algún
código más al
método Form1.
Este método es
el constructor
para el objeto
Form1 y
se invoca cuando
se crea el
Windows Form. Es,
por tanto, la
ubicación ideal
para situar
cualquier código
que se requiera
para cambiar los
valores
iniciales de los
controles u
otras
configuraciones.
El siguiente
código provocará
que el control Web
Browser
visualice la
página de inicio
por defecto en
nuestro
ordenador, y
también
establecerá el
valor inicial
del
ComboBox.
Cambiar el
método para que
contenga el
siguiente código: public Form1()
{
InitializeComponent();
comboBox1.SelectedIndex = 0;
webBrowser1.GoHome();
} |
-
Generar y
ejecutar el
programa.
Presionar F5
para generar y
ejecutar nuestro
navegador Web.
Nuestro Windows
Form debería
visualizarse en
pantalla, y a
continuación
mostrar la
página de inicio
de nuestro
ordenador.
Podemos usar el
control
ComboBox
para seleccionar
un sitio Web y
hacer clic en Go
para navegar
hasta
él.
Las opciones de
menú nos
permiten volver
a la página de
inicio, o ir
hacia atrás o
adelante a los
sitios Web
previamente
visitados.
Si somos nuevos en
la programación en
C#, éste sería un
buen momento para
leer la sección C#
Language Primer
en la documentación
instalada localmente
de Visual C#
Express. Para saber más sobre el
entorno de
desarrollo
Visual C# Express
o sobre cómo crear
aplicaciones de
consola utilizando
IntelliSense, leer
la sección previa
"Cómo crear una
aplicación de
consola en C#. |