5
Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente tutorial muestra los fundamentos básicos para la creación de una interfaz gráfica. Para crear una interfaz gráfica en c#, comúnmente conocida como proyecto de window forms debemos crear un proyecto de la siguiente manera: 1. Seleccionar Plantilla de Visual C#. 2. En las categorías seleccionar aplicación de Windows Forms. 3. Posteriormente asignarle un nombre al proyecto y presionar el botón Aceptar. Y verá una pantalla como la siguiente:

Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Embed Size (px)

Citation preview

Page 1: Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com

Manejo básico de Interfaces gráficas.

El presente tutorial muestra los fundamentos básicos para la creación de una interfaz gráfica.

Para crear una interfaz gráfica en c#, comúnmente conocida como proyecto de window forms

debemos crear un proyecto de la siguiente manera:

1. Seleccionar Plantilla de Visual C#.

2. En las categorías seleccionar aplicación de Windows Forms.

3. Posteriormente asignarle un nombre al proyecto y presionar el botón Aceptar. Y verá una

pantalla como la siguiente:

Page 2: Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com

A continuación se describen los elementos básicos de Visual Studio.

1. Cuadro de herramientas. Esta sección contiene todos los elementos tanto gráficos

como no gráficas que podemos utilizar dentro de nuestros formularios.

2. Área de trabajo. En esta área se visualizan los formularios que agregamos para diseñar

las interfaces gráficas. Un formulario es una ventana y funciona como el contenedor

principal de todos los objetos que agreguemos a nuestras interfaces.

3. Explorador de soluciones. Esta sección contiene un árbol jerarquizado que muestra

todos los elementos que tenemos en nuestro proyecto de Windows forms, y si nos

queremos desplazar entre un formulario y otro, esta sección es la indicada para

seleccionar los formularios.

4. Ventana de propiedades. Nos muestra las propiedades que contienen todos los

elementos que podemos manipular en un proyecto de Windows forms, por ejemplo

en esta ventana modificamos el color de fondo, el tipo de fuente, y más propiedades.

Creación de un formulario de ejemplo.

El diseño del formulario será el siguiente:

Page 3: Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com

Para este ejemplo manipularemos los siguientes objetos y sus propiedades, esto quiere decir que

deberemos seleccionar al objeto deseado y desde la ventana de propiedades modificar las que se

indican abajo con los valores propuestos:

Objeto Propiedad Valor

Etiqueta(label) Text Nombre:

Name

Cuadro de Texto(textbox) Text (vacio)

Name Txtnombre Botón de comandos(command button)

Text Mostrar Mensaje

Name Cmdmostrar

Códigos.

Para esta sección se daremos funcionalidad a los objetos agregados. Para agregar código bastará

con dar doble click sobre el objeto deseado para que aparezca una ventana de código como la

siguientes:

Page 4: Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com

Las secciones de la ventana de código se explican a continuación:

1. En esta sección aparecerá el nombre del objeto que nos encontramos codificando.

2. En esta sección aparecerá el evento que nos encontramos manipulando, ahí podremos

seleccionar diversos eventos como: click, dobleclick, tecla presionada, etc.

3. En esta sección se encontrará el código agregado, cada bloque se código se encontrará

inicializado con un encabezado que indica que evento es el que está codificado.

Código para el ejemplo.

En este ejemplo se codificará el evento click del botón por lo que deberá dar doble click sobre el

botón para que procedamos a escribir el código correspondiente. En este caso lo que se le

agregará al botón será lo siguiente:

MessageBox.Show("Hola " + txtnombre.Text + " primer ejercicio con Windows Forms");

Lo que hace este código es mostrar un cuadro de diálogo y dentro de él un mensaje que muestra

el nombre tecleado y otra cadena de caracteres. Tal y como se muestra en la siguiente imagen.

Page 5: Manejo básico de Interfaces gráficas · Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com Manejo básico de Interfaces gráficas. El presente

Andrés Donaciano Martínez Guillén -.- Programación con C# -.- andresmtzg.wordpress.com