Interfaz Gráfica de Usuario en C#

Creación de una GUI a partir de un proyecto en blanco en el IDE SharpDevelop 3.2.0

Creamos una nueva Solución

Elegimos Proyecto en Blanco con cualquier nombre, en este caso GUI1

alvarez.tech

En el panel izquierdo podremos ver el explorador del proyecto y una carpeta de Referencias del Proyecto.

Para manejar elementos de un entorno grafico deberemos de adicionar más Referencias, para ello hacemos clic derecho sobre la carpeta Referencias y luego en Agregar

Referencia.

alvarez.tech

En la ventana de Agregar Referencia nos vamos a la pestaña GAC y buscamos las Referencias que necesitamos, las básicas que necesitaremos para el manejo de GUI’s

son:

System.Windows.FormsSystem.Drawing

Agregamos System.Windows.Forms con el botón Seleccionar, esta referencia nos sirve para manejar los controles que tiene C# para el manejo formularios.

alvarez.tech

Agregamos System.Drawing con el botón Seleccionar, esta referencia nos sirve para manejar los figuras geométricas, nos servirá para manejar puntos en la localización de

controles.

Una vez agregadas las referencias hacemos clic en OK y ahora estas nuevas referencias están en la carpeta Referencias del Proyecto.

alvarez.tech

Ahora empezamos a crear nuestra Ventana, para ello creamos un Archivo en Blanco con cualquier nombre en este caso Ventana.

alvarez.tech

Una vez creado el archivo escribimos el código del Proyecto.

using System;using System.Drawing;using System.Windows.Forms;

class Ventana : Form {private Label etiqueta;private TextBox cajaDeTexto;private Button boton;

public Ventana() {inicializarComponentes();

}public void inicializarComponentes() {

etiqueta = new Label();cajaDeTexto = new TextBox();boton = new Button();//// etiqueta//etiqueta.Location = new Point(20,20); // (eje X, eje

Y)etiqueta.Size = new Size(100,20); // (ancho, alto)etiqueta.Text = "Inserte su Nombre";//// cajaDeTexto//cajaDeTexto.Location = new Point(130,20);cajaDeTexto.Size = new Size(100,20);//// boton//boton.Location = new Point(70,60);boton.Size = new Size(120,30);boton.Text = "MOSTRAR";boton.Click += new EventHandler(metodoAccionBoton);//// Ventana//Controls.Add(etiqueta);Controls.Add(cajaDeTexto);Controls.Add(boton);Text = "Ventana";Size = new Size(280,160);

}public void metodoAccionBoton(object emisor, EventArgs e) {

MessageBox.Show(cajaDeTexto.Text, "HOLA"); // (texto, titulo)}

}

alvarez.tech

Ahora creamos el programa Principal para ejecutar nuestra aplicación.

alvarez.tech

Y escribimos el siguiente código del programa Principal.

using System.Windows.Forms;

class Principal {public static void Main(string[] a3d) {

Ventana X = new Ventana();Application.Run(X);

}}

alvarez.tech

Ahora podemos ejecutar el programa con el botón ejecutar o presionando F5.

Veremos que aparece la consola detrás de nuestra Ventana, esto se debe a que el proyecto está por defecto configurado en Modo Consola, para cambiar ello y ocular la

consola vamos a las propiedades del Proyecto, clic derecho en el proyecto y Propiedades.

alvarez.tech

En la pestaña Aplicación, vamos a Tipo de Salida y la cambiamos a Aplicación de Windows y luego guardamos el archivo de propiedades con Ctrl + S.

Ahora verán que en el proyecto ya no aparece la Consola por detrás de la aplicación.

Ahora hacemos uso de la aplicación.

alvarez.tech

Nota 1

Para que el estilo visual vaya de acuerdo al sistema operativo y no a los por defecto de C#, es posible cambiarlo añadiendo la línea siguiente antes de usar el método Run()

Application.EnableVisualStyles()

Ahora la aplicación se ejecuta con el estilo visual del S.O., Windows 7 en este caso.

alvarez.tech

Nota 2

Para los que tienen maquinas con procesador de 64 bits, es posible que no quiera ejecutar el IDE la aplicación, por problemas de compatibilidad, para que se ejecute hay

cambiar el CPU destino en la pestaña Generar en las propiedades del Proyecto.

alvarez.tech