Paso 9: Revisar, comentar y probar el código

Antes de agregar un comentario al código y probarlo, dedique un tiempo a revisar los conceptos del código, porque los utilizará con frecuencia:

  • Cuando hizo doble clic en el botón Mostrar una imagen en el Diseñador de Windows Forms, el IDE agregó automáticamente un método al código del programa.

  • Los métodos permiten organizar el código: son la manera de agrupar las partes del código.

  • Casi siempre, un método realiza una cantidad reducida de acciones en un orden concreto; por ejemplo, el método showButton_Click() muestra un cuadro de diálogo y, a continuación, carga una imagen.

  • Un método se compone de instrucciones.Podemos considerar que un método es una manera de empaquetar instrucciones juntas.

  • Cuando se ejecuta un método, o se le llama, se ejecutan las instrucciones que contiene en orden, una tras otra, empezando por la primera.

    A continuación, se muestra un ejemplo de una instrucción.

    pictureBox1.Load(openFileDialog1.FileName);

    pictureBox1.Load(openFileDialog1.FileName)

    Las instrucciones son lo que permite que el programa haga cosas.En Visual C#, una instrucción finaliza siempre en un signo de punto y coma.En Visual Basic, el final de una línea es el final de una instrucción.(No se necesita indicar el signo de punto y coma en Visual Basic.) La instrucción anterior ordena al control PictureBox que cargue el archivo que el usuario seleccionó con el componente OpenFileDialog.

vínculo a vídeoPara obtener una versión en vídeo de este tema, vea tutorial 1: Crear un visor de imagen en Visual Basic - vídeo 5 o tutorial 1: Crear un visor de imagen en C# - vídeo 5.

A continuación, se agrega un comentario al código.Un comentario es una nota que no cambia la forma de comportarse del programa.Hace que resulte más fácil entender qué hace el código.En Visual C#, se utilizan dos barras diagonales (//) para marcar una línea como comentario.En Visual Basic, se utiliza una comilla sencilla (') para marcar una línea como comentario.

Después de agregar un comentario, se prueba el programa.Acaba de compilar algo que funciona y, aunque todavía no está terminado, ya es capaz de cargar una imagen.

Para agregar comentarios

  1. Agregue lo siguiente.

    Private Sub showButton_Click() Handles showButton.Click

    ' Show the Open File dialog. If the user clicks OK, load the
    ' picture that the user chose.
    If OpenFileDialog1.ShowDialog() = DialogResult.OK Then
        PictureBox1.Load(OpenFileDialog1.FileName)
    End If

End Sub

    private void showButton_Click(object sender, EventArgs e)
{
    // Show the Open File dialog. If the user clicks OK, load the
    // picture that the user chose.
    if (openFileDialog1.ShowDialog() == DialogResult.OK)
    {
        pictureBox1.Load(openFileDialog1.FileName);
    }
}

    [!NOTA]

    El controlador de eventos Click del botón showButton ya está completado y funciona.Ha empezado a escribir código, comenzando por una instrucción if.Una instrucción if es la manera de ordenar al programa: "Compruebe esto y, si se cumple, realice estas acciones". En este caso, se ordena al programa que abra el cuadro de diálogo Abrir archivo y, si el usuario selecciona un archivo y hace clic en el botón Aceptar, ese archivo se carga en PictureBox.

    [!NOTA]

    El IDE se ha creado para facilitar la tarea de escribir código. Los fragmentos de código constituyen una manera de conseguirlo.Un fragmento de código es un acceso directo que se expande para crear un bloque pequeño de código.

    Puede ver todos los fragmentos de código seleccionando Administrador de fragmentos de código en el menú Herramientas.El fragmento de código if se encuentra en Modelos de código, en la subcarpeta Condicionales y bucles.Este administrador se puede utilizar para examinar los fragmentos de código existentes o agregar los suyos propios.

    Para activar un fragmento de código al escribir código, escríbalo y presione la tecla TAB.Muchos fragmentos de código aparecen en la ventana IntelliSense, motivo por el cual la tecla TAB se presiona dos veces: la primera, para seleccionar el fragmento de código en la ventana IntelliSense y, la segunda, para ordenar al IDE que lo utilice.(IntelliSense admite el fragmento de código if, pero no el fragmento de código ifelse.)

  2. Antes de ejecutar el programa, guárdelo haciendo clic en el botón de la barra de herramientas Guardar todo, que se muestra a continuación.

    Botón Guardar todo

    Botón de la barra de herramientas Guardar todo

    Como alternativa, puede hacer clic en Guardar todo en el menú Archivo.El procedimiento recomendado consiste en guardar desde el principio y a menudo.

    Mientras se ejecuta, el programa debería parecerse a la siguiente imagen.

    Visor de imágenes

    Visor de imágenes

Para probar el programa

  1. Presione la tecla F5 o haga clic en el botón Iniciar depuración de la barra de herramientas.

  2. Haga clic en el botón Mostrar una imagen para ejecutar el código que acaba de escribir.Primero, el programa abre un cuadro de diálogo Abrir archivo.Compruebe que los filtros aparecen en la lista desplegable Tipo de archivo en la parte inferior del cuadro de diálogo.A continuación, navegue hasta una imagen y ábrala.Normalmente, encontrará imágenes de ejemplo que se distribuyen con el sistema operativo Windows en la carpeta Mis documentos, dentro de la carpeta Mis imágenes\Sample Pictures.

  3. Cargue una imagen y esta aparecerá en el control PictureBox.A continuación, intente cambiar el tamaño del formulario.Como el control PictureBox está acoplado dentro de un control TableLayoutPanel, que a su vez está acoplado en el formulario, el ancho del área de imagen se ajustará al ancho del formulario y el alto ocupará el 90 por ciento superior del formulario.Por este motivo hemos utilizado los contenedores TableLayoutPanel y FlowLayoutPanel: mantienen el tamaño del formulario correcto cuando el usuario lo modifica.

Para continuar o revisar

  • Last updated on