Conhecendo o VS2008 - Bruno Campagnolo de Paula weblog

Bruno C. de Paula
Conhecendo o VS2008:
Windows Forms X
Web Forms X
Web Services
1º Semestre 2009 > PUCPR >
Pós em Web
Resumo da aula
O objetivo de hoje é comparar
algumas das abordagens de
desenvolvimento possíveis
para trabalhar com a
plataforma .Net.
Visual Studio 2008
Ambiente de desenvolvimento
integrado (IDE - Integrated
Development Environment)
da Microsoft para geração rápida
de aplicações (RAD - Rapid
Application Development);
Suporte a múltiplas linguagens
(C#, VB.Net, F#, etc) e
plataformas (Web, Mobile,
Windows).
Edições
Download e mais informações em:
http://www.microsoft.com/express
http://www.microsoft.com/visualstudio/
Passo a passo
Projeto em Windows Forms
para cálculo do IMC
IMC = peso / (altura * altura)
(Visual C# Express)
Windows Forms
Desktop em .Net
Abordagem imperativa (código C#):
– Descreve o programa como um
conjunto de ordens (ações);
– Diz como fazer;
– Poderosas, mas difíceis para "pessoas
normais";
Desenvolvimento Windows, Linux e
MacOs (Mono).
31/05/2017
6
Criar um Projeto
File > New Project
Escolher o tipo de projeto
Visualizar o esqueleto de solução
criado
Solução = Conjunto
de Projetos
Esqueleto de solução
Formulário:
Form1.cs:
comportamento;
Form1.Designer.cs:
interface.
Exibir a barra de controles
 Exibir a barra de
ferramentas em:
– View > Toolbox
Criar a interface
 Arrastar no formulário:
– 2 Label;
– 1 Button;
– 2 TextBox.
Alterar a interface
 Alterar o valor de cada um dos rótulos;
 Selecione o rótulo e pressionar F4 para exibir
a janela de propriedades;
 Altere a propriedade Text.
Alterar a interface
Propriedade Text do Botão para
“Calcular IMC”;
Propriedade Text de um Label para
peso;
Propriedade Text de outro para
altura;
Propriedade (Name) de uma caixa de
texto para textBoxPeso;
Propriedade (Name) de outra para
textBoxAltura.
Onde está o código para criação
desta interface?
 Ver arquivo
Form1.Designer.cs
Onde está o código para criação
desta interface?
 Cada instância corresponde a um elemento
na interface.
Onde está o código para criação
desta interface?
 O código de preenchimento de cada valor de
propriedade é gerado automaticamente.
Associar o evento de clique ao botão
 Selecionar o botão;
 Pressionar F4 (propriedades);
 Selecionar o “raio” (lista de eventos);
 Clique 2 x na palavra Click.
Preencher o evento de clique de
botão
 Foi gerado o esqueleto do código que será
chamado quando o botão for clicado.
Preencher o evento de clique do
botão
Fim!
O programa gerado só roda em
ambiente Desktop
Passo a passo
Projeto em ASP.NET
para cálculo do IMC
sem usar Web Forms
IMC = peso / (altura * altura)
(Visual Web Developer)
Criar um novo Web Site
 File > New Web Site.
Escolher o tipo de web site
 Escolher web site vazio: Empty Web
Site!
Criar uma página HTML (index.htm)
 Criar um novo item;
 Menu WebSite > Add
New Item.
Criar uma página HTML
Criar a interface
Quando o usuário clicar no botão
submit, os dados serão enviados
para a página CalcularIMC.aspx
Criar a página CalcularIMC.aspx
 Criar um novo item;
 Menu WebSite > Add
New Item.
Criar a página CalcularIMC.aspx
 Desmarque a opção “Place code in separate
file”.
Escrever o código para cálculo de
IMC
 Limpar o que havia anteriormente na
página
Compilar o Web Site
 Menu Build > Build
Web Site
Verificar erros
 Cada linha com erros é indicada na tela de
Output.
Selecionar o Navegador Web
Calcular o IMC
Fim!
O programa gerado recarrega a
página toda ao executar
Passo a passo
Projeto em ASP.NET
para cálculo do IMC
sem usar Web Forms
e usando Ajax
(usando jQuery –
http://jquery.com)
IMC = peso / (altura * altura)
(Visual Web Developer – usar o
mesmo projeto!)
Criar a página index_ajax.html
 Criar um novo item;
 Menu WebSite > Add
New Item.
Criar a página index_ajax.html
Escrever o código de transferência
Ajax
Fim!
Observe que a biblioteca jQuery
pode ser “baixada”.
Por padrão, ela está disponível
apenas no VS 2010.
Passo a passo
Projeto em ASP.NET
para cálculo do IMC
usando Web Forms
(sem Ajax)
IMC = peso / (altura * altura)
(Visual Web Developer – usar o
mesmo projeto!)
Criar a página
CalcularImcWebForms.aspx
 Criar um novo item;
 Menu WebSite > Add
New Item.
Criar a página
 Escolher
Web
Form;
 Selecionar
a opção
“Place
code in
separate
file”;
Criar a interface
 Criar de maneira semelhante à interface
criada na versão Desktop;
Associar o evento de clique ao botão
 Clicar 2 x no botão;
 Será gerado um esqueleto de código.
Preencher o evento de clique do
botão
Comentar linha no arquivo
CalcularIMCWebForm.aspx (bug...)
Testar!
Fim!
Extras!
Para usar Ajax em um projeto Web
Forms:
– Crie um Ajax Web Form;
– Coloque dentro de um componente
UpdatePanel todos os componentes
ajaxificáveis;
Você também pode criar Web Services
em seu projeto.