Sua entrega, via Eureka, deve ser feita em uma pasta já criada no módulo Arquivos até o dia anterior à prova (25/11). Deixe seu arquivo público, ou seja, seus colegas de sala devem conseguir acessá-lo.

Neste exercício, desenvolveremos, de maneira colaborativa, exemplos relacionados ao framework ASP.NET Ajax.

1) Escolha um dos componentes do ASP.NET Ajax listados no link abaixo:
http://spreadsheets.google.com/viewform?formkey=dDJpYW1mZXlSYWlsZVJ0TTRPRkhaelE6MA
Antes de escolher seu componente, verifique se alguém já não o escolheu no link abaixo:
http://spreadsheets.google.com/ccc?key=0AqQ2GvdPZmGjdDJpYW1mZXlSYWlsZVJ0TTRPRkhaelE&hl=pt_BR.

2) Para o componente escolhido, faça uma página que seja a tradução da documentação disponível em:
http://www.asp.net/AJAX/AjaxControlToolkit/Samples/
Por exemplo, se você escolher o componente Accordion, deve fazer a tradução da página:
http://www.asp.net/AJAX/AjaxControlToolkit/Samples/Accordion/Accordion.aspx

Dica: o projeto que contém a versão em inglês da documentação está disponível em:
http://ajaxcontroltoolkit.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=33804#DownloadId=85830

3) Desenvolva mais uma página que contenha um exemplo diferente do exemplo que você traduziu, mas usando o mesmo componente. Coloque também uma explicação sucinta sobre como recriar o exemplo.

4) Por fim, crie uma terceira página com links para:
- vídeos;
- tutoriais;
e, principalmente,
- bugs
relacionados ao seu componente.

Chegamos a nosso último trabalho. Este trabalho é o único item de defesa que será solicitado nesta 4o Parcial.
Sua entrega será no dia 2/12 e defesa no dia 3/12.
Conforme já comentado em classe diversas vezes, a especificação é praticamente a mesma dos exercícios F03 e F06.
Desta vez, porém, não será cobrada a interface Windows Forms, apenas a interface Web em ASP.NET.
Além disso, o banco de dados Oracle deverá ser uma das bases do trabalho.

Algumas dicas referentes ao que será esperado na defesa, além dos requisitos já cobrados anteriormente:
* interface administrativa mínima;
* validações dos campos de inserção e edição;
* qualidade de código: ausência de código SQL na camada de visualização, layout em CSS, nomes de campos, documentação de código.
* testes de autenticação de usuário (login) durante a geração da proposta;
* interface comum às páginas do sistema.

O local de entrega ainda será definido.

Entretanto, este exercício servirá de base para nossa prova do 3o Bimestre.

Especificação do Exercício

****

O vídeo gerado em sala vai abaixo:

PARTE 01 do Vídeo de resolução parcial do exercício

PARTE 02 do Vídeo da resolução parcial do exercício

(salvar as duas partes em uma pasta e descompactar usando o programa 7zip)

Exemplo gerado em sala

1) Crie a tabela TbCategorias com os campos:

• id: int, chave primária, auto-incremento;
• nome: varchar(50);

2) Crie a tabela TbProdutos com os campos:

• id: int, chave primária, auto-incremento;
• nome: varchar(50);
• quantidade: int;
• idcategoria: int

3) Associe a tabela TbCategorias e a tabela TbProdutos a partir do campo idcategoria (chave estrangeira).

4) Faça uma página (NovaCategoria.aspx) que permita a criação de uma nova categoria.

5) Faça uma página (NovoProduto.aspx) que permita a inserção de um novo produto.

6) Faça uma página (ExcluirCategoria.aspx) que permita a exclusão de uma categoria a partir do id

7) Faça uma página (ExcluirCategoria2.aspx) que permita a exclusão de uma categoria a partir do nome

Faça uma página (PesquisarProdutos.aspx) que permita a pesquisa de um produto a partir do nome ou de parte dele.

9) Faça uma página (PesquisarProduto.aspx) que permita a pesquisa de um produto a partir do id da categoria.

10) Faça uma página (ExcluirTodos.aspx) que permita a exclusão de todos os produtos e de todas as categorias.

11) Faça uma página (ExibirTotal.aspx) que exiba a quantidade total de produtos. Dica: usar operador SUM do SQL.

12) Faça uma página (ExibirTotal2.aspx) que exiba a quantidade total de produtos de uma certa categoria. Dica: usar operador SUM do SQL.

13) Faça uma página (LimparEstoque.aspx) que permita que se limpe todo o estoque de produtos alterando o campo quantidade para valor zero.

A) No seu exercício de cálculo do IMC, você deve colocar os seguintes campos:

• CPF: validado através de um algoritmo qualquer de verificação de CPF (veja exemplos em C# na apresentação referente à aula, ou implemente o seu algoritmo);
• Data de Nascimento: deve indicar uma idade maior que 13 anos;
• Login: Deve ser único, não pode existir um igual no banco de dados;
• Senha: deve possuir pelo menos um número e um caractere especial qualquer (@, #, etc);
• Confirmação de senha: Deve ser igual à senha;
• CEP: deve ser no formato do CEP brasileiro;
• Email: deve ser um email válido;
• Url: deve ser uma url válida.

B) Armazene em banco cada uma das solicitações de IMC.

Importante: não se preocupe com a listagem dos dados, apenas realize a operação de INSERT.

No caso de sucesso, o usuário deve ser redirecionado para a página Formulario.aspx.

Nesta página, deve ser exibido o nome do usuário e uma mensagem de Olá.

IMPORTANTE: O objetivo deste exercício é trabalhar com o método Response.Redirect e com o uso de Session. Não utilize os componentes de login e autenticação já prontos.

B) Se o usuário tentar ir para a página Formulario.aspx e não tiver permissão, deve ser redirecionado para a página Erro.aspx, que possui a mensagem “Acesso Negado!”.

C) Utilizando a classe Application, implemente um chat em ASP.NET.

Este exercício deve ser mostrado para o Professor até o dia 3/9 no início da aula.

Caso o IMC seja maior que 30, o usuário deve ser avisado que está com sobrepeso.

Este exercício deve ser demonstrado para o Professor até 29/08 no início da aula, não é necessária sua entrega.

Neste exercício você vai testar o esqueleto de código fornecido, acessando, dentro de seu programa, alguns web services.
Hoje, vamos nos preocupar em CHAMAR os Web Services e TRATAR o resultado obtido.

Referências Gerais

• Exemplo de como passar o Web Proxy dentro da PUCPR – Windows Forms
• Exemplo de como passar o Web Proxy dentro da PUCPR – Web
• Exemplos de acesso a conteúdo XML;

Referências Serviços SOAP

• Aula 26 – Web Services
• Passo a passo de criação e consumo de Web Services – Serviço de Busca no Google;

Referências Serviços REST / XML

• Google:
  
  • Explicação sobre o serviço de notícias do Google:
    • http://www.google.com/support/news/bin/answer.py?answer=59255&hl=pt
  • Exemplo de chamada ao serviço do Google:
    • http://news.google.com/news?ned=pt-PT_pt&q=Lula&output=rss
• Bit.ly:
  • Explicação sobre o serviço de simplificação de url Bit.Ly:
    • http://bit.ly/docs
  • Exemplo de chamada ao serviço:
    • http://bit.ly/api?url=http://www.uol.com.br
• Wikipedia:
  • Explicação sobre o serviço da Wikipedia:
    • http://en.wikipedia.org/w/api.php
  • Exemplo de chamada ao serviço:
    • http://pt.wikipedia.org/w/api.php?action=query&list=search&srsearch=Java&format=xml
• GeoNames:
  • Explicação sobre o serviço do GeoNames:
    • http://www.geonames.org/export/web-services.html#timezone
  • Exemplo de chamada ao serviço:
    • http://ws.geonames.org/timezone?lat=-25&lng=-49&style=full
• UOL Clipping:
  • Explicação sobre o serviço do UOL Clipping:
    • http://clipping.busca.uol.com.br/monte.jhtm
  • Exemplo de chamada ao serviço:
    • http://rss.noticias.busca.uol.com.br/pucpr-vestibular
• Mapas do Yahoo!:
  • Explicação sobre o serviço de imagens de mapa do Yahoo!
    • http://developer.yahoo.com/maps/rest/V1/
  • Exemplo de chamada ao serviço:
    • http://local.yahooapis.com/MapsService/V1/mapImage?appid=YD-4g6HBf0_JX0yq2IsdnV1Ne9JTpKxQ3Miew–&city=Curitiba

• Exemplos de acesso a conteúdo XML – VER ABAIXO, OS FRAGMENTOS DE CÓDIGO PARA REFERÊNCIA;
• Exemplo de como ler um arquivo XML (01-LerArquivoXML.aspx):
• using System.Xml;…
  
  • XmlReader reader = XmlReader.Create(Server.MapPath(”.”) + “/Filmoteca.xml”);
    
    // Percorra cada nó de um arquivo XML
    while (reader.Read())
    {
    Resultado.Text += “* Nome do Elemento:” + reader.Name +
    ” Valor do Elemento: ” + reader.Value +
    ” Tipo do Elemento: ” + reader.NodeType + “<br>”;
    }
• Exemplo de como extrair uma informação de um arquivo XML (02-ExibirTituloDeFilme.aspx):
  • // Configurações de leitura do XML
    XmlReaderSettings settings = new XmlReaderSettings();
    // Ignora comentários
    settings.IgnoreComments = true;
    // Ignora espaços em branco
    settings.IgnoreWhitespace = true;
    // Ignora instruções de processamento
    settings.IgnoreProcessingInstructions = true;
    
    // Cria o leitor de XML
    XmlReader reader = XmlReader.Create(Server.MapPath(”.”) + “/Filmoteca.xml”, settings);
    
    // Percorra cada nó de um arquivo XML
    while (reader.Read())
    {
    // Se for o nó nome
    if ((reader.Name == “nome”) && (reader.NodeType == XmlNodeType.Element))
    {
    Resultado.Text += reader.ReadString() + “<br>”;
    }
    }
• Exemplo de como ler o valor de um atributos (03-ExibindoValorAtributo.aspx):
  • // Configurações de leitura do XML
    XmlReaderSettings settings = new XmlReaderSettings();
    // Ignora comentários
    settings.IgnoreComments = true;
    // Ignora espaços em branco
    settings.IgnoreWhitespace = true;
    // Ignora instruções de processamento
    settings.IgnoreProcessingInstructions = true;
    
    // Cria o leitor de XML
    XmlReader reader = XmlReader.Create(Server.MapPath(”.”) + “/Filmoteca.xml”, settings);
    
    
    // Percorra cada nó de um arquivo XML
    while (reader.Read())
    {
    // Se for o nó nome
    //Resultado.Text += reader.Name + “<br>”;
    if ((reader.Name == “filme”) && (reader.NodeType == XmlNodeType.Element))
    {
    // Se o reader tiver atributos
    if (reader.HasAttributes)
    {
    Resultado.Text +=  reader["id"] + ” – “;
    // Vá lendo até chegar em nome
    reader.ReadToDescendant(”nome”);
    Resultado.Text += reader.ReadString() + “<br>”;
    // Retorna ao elemento.
    // Necessário quando se trabalha com atributos
    reader.MoveToElement();
    }
    }
    }

Referências Serviços REST / JSON / JSONP

• http://docs.jquery.com/Ajax/jQuery.getJSON

Enunciado

1. [Serviços  SOAP] Crie um programa que acesse aos serviços disponíveis nos seguintes endereços. Preferencialmente, faça uma página para cada serviço:
   • a) Conversão de Temperatura:
   • Sugestão de método: ConvertTemp
   • http://www.webservicex.net/ConvertTemperature.asmx
   • b) Consulta de CEP:
     • http://www.equipea.com.br/consultacep/consultacep.asmx?op=RetornaValores
     • Sugestão de método: RetornaValores
   • c) Busca de letras de música:
     • http://lyricwiki.org/server.php#
     • Sugestões de métodos: getSongResult, searchArtists, etc.
   • d) Geração de anagramas:
     • http://services.aonaware.com/CountCheatService/CountCheatService.asmx
   • e) Definição de termos:
     • http://services.aonaware.com/DictService/DictService.asmx
     • Sugestão de método: define
   • f) Serviço SOAP à sua escolha! Sugestões de busca no Google: SOAP API, SOAP filetype:asmx, SOAP NuSOAP, etc.
2. [Serviço REST - retorno em XML] Crie uma interface de acesso ao serviço de notícias do Google (ver http://www.google.com/support/news/bin/answer.py?answer=59255&hl=pt). Esta interface deve possuir uma caixa de texto na qual o usuário seleciona qual é a palavra-chave a ser procurada e um botão que realiza a busca. Exemplo de chamada ao serviço do Google: http://news.google.com/news?ned=pt-PT_pt&q=Lula&output=rss . Dessa vez, você deverá exibir como resposta apenas o título do link e o próprio link.
3. [Serviço REST - retorno em XML]  Crie uma interface de acesso ao serviço de consultas à Wikipedia (ver http://en.wikipedia.org/w/api.php). Chame o método “list=search” responsável por, dada uma palavra-chave, realizar uma busca na Wikipedia por termos semelhantes. Esta interface deve possuir uma caixa de texto na qual o usuário seleciona qual é o termo a ser buscado, e um botão que chama o serviço. Exemplo de chamada ao serviço da Wikipedia: http://pt.wikipedia.org/w/api.php?action=query&list=search&srsearch=Java&format=xml. Dessa vez, exiba apenas o título dos termos relacionados (atributo title da tag p).
4. [Serviço REST - retorno em XML]  Crie uma interface de acesso ao serviço de informações geográficas GeoNames (ver http://www.geonames.org/export/web-services.html e http://www.geonames.org/export/web-services.html#timezone). Chame o método “timezone”, o qual dada uma coordenada geográfica, retorna qual é a zona horária associada à coordenada. Esta interface deve possuir duas caixas de texto nas quais o usuário indica qual é a latitude e a longitude e um botão que chama o serviço. Exemplo de chamada ao serviço: http://ws.geonames.org/timezone?lat=-25&lng=-49&style=full. Dessa vez, exiba o nome do país e a hora atual.
5. [Serviço REST - retorno em XML]  Crie uma interface de acesso ao serviço de clipping de notícias do UOL (ver http://clipping.busca.uol.com.br/monte.jhtm). Este serviço permite a busca de notícias a partir de um conjunto de palavras-chave. Sua interface deve possuir, por exemplo, uma caixa de texto com as palavras que devem ser incluídas. Também deve ter um botão de chamada ao serviço. Exemplo de chamada ao serviço: http://rss.noticias.busca.uol.com.br/pucpr-vestibular. Dessa vez, você deverá exibir como resposta apenas o título do link, o próprio link e a descrição.
6. [Serviço REST - retorno em XML]  Crie uma interface de acesso ao serviço de imagens de mapa do Yahoo! (ver http://developer.yahoo.com/maps/rest/V1/). Este serviço permite o retorno da URL de uma imagem da posição no mapa de uma cidade, endereço, país, etc. Sua interface deve possuir, por exemplo, uma caixa de texto indicando a cidade que está sendo buscada. Também deve ter um botão de chamada ao serviço. Exemplo de chamada ao serviço: http://local.yahooapis.com/MapsService/V1/mapImage?appid=YD-4g6HBf0_JX0yq2IsdnV1Ne9JTpKxQ3Miew–&city=Curitiba. Dessa vez, você deverá exibir como resposta a imagem obtida.  Se preferir usar o serviço de mapas do Google, use o serviço disponível em: http://code.google.com/apis/maps/documentation/staticmaps/
7. [Serviços JSON/JSONP] Crie um programa Web que acesse um dos serviços disponíveis na lista a seguir:  Sorteio de número aleatório - http://json-random.appjet.net/, Extração de informações sobrei imagens – http://img2json.appspot.com/,  Horário – http://json-time.appspot.com/, Informações do cabeçalho HTTP – http://json-head.appspot.com/,  Busca no Twitter – http://apiwiki.twitter.com/ Twitter-API-Documentation, Informações sobre url – http://bit.ly/docs,  Banco de dados simplificado – http://tinydb.org/, Yahoo Answers – http://developer.yahoo.com/answers/V1/questionSearch.html , Geonames – http://www.geonames.org/export/JSON-webservices.html,  Google Planilha – http://code.google.com/apis/gdata/samples/spreadsheet_sample.html, Google Agenda – http://code.google.com/apis/gdata/samples/cal_sample.html,  Yahoo! Artist Search – http://developer.yahoo.com/search/audio/V1/artistSearch.html

Conforme combinado ontem, deixemos então a entrega do F05 em 2 partes.

A pasta de entrega da 1a parte já foi criada lá no Eureka.

Desta vez, ao fim da geração da proposta, você deve armazenar a proposta feita no Banco de Dados de sua escolha. Em outro momento, o usuário poderá retornar à proposta preenchida anteriormente se desejar para modificar seus dados, ou mesmo excluir a proposta feita sua proposta.

Após a finalização da proposta, o administrador do sistema pode acessá-la e conferir o custo gerado automaticamente para cada proposta  e os dados do usuário. Por segurança, um administrador também pode excluir uma proposta feita. Neste caso, ele deve fornecer o motivo do cancelamento e, da próxima vez que o usuário acessar o sistema, este motivo deve ficar claro.

Dica 1: mais alguns exemplos de acesso ao banco que podem ajudar você a resolver este problema.

Dica 2: Lembre-se: a interface gerada no exercício F02 era Web. Você deve continuar usando uma interface web. O acesso às classes de banco de dados será semelhante à abordagem que você usa para interfaces Windows Forms. Exemplo:

<%@ Page Language="C#"  %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%
SqlConnection conn = new System.Data.SqlClient.SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=C:\Temp\temp.mdf;Integrated Security=True;Connect Timeout=30;User Instance=True");

conn.Open();

System.Data.SqlClient.SqlCommand select = new SqlCommand("select * from t1", conn);

SqlDataReader dr = select.ExecuteReader();

while(dr.Read())

{

Response.Write(dr["id"].ToString() + " - " + dr["nome"].ToString() + "<br>");

}

conn.Close();

%>

Data de entrega: 29/05/2009

Oks,
Bruno

Ao invés de repetirmos nossas classes responsáveis por este cálculo é recomendável o uso de uma Class Library (dll) para centralização de nossas classes compartilhadas.

Segue a seguir, um exemplo de utilização de uma class library para uma interface Web:

• Exemplo de class lib- abrir no VS2008 ou Visual Studio Express 2008;
• Exemplo de utilização desta class library em interface Web. Esta interface web usa interação via Drag e Drop implementada com o framework jQuery Ui, reforçando as sugestões apresentadas na última aula. Abrir do VS2008 ou Visual Web Developer.

A mesma interface também deverá ser criada na versão Web de maneira simplificada.

Objetivos

• Conhecer os componentes da biblioteca Windows Forms e entender sua aplicação em uma situação real;
• Aplicar os conceitos de lógica de programação na geração de um frontend gráfico;
• Discutir possibilidades de interação alternativas ao tradicional utilizando, de maneira criativa, os componentes da biblioteca;
• Começar a organizar o código de maneira que fique fácil a interação de uma interface cliente com um servidor.

Referências

• Lista de referências sobre os componentes Windows Forms;
• Documentação Windows Forms do MSDN;
• Exemplos de uso de cada um dos componentes – versão 0.1;
• Canivete .Net 2009;
• Sobre a biblioteca jQuery UI.

Procedimento

Você criará uma interface que permita o planejamento de um evento de velório em seu projeto de cemitério. Nesta interface, o “futuro cliente” do velório deverá planejar o evento como um todo: localização de seu velório, tempo total, decoração e posicionamento dos convidados mais importantes. Outra opção será o planejamento do velório de um parente recém-falecido.

Assim, duas interfaces deverão ser geradas: a primeira, construída para Desktop deve ter uma responsividade rápida e ser focada, necessariamente à interação em totens e planejamento de um evento imediato de um parente. A segunda, voltada para Web, deve ser rápida e simples de usar, sendo mais aplicável a um planejamento individual a longo prazo.

O algoritmo de cálculo de preço deverá ser criado em uma biblioteca de classes (class library) que será compartilhada pelas duas interfaces.

Importante: não será necessário e nem desejável a persistência de qualquer dado ou configuração de seu sistema, ou seja, quando o programa for fechado toda a simulação é perdida!

Sugere-se fortemente o uso da biblioteca jQuery para criação da versão Web de seu sistema. Outra sugestão: se desejar uma interface um pouco mais rica e alguns controles prontos associados ao jQuery, use também o seu complemento jQuery UI. Em anexo, apresentação referente ao jQuery UI. Você tem a liberdade, porém, de usar qualquer outro framework para sua interface Web ou mesmo usar “JavaScript puro”.

1) O primeiro passo é a escolha do local do evento. O cliente deverá selecionar dentre um conjunto de opções possíveis qual é o auditório / espaço que gostaria que a cerimônia fosse realizada. Cada local possui restrições diferentes quanto ao formato do local,  lotação máxima e flexibilidade da disposição dos objetos. Por exemplo, podem existir locais com formato retangular como uma sala, outros com formato arredondado como um teatro, etc. A lotação máxima pode variar também dependendo do ambiente. Alguns locais podem ter objetos fixos como poltronas fixas. Outros podem ter objetos que podem ser movidos como cadeiras.

O usuário deve ter a opção de escolher um local dentre 5 opções diferentes. Cada opção tem um preço diferente.

2) Em alguns tipos de ambiente podem ser apresentados objetos móveis como: púlpitos, cadeiras, mesas, elementos de decoração (flores, tapetes, velas), Outros elementos são fixos e não podem ser movidos. Os objetos móveis podem ter sua posição planejada. Há porém, algumas restrições:

• um objeto não pode ocupar o lugar de outro;
• dependendo do objeto, deve-se manter uma distância mínima do falecido, que também, dependendo do ambiente, deve ser possível de movimentação;
• alguns objetos são incompatíveis em um mesmo ambiente. Por exemplo, flores de cores diferentes, tapetes de cores diferentes, etc;
• há um limite na quantidade de alguns objetos;

A quantidade de objetos disponíveis também é determinante do preço final. Há também alguns objetos opcionais.

Devem existir pelo menos 7 tipos diferentes de objetos.

3) Por fim, o usuário deverá listar os principais convidados e parentes do evento. Esta lista deve ser usada para:

• Definir o assento (cadeira, poltrona, etc) de alguns convidados mais importantes;
• Indicar a ordem e horário de discursos.

4) Exceto no caso da lista de convidados, qualquer modificação provoca uma alteração no preço. Esta alteração deve sempre estar visível na interface e atualizada automaticamente a partir de qualquer mudança.

Critérios de Correção

O  seu programa, nesta fase, estará sendo avaliado em relação aos seguintes critérios:

• Atendimento aos requisitos acima;
• Uso dos componentes padrão disponíveis no Visual Studio / jQuery que encaixem melhor em cada situação;
• Semelhança da interface na versão Web e na versão Desktop;
• Originalidade na criação da interface;
• Criatividade nas possibilidades de interação;
• Facilidade de uso;
• Validações de dados simples;
• Centralização do algoritmo de cálculo do custo em uma class library;
• Código-fonte sem cópias de colegas ou de códigos da Internet/livros sem uma citação clara.

Os seguintes critérios não terão importância nesta avaliação, porém serão discutidos nas avaliações posteriores:

• Organização do código usando as patterns mais adequadas para cada situação;
• Rigidez na criação das classes e otimização de código;
• Criação de novos componentes;
• Aderência das regras de negócio em relação a situações reais;
• Validações de dados complexas.

Defesa e Entrega

Este projeto deverá será entregue até o dia 24/04/2009 - 14:00h. Trabalhos entregues em atraso serão desconsiderados.

No dia 25/04/2009, cada dupla terá três minutos para apresentar e defender o seu trabalho. A ordem de apresentação será fornecida no dia anterior até as 17:00h.

Ponto extra: todos os alunos que entregarem o que já fizeram até o dia 15/04/2009 receberão 0,5 pontos extras na nota final. Nesta entrega, seu projeto pode estar incompleto e com falhas, mas deve transmitir a segurança que você vai conseguir terminá-lo.

]]> http://www.brunocampagnolo.com/2009tp/2009/03/28/exercicio-f03-planejador-de-velorio/feed/ 2 http://www.brunocampagnolo.com/2009tp/2009/03/26/exercicio-o02-instanciacao-e-uso-de-componentes-visuais/ http://www.brunocampagnolo.com/2009tp/2009/03/26/exercicio-o02-instanciacao-e-uso-de-componentes-visuais/#comments Thu, 26 Mar 2009 23:11:21 +0000 admin http://www.brunocampagnolo.com/2009tp/?p=121 Neste exercício você resolverá um problema que necessitará que você crie componentes visuais em tempo de execução. Este é um exercício opcional. Lembre-se: exercícios opcionais podem (ou não) valer nota. Mas, geralmente, são usados na geração dos exercícios de prova.

Procedimento

Criar no Visual Studio 2008 um novo Projeto, através do menu File > New Project.

Cuidado: selecionar a linguagem Visual C# e a opção Windows Forms ao criar o Projeto!

Lembre-se de salvar seu projeto na pasta C:\Temp, caso você esteja trabalhando na PUCPR.

Observe o formulário da figura abaixo.

Obtenha seu código de aluno no link.

Obter valor de x após descobrir seu código de aluno

Crie um programa para que você consiga gerar, dinamicamente, um conjunto de controles X a partir de um certo número de linhas e colunas fornecidas a partir de uma caixa de texto. Por exemplo, se X for a TextBox, seu exercício deverá ser semelhante à imagem abaixo.

Entregue seu exercício aqui.

Neste exercício você vai criar uma calculadora simples em C#. Essa calculadora vai realizar as quatro operações matemáticas quando você clica em quatro botões diferentes e, alternativamente, vai permitir a execução da operação indicada em uma ComboBox (também chamada de DropDownList, caixa de combinação, caixa de seleção única, etc).

Este exercício deve ser desenvolvido em classe e servirá, principalmente, para você conhecer o Visual Studio 2008.
O resultado esperado como resposta para o exercício está em anexo.

Objetivos

• Conhecer as nossas principais ferramentas de trabalho neste semestre:
  • C#;
  • Visual Studio 2008.

• Conhecer o Visual Studio 2008 e a Plataforma .Net através de um exemplo simples, reconhecendo alguns dos principais paradigmas do desenvolvimento RAD;

• Iniciar a compreender as diferenças entre o C# e o Java enquanto linguagens;
• Reconhecer que no C# todos os controles são objetos e conseguir diferenciar claramente qual é a classe de cada objeto;

• Entender a criação automática de eventos através da interface gráfica do Visual Studio 2008;
• Familiarizar-se com a sintaxe do C# e com a facilidade de acesso ao help online;
• Aplicar as funções de conversão de dados através da classe Convert, etc.
• Conhecer os controles TextBox e ComboBox;
  
• Entender o significado do método ToString.

Referências

• Ajuda dos métodos:
  • ToInt32 da classe Convert: http://msdn2.microsoft.com/pt-br/library/system.convert.toint32(en-us).aspx;
  • ToString da classe Object;
• Ajuda das propriedades:
  • Text do controle TextBox e do controle Label;
  • Items do controle ComboBox;
  • SelectedItem do controle ComboBox: http://msdn2.microsoft.com/pt-br/library/system.windows.forms.combobox.selecteditem(en-us).aspx
    
  • NewLine da classe Environment: http://msdn2.microsoft.com/pt-br/library/system.environment.newline(en-us).aspx
    
• Ajuda dos eventos:
  • Click do controle Button;
  • SelectedIndexChange do controle ComboBox.
    

Preparação e Dicas

• Criar no Visual Studio 2008 um novo Projeto, através do menu File > New Project.
• Cuidado: selecionar a linguagem Visual C# e a opção Windows Forms ao criar o Projeto!
• Acessar a ajuda das funções citadas na referência. Clique F1 na palavra que deseja acessar para acessar o Help Online / Offline.
  
• Lembre-se de salvar seu projeto na pasta C:\Temp, caso você esteja trabalhando na PUCPR.
• O operador de concatenação de texto no C# é o “+”;
• Se você decidir usar a estrutura switch em algum momento, observe que o switch do C# aceita Strings em seus case;
• As principais propriedades de um controle são acessíveis via Smart Tag e seus principais eventos clicando duas vezes sobre o controle.
  

Procedimento

1. O resultado esperado do procedimento abaixo está anexo.
2. Criar uma interface com: duas caixas de texto chamadas Valor1 e Valor2, um botão com o texto Somar ou “+”, um botão com o texto Subtrair ou “-”, um botão com o texto Multiplicar ou “*” e um botão com o texto Dividir ou “/”. Criar também uma ComboBox com quatro elementos representando cada uma das funções. A resposta ficará acumulada em uma caixa de texto de mais de uma linha;
3. Associar ao evento de clique (Click) de cada um dos botões à respectiva função;
4. Exibir o resultado da operação em uma caixa de texto de mais de uma linha;
   
5. Associar ao evento de mudança do valor da ComboBox (SelectedIndexChange) a execução imediata da operação matemática sem necessitar da chamada ao botão;

Questões

Responder às questões abaixo no link (http://spreadsheets.google.com/viewform?formkey=cEQ1eGlGS0U5b2oxQThyZEk1UlRJY2c6MA..) ou abaixo e manter uma cópia das respostas com você.

1. Cole o código responsável por implementar as operações que você implementou. Seu código está dentro do arquivo com extensão .cs.
2. Qual é a extensão do arquivo criado após a compilação?
   
3. É um projeto do tipo Windows Forms ou Web Forms?
4. Qual é a plataforma que precisa estar instalada na máquina que vai executar o programa?
5. O que é o CLR?
   
6. O programa em C# é convertido para qual representação intermediária antes de ser executado pelo CLR?
   
7. Localize em sua aplicação todo o código em C# gerado para criação, posicionamento e formatação de uma caixa de texto. Cole esse código abaixo. Este código está dentro da função InitializeComponent.
8. Os comandos obtidos na questão anterior são de uma linguagem declarativa ou em uma linguagem imperativa?
   
9. Escolha 2 propriedades quaisquer da caixa de texto diferentes das que você trabalhou e, através da documentação, cite qual é a sua utilidade. Coloque o link para a página que você conseguiu essa documentação.
10. EXTRA! Refaça o mesmo exercício em WPF e perceba a diferença entre as abordagens.
11. EXTRA! Refaça o mesmo exercício em HTML/jQuery e perceba a diferença entre as abordagens.

Relatório

Responder às questões acima no link (http://spreadsheets.google.com/viewform?formkey=cEQ1eGlGS0U5b2oxQThyZEk1UlRJY2c6MA..) ou abaixo.

Também não esqueça de manter uma cópia destas respostas com você.

Especificação do Exercício

Resposta aqui e aqui

Edite o arquivo do exercício e faça o que se pede
Se preferir, edite o arquivo no JS Bin.

Cada exercício é um comando individual e é independente do anterior.
Você deve resolver o exercício usando a biblioteca jQuery.

1. Exiba uma mensagem qualquer cada vez que o usuário clica em um parágrafo qualquer
2. Ao carregar a página deixe cada 1o parágrafo de uma cor diferente
3. Ao clicar nas abreviaturas, sua cor deve ser trocada
4. Deixe em itálico todos os parágrafos cuja classe é igual a texto apenas quando o usuário passar com o mouse sobre eles

Responda aqui.

Calculadora.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Page</title>
<script type="text/javascript" src="calculadora.js">
</script>
</head>
<body onload="configurar()">
  <form action="">
  <p>
    <input id="txtVal1" type="text" />
  </p>
  <p>
    <input id="txtVal2" type="text" />
  </p>
  <p>
    <input id="btMais" type="button" value="+" />
    <input id="btMenos" type="button" value="-" />
  </p>
  <p>
    <input id="btVezes" type="button" value="*" />
    <input id="btDividido" type="button" value="/" />
  </p>
  <p>
    <select id="slOperacoes" name="D1">
      <option></option>
    </select>
    <div id="resultado"></div>
  </p>
  <br>
  <br>
  </form>
</body>
</html>

Calculadora.js

function somar()
{
  // val1 reflete o objeto caixa de texto txtVal1
  var val1 = document.getElementById("txtVal1");
  // val1 reflete o objeto caixa de texto txtVal2
  var val2 = document.getElementById("txtVal2"); 

  // Realiza a operação.
  var resultado = parseInt(val1.value) +
                  parseInt(val2.value);
  //alert(resultado);
  // res reflete a div cujo id é resultado
  var res = document.getElementById("resultado");
  // escreve o resultado na div
  res.innerHTML = resultado;
}
function configurar()
{
  // Configura o botão, associando a função somar ao clique do botão
  var btMais =
      document.getElementById("btMais");
  btMais.onclick = somar;
}

Leia com atenção o enunciado e responda o exercício acima nos links:
http://drop.io/hidden/rlxgdspvvjdtue/upload
e
http://spreadsheets.google.com/viewform?formkey=cEQ1eGlGS0U5b2ozRE13R0h5RHcwSHc6MA