Etapa 9: Revisar, comentar e testar o códigoStep 9: Review, comment, and test your code

Em seguida, adicione um comentário ao seu código.You next add a comment to your code. Um comentário é uma observação que não modifica a maneira que o programa se comporta.A comment is a note that doesn't change the way the program behaves. Facilita para alguém que esteja lendo o código para entender o que ele faz.It makes it easier for someone who is reading your code to understand what it does. Recomendamos que você tenha o hábito de adicionar comentários ao seu código.Adding comments to your code is a good habit to get into. No Visual C#, duas barras (//) marcam uma linha como um comentário.In Visual C#, two forward slashes (//) mark a line as a comment. No Visual Basic, aspas simples (') são usadas para marcar uma linha como um comentário.In Visual Basic, a single quotation mark (') is used to mark a line as a comment. Após adicionar um comentário, teste seu programa.After you add a comment, you test your program. É uma prática recomendável executar e testar seu código com frequência enquanto trabalha em seus projetos e, portanto, você pode capturar e corrigir os problemas no início, antes que o código fique mais complicado.It's good practice to run and test your code frequently while you're working on your projects, so you can catch and fix any problems early, before the code gets more complicated. Isso é chamado de teste iterativo.This is called iterative testing.

Você acabou de criar algo que funciona e que, embora ainda não esteja pronto, já pode carregar uma imagem.You just built something that works, and although it's not done yet, it can already load a picture. Antes de adicionar um comentário ao seu código e testá-lo, leva tempo para examinar os conceitos de código, pois você usará esses conceitos frequentemente:Before you add a comment to your code and test it, take time to review the code concepts, because you will use these concepts frequently:

  • Quando você clica duas vezes no botão Mostrar uma imagem no Designer de Formulários do Windows, o IDE adiciona automaticamente um método ao código do seu programa.When you double-clicked the Show a picture button in Windows Forms Designer, the IDE automatically added a method to your program's code.

  • Os métodos são a forma como você organiza seu código: é como o código é agrupado.Methods are how you organize your code: It's how your code is grouped together.

  • Na maioria das vezes, um método faz um pequeno número de coisas em uma ordem específica, como a forma como o seu método showButton_Click() mostra uma caixa de diálogo e carrega uma imagem.Most of the time, a method does a small number of things in a specific order, like how your showButton_Click() method shows a dialog box and then loads a picture.

  • Um método é composto por declarações de código, ou linhas de código.A method is made up of code statements, or lines of code. Pense em um método como uma maneira de empacotar as instruções de código juntas.Think of a method as a way to bundle code statements together.

  • Quando um método é executado, ou chamado, as instruções no método são excluídas em ordem, uma após a outra, começando com a primeira.When a method is executed, or called, the statements in the method are executed in order, one after another, starting with the first one.

    A seguir veja um exemplo de uma declaração.The following is an example of a statement.

    pictureBox1.Load(openFileDialog1.FileName);
    
    pictureBox1.Load(openFileDialog1.FileName)
    

    As instruções fazem com que seus programas funcionem.Statements are what make your programs do things. No Visual C#, uma instrução sempre termina em um ponto-e-vírgula.In Visual C#, a statement always ends in a semicolon. No Visual Basic, o final de uma linha é o fim de uma declaração.In Visual Basic, the end of a line is the end of a statement. (Nenhuma vírgula é necessária no Visual Basic.) A instrução anterior diz ao controle PictureBox para carregar o arquivo que o usuário selecionou com o componente OpenFileDialog.(No semicolon is needed in Visual Basic.) The preceding statement tells your PictureBox control to load the file that the user selected with the OpenFileDialog component.

    link para vídeoPara ver uma versão em vídeo deste tópico, confira Tutorial 1: Criar um visualizador de imagens no Visual Basic – Vídeo 5 ou Tutorial 1: Criar um visualizador de imagens em C# – Vídeo 5.link to videoFor a video version of this topic, see Tutorial 1: Create a picture viewer in Visual Basic - Video 5 or Tutorial 1: Create a picture viewer in C# - Video 5. Esses vídeos usam uma versão anterior do Visual Studio, portanto, existem pequenas diferenças em alguns comandos de menu e em outros elementos da interface do usuário.These videos use an earlier version of Visual Studio, so there are slight differences in some menu commands and other user interface elements. No entanto, os conceitos e procedimentos funcionam de maneiras semelhantes na versão atual do Visual Studio.However, the concepts and procedures work similarly in the current version of Visual Studio.

Para adicionar comentáriosTo add comments

  1. Adicione o seguinte comentário ao seu código.Add the following comment to your code.

    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);
        }
    }
    

    Note

    O manipulador de eventos do botão showButton Click foi concluído e funciona.Your showButton button's Click event handler is now finished, and it works. Você começou a escrever código, começando com uma instrução if.You have started writing code, starting with an if statement. Uma instrução if é como você dizer a seu programa, "Verifique isso, e se for verdadeiro, faça o seguinte".An if statement is how you tell your program, "Check this one thing, and if it's true, do these actions." Nesse caso, você informa o programa para abrir a caixa de diálogo Abrir Arquivo e, se o usuário escolher um arquivo e o botão OK, carregue o arquivo na PictureBox.In this case, you tell your program to open the Open File dialog box, and if the user selects a file and chooses the OK button, load that file in the PictureBox.

    Tip

    O IDE foi criado para facilitar o processo de escrever código, e os snippets de código são uma maneira de fazer isso.The IDE is built to make it easy for you to write code, and code snippets are one way it does that. Um snippet é um atalho que é expandido em um pequeno bloco de código.A snippet is a shortcut that gets expanded into a small block of code.

    Você pode ver todos os snippets disponíveis.You can see all of the snippets available. Na barra de menus, escolha Ferramentas > Gerenciador de Snippets de Código.On the menu bar, choose Tools > Code Snippets Manager. Para o Visual C#, o snippet if está no Visual C#.For Visual C#, the if snippet is in Visual C# . Para o Visual Basic, os snippets if estão em Condicionais e Loops > Padrões de Código.For Visual Basic, the if snippets are in Conditionals and Loops > Code Patterns. Você pode usar esse aplicativo para procurar por snippets existentes ou para adicionar seus próprios snippets.You can use this manager to browse existing snippets or add your own snippets.

    Para ativar um snippet ao digitar o código, digite-o e pressione a tecla Tab.To activate a snippet when typing code, type it and choose the Tab key. Muitos snippets aparecem na janela IntelliSense e é por isso que você escolhe a tecla Tab duas vezes: primeiro para marcar o snippet na janela do IntelliSense e, depois, para mandar o IDE para usar o snippet.Many snippets appear in the IntelliSense window, which is why you choose the Tab key twice: first to select the snippet from the IntelliSense window, and then to tell the IDE to use the snippet. (O IntelliSense oferece suporte a snippets de if, mas não a snippets de ifelse.)(IntelliSense supports the if snippet, but not the ifelse snippet.)

  2. Antes de executar o programa, salve seu programa clicando no botão Salvar Todos na barra de ferramentas, que aparece da seguinte forma.Before you run your program, save your program by choosing the Save All toolbar button, which appears as follows.

    Botão de barra de ferramentas Salvar Tudo Botão Salvar TudoSave All toolbar button Save All button

    Como alternativa para salvar seu programa, na barra de menus, escolha Arquivo > Salvar Todos.Alternatively, to save your program, on the menu bar, choose File > Save All. É uma prática recomendada salvar no início e com frequência.It's a best practice to save early and often.

    Quando estiver em execução, seu programa deve estar como a imagem a seguir.When it's running, your program should look like the following picture.

    Visualizador de imagens Visualizador de imagensPicture Viewer Picture Viewer

Para testar o programaTo test your program

  1. Escolha a tecla F5 ou escolha o botão da barra de ferramentas Iniciar Depuração.Choose the F5 key or choose the Start Debugging toolbar button.

  2. Escolha o botão Mostrar uma imagem para executar o código que você acabou de escrever.Choose the Show a picture button to run the code you just wrote. Primeiro, o programa abre uma caixa de diálogo Abrir Arquivo.First, the program opens an Open File dialog box. Verifique se seus filtros aparecem na lista suspensa Arquivos de tipo na parte inferior da caixa de diálogo.Verify that your filters appear in the Files of type drop-down list at the bottom of the dialog box. Em seguida, navegue para uma imagem e abra-a.Then navigate to a picture and open it. Geralmente você pode localizar as imagens de exemplo fornecidas com o sistema operacional Windows em sua pasta de Meus Documentos, dentro da pasta My Pictures\Sample Pictures.You can usually find sample pictures that ship with the Windows operating system in your My Documents folder, inside the My Pictures\Sample Pictures folder.

    Note

    Se você não vir imagens na caixa de diálogo Selecione um arquivo de imagem, verifique se o filtro Todos os arquivos (*.*) está marcado na lista suspensa no canto inferior direito da caixa de diálogo.If you don't see any images in the Select a picture file dialog box, be sure that the All files (*.*) filter is selected in the drop-down list on the lower right side of the dialog box.

  3. Carregue uma imagem e ela aparecerá em sua PictureBox.Load a picture, and it appears in your PictureBox. Tente redimensionar o formulário arrastando suas bordas.Then try resizing your form by dragging its borders. Como você tem seu PictureBox encaixado em um TableLayoutPanel, que está encaixado no formulário, sua área de imagem se redimensionará de modo que seja tão larga quando o formulário, e preencherá 90% da parte superior do formulário.Because you have your PictureBox docked inside a TableLayoutPanel, which itself is docked inside the form, your picture area will resize itself so that it's as wide as the form, and fills the top 90 percent of the form. É por isso que você usou os contêineres TableLayoutPanel e FlowLayoutPanel: eles mantêm seu formato dimensionado corretamente quando o usuário o redimensiona.That's why you used the TableLayoutPanel and FlowLayoutPanel containers: They keep your form sized correctly when the user resizes it.

    Agora, imagens maiores vão além das bordas do visualizador de imagens.Right now, larger pictures go beyond the borders of your picture viewer. Na próxima etapa, você adicionará código para fazer as imagens caberem na janela.In the next step, you'll add code to make pictures fit in the window.

Para continuar ou revisarTo continue or review