Tutorial: Criar um aplicativo Windows Forms para visualização de imagens (.NET Framework)

Nesta série de três tutoriais, você cria um aplicativo do Windows Forms que carrega uma imagem e a exibe. O IDE (Ambiente de Design Integrado) do Visual Studio fornece as ferramentas necessárias para criar o aplicativo.

Neste primeiro tutorial, você aprenderá a:

Para criar um novo aplicativo do Windows Forms com o .NET, siga o tutorial Criar um aplicativo do Windows Forms com o .NET. Consulte o Guia de Desktop sobre Windows Forms .NET para saber mais.

Pré-requisitos

• Você precisa do Visual Studio para concluir este tutorial. Visite a página de downloads do Visual Studio para obter uma versão gratuita.
• A carga de trabalho de Desenvolvimento para desktop do .NET. Para verificar ou instalar essa carga de trabalho no Visual Studio, selecione Ferramentas>Obter Ferramentas e Recursos. Para obter mais informações, consulte Modifique cargas de trabalho ou componentes individuais.

Criar seu projeto do Windows Forms

Quando você cria um visualizador de imagens, a primeira etapa é criar um projeto de Aplicativo do Windows Forms.

O Visual Studio cria uma solução para seu aplicativo. Uma solução é um contêiner para todos os projetos e arquivos necessários para seu aplicativo.

Neste ponto, o Visual Studio exibe um formulário vazio no Designer de Formulários do Windows .

Adicionar um elemento de layout

Seu aplicativo de exibição de imagem contém uma caixa de imagem, uma caixa de seleção e quatro botões, que você adicionará no próximo tutorial. O elemento de layout controla sua localização no formulário. Esta seção mostra como alterar o título do formulário, redimensionar o formulário e adicionar um elemento de layout.

1. Em seu projeto, selecione o Designer de Formulários do Windows. A guia exibe Form1.cs [Design] para C# ou Form1.vb [Design] para Visual Basic.

2. Selecione qualquer lugar no Form1.

3. A janela Propriedades agora exibe as propriedades do formulário. A janela Propriedades geralmente está no canto inferior direito do Visual Studio. Esta seção controla várias propriedades, como cor de plano de fundo e primeiro plano, texto de título que aparece na parte superior do formulário e o tamanho do formulário.

   Se Propriedades não for exibido, selecione Exibir>Janela Propriedades.

4. Localize a propriedade Texto na janela Propriedades. Dependendo de como a lista é classificada, talvez seja necessário rolar para baixo. Insira o valor Visualizador de Imagense depois escolha Enter.

   Seu formulário agora tem o texto Visualizador de Imagens na barra de título.

   Nota

   Você pode exibir propriedades por categoria ou em ordem alfabética. Use os botões na janela Propriedades para alternar para frente e para trás.

5. Selecione o formulário novamente. Selecione a alça de arrastar no canto inferior direito do formulário. A alça é um quadrado branco pequeno no canto inferior direito do formulário.

   

   Arraste a alça para redimensionar o formulário para que o formulário fique mais amplo e um pouco mais alto. Se você examinar a janela Propriedades, a propriedade Size é diferente. Você também pode alterar o tamanho do formulário alterando a propriedade Size.

6. No lado esquerdo do IDE do Visual Studio, selecione a guia Caixa de Ferramentas. Se não aparecer, selecione Exibir>Caixa de Ferramentas na barra de menus ou Ctrl+Alt+X.

7. Selecione o símbolo de triângulo pequeno ao lado de Contêineres para abrir o grupo.

   

8. Clique duas vezes em TableLayoutPanel na caixa de ferramentas. Você também pode arrastar um controle da caixa de ferramentas para o formulário. O controle TableLayoutPanel aparece em seu formulário.

   

   Nota

   Depois de adicionar o TableLayoutPanel, se uma janela aparecer dentro do formulário com o título TableLayoutPanel Tasks, clique em qualquer lugar dentro do formulário para fechá-la.

9. Selecione TableLayoutPanel. Você pode verificar qual controle está selecionado examinando a janela Propriedades.

   

10. Com o TableLayoutPanel selecionado, localize a propriedade Dock, que tem o valor None. Selecione a seta suspensa e, em seguida, selecione Preenchimento, que é o botão grande no meio do menu suspenso.

    

    Encaixe refere-se a como uma janela é anexada a outra janela ou área.

    O TableLayoutPanel agora preenche todo o formulário. Se você redimensionar o formulário novamente, o TableLayoutPanel permanecerá encaixado e ajustará seu tamanho para caber.

11. No formulário, selecione TableLayoutPanel. No canto superior direito, há um pequeno botão de triângulo preto.

    Selecione o triângulo para exibir a lista de tarefas do controle.

    

12. Selecione Editar Linhas e Colunas para exibir a caixa de diálogo Estilos de Coluna e Linha.

13. Selecione Coluna1 e defina seu tamanho como 15%. Verifique se a opção Porcentagem está selecionada.

14. Selecione Coluna2 e defina-o como 85%.

    

15. Em Mostrar na parte superior da caixa de diálogo Estilos de Coluna e Linha, selecione Linhas. Defina linha 1 como 90% e linha 2 para 10%. Selecione OK para salvar suas alterações.

    Seu TableLayoutPanel agora tem uma linha superior grande, uma linha inferior pequena, uma pequena coluna esquerda e uma coluna direita grande.

    

Seu layout está completo.

Executar seu aplicativo

Ao criar um projeto de aplicativo do Windows Forms, você cria um programa que é executado. Neste estágio, seu aplicativo Visualizador de Imagens não faz muito. Por enquanto, ele exibe uma janela vazia que mostra Visualizador de Imagens na barra de título.

Para executar o aplicativo, siga estas etapas.

1. Use um dos seguintes métodos:

   • Selecione a chave F5.
   • Na barra de menus, selecione Depurar>Iniciar depuração.
   • Na barra de ferramentas, selecione o botão Iniciar.

   O Visual Studio executa seu aplicativo. Uma janela com o título Visualizador de Imagens é exibida.

   

   Examine a barra de ferramentas do IDE do Visual Studio. Mais botões aparecem na barra de ferramentas quando você executa um aplicativo. Esses botões permitem que você faça coisas como parar e iniciar seu aplicativo e ajudá-lo a rastrear quaisquer erros.

   

2. Use um dos seguintes métodos para interromper seu aplicativo:

   • Na barra de ferramentas, selecione o botão Parar Depuração.
   • Na barra de menus, selecione Depurar>Parar depuração.
   • No teclado, insira Shift+F5.
   • Selecione X no canto superior da janela do Visualizador de Imagens .

   Quando você executa seu aplicativo no IDE do Visual Studio, isso é chamado de depuração. Você executa seu aplicativo para localizar e corrigir bugs. Você segue o mesmo procedimento para executar e depurar outros programas. Para saber mais sobre depuração, confira Introdução ao depurador.

Próxima etapa

Avance para o próximo tutorial para saber como adicionar controles ao seu programa visualizador de imagens.