Ejercicio: Escritura de una aplicación de Windows Forms

10 minutos

Screenshot that shows the UWP, WPF, and Windows Forms logo.

Windows Forms, basado en la venerable API Win32, sigue siendo una tecnología de interfaz de usuario popular para el desarrollo de herramientas y utilidades que no requieren nada especialmente complicado. Las aplicaciones compiladas con Windows Forms se ejecutan en un equipo de escritorio, portátil y tableta y tienen una apariencia familiar para casi todo el mundo que tenga una mínima experiencia informática.

En esta unidad, vamos a hacer lo siguiente:

Utilizar Visual Studio para crear un proyecto de Windows Forms.
Agregar elementos de interfaz de usuario y código al proyecto para crear una divertida variación de un programa "Hola mundo". El texto "¡Hola a todos!" cambiará de color aleatoriamente cada vez que seleccione el botón Saludar.
Obtenga información sobre cómo establecer propiedades y crear eventos.

Nota:

Su equipo debería estar configurado con Windows y Visual Studio, tal y como se describe en el módulo de aprendizaje Introducción al desarrollo en Windows 10.

Tutorial de "Diga hola" de Windows Forms

Creación del proyecto

Abra Visual Studio y seleccione Archivo>Nuevo>Proyecto en el menú. Con C# seleccionado como lenguaje del proyecto, busque y seleccione Aplicación de Windows Forms entre las opciones del proyecto. Cambie el Nombre a algo descriptivo como Diga hola y seleccione Siguiente cuando haya terminado.
Seleccione la versión de .NET y, a continuación, seleccione Crear.
De forma predeterminada, los paneles Cuadro de herramientas, Explorador de soluciones y Propiedades están abiertos. Si no lo están, ábralas desde el menú Ver. Expanda la lista de Controles comunes del Cuadro de herramientas.

Compilación de la interfaz de usuario

Con el panel Propiedades de Form1 abierto, cambie la entrada de Texto de Form1 a Diga hola. En el otro lado de la pantalla, arrastre un elemento de botón desde el cuadro de herramientas a la parte inferior del formulario y agregue un elemento de cuadro de texto a la parte superior. A continuación, amplíe un poco el cuadro de texto para que su diseño tenga un aspecto similar a este:
Seleccione el botón para abrir sus propiedades. Cambie el Nombre a BotónDigaHola y, a continuación, desplácese hacia abajo en las propiedades y cambie la propiedad Texto a Diga hola.
Debemos adjuntar un evento al botón. Puede adjuntar el evento al seleccionar el botón en la vista Diseño o al seleccionar el icono de evento en Propiedades y, a continuación, pulsar la tecla ENTRAR o seleccionar la entrada de evento Hacer clic. Independientemente del método que elija, Visual Studio agrega automáticamente el código de esquema para el evento SayHelloButton_Click al archivo Form1.cs y lo abre. Eche un vistazo rápido y, por ahora, vuelva a la Vista de diseño.

Nota:

Si ha cerrado accidentalmente la vista Diseño, puede abrirla de nuevo con un doble clic en el archivo Form1.cs en el Explorador de soluciones. La acción predeterminada en Visual Studio es abrir un formulario de Windows Forms en la vista Diseño.
Seleccione el cuadro de texto en la Vista de diseño para abrir sus propiedades. Si ha utilizado el método de lista de eventos para agregar el evento de botón, seleccione el icono de la llave inglesa y del documento en Propiedades. Deje la entrada Nombre como textBox1. Seleccione el signo más a la izquierda de Fuente y, a continuación, cambie el Tamaño de la fuente a 24. A continuación, desplácese un poco hacia abajo en las propiedades y cambie la propiedad Text por Hola a todos y TextAlign por Centrar.

Agregar el código

Ahora, cambie la vista principal para centrarse en Form1.cs.

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }

    private void SayHelloButton_Click(object sender, EventArgs e)
    {

    }
}

Para que aparezcan colores de texto aleatorios, necesita agregar la variable de nivel de clase Random rand. Debe inicializarla en el método de constructor de Form1 y escribir un método para rellenar una matriz de bytes corta con números aleatorios. Copie y pegue las siguientes líneas de código o escríbalas:

public partial class Form1 : Form
{
    private Random rand;

    public Form1()
    {
        InitializeComponent();
        rand = new Random();
    }

    private byte[] GetRandomBytes(int n)
    {
        // Fill an array of bytes of length "n" with random numbers.
        var randomBytes = new byte[n];
        rand.NextBytes(randomBytes);
        return randomBytes;
    }

    private void SayHelloButton_Click(object sender, EventArgs e)
    {

    }
}

Para cambiar el color de texto cada vez que se seleccione el botón Diga hola, agregue el cuerpo del método BotónDigaHola_Clic a su programa.

    private void SayHelloButton_Click(object sender, EventArgs e)
    {
        // Declare an array of bytes and fill it with random numbers
        byte[] rgb = GetRandomBytes(3);
        textBox1.ForeColor = Color.FromArgb(255, rgb[0], rgb[1], rgb[2]);
    }

Dedique un momento a revisar el código. Si algún fragmento aparece subrayado en rojo, significa que no es del todo correcto. Podría ser una palabra mal escrita o un fragmento de código desplazado.

Ejecutar

Vamos a compilar y ejecutar el programa.

En Visual Studio, en el menú Depurar, seleccione Iniciar sin depuración, o simplemente seleccione la tecla F5. Si ha escrito todo correctamente, debe ver una aplicación en ejecución similar a la siguiente:
Tras unos pocos segundos de tiempo de compilación, seleccione repetidamente Saludar y observe cómo el texto ¡Hola a todos! cambia de color.

Si puede verlo, significa que lo ha hecho bien. Ha finalizado este tutorial. Si no es así, vuelva a examinar detenidamente el código y la configuración de las propiedades de la interfaz de usuario para detectar algún aspecto incorrecto que se le haya escapado.

Continuar