Baixe o app para aproveitar ainda mais
Esta é uma pré-visualização de arquivo. Entre para ver o arquivo original
Programação para internet rica/16PPIR_aula08_doc01.pdf Actionscript – interagindo com o filme O Flash vem melhorando em vários aspectos em suas versões inclusive na linguagem de programação dele. A versão 3 do Actionscript trás mudanças na forma de se interagir com os elementos do filme, iremos nos ater apenas a essa versão. Vamos dar uma olhada na estrutura da linguagem e exemplificar o seu uso. Variáveis e constantes Existe um conceito que muitas vezes gera confusão, constante é a informação que está armazenada em uma variável ou um valor fixo em um programa, o número 4 (quatro) sempre será o número 4, assim como a palavra "sim" também, nós temos no exemplo uma constante do tipo numérico, um inteiro, e uma do tipo texto, temos ainda o valor lógico. As variáveis são criadas para armazenar tipos diferentes de constantes, existem variáveis que não permitem que seu conteúdo seja alterado, elas são variáveis constantes por causa disso, são criados símbolos para representar uma informação constante. As variáveis constantes são representadas normalmente em maiúsculas por convenção, um programador saberá que se trata ao vê-la em um código. Sintaxe: const JOGADORES = 5; Definindo variáveis: var nomeDaVariavel: Tipo: valor; Tipos: Object, Number, int, uint (inteiro sem sinal), String e Bollean O AS também trabalha com tipos complexos, os da própria linguagem e os criados pelo desenvolvedor. Temos: MovieClip: um símbolo de clipe de filme TextField: um campo de texto de entrada ou dinâmico SimpleButton: um símbolo de botão Date: informações sobre um momento único no tempo (uma data e hora) Podemos verificar se uma variável está guardando um tipo de dado através da instrução "is". if (minhaVar is Number) { trace("É um número."); } else { trace("NÃO é um número."); } Pacotes Podemos criar pacotes em AS3 para que não existam conflitos com os nomes das classes criadas pelo desenvolvedor, isso facilita às pessoas que já estão acostumadas com programação Java. É criado um espaço para nomes ao se criar um pacote. Podemos definir diretamente espaço para nomes, que nesse caso não serão pacotes. Exemplo: package meuPacote { public class minhaClasse { public var minhaPropriedade: String; public function meuMetodo() { trace(minhaPropriedade + " from meuMetodo ()"); } } } O uso de classes que estão empacotes distintos exige que seja realizada a importação explicita através da instrução import. Todas as classes do pacote: import meuPacote.*; Uma classe específica: import meuPacote.minhaClasse; Podemos Instanciar um objeto do tipo de uma classe de outro pacote de duas formas, primeiramente podemos fazer a importação da classe das formas mostradas anteriormente e instanciar diretamente, ou fazemos a instanciação usando o caminho completo da classe. Caso 1: import meuPacote.minhaClasse; var meuObjeto: minhaClasse = new minhaClasse(); Caso 2: var meuObjeto: meuPacote.minhaClasse = new meuPacote.minhaClasse(); Espaços para nomes Os espaços para nomes fornecem controle sobre a visibilidade das propriedades e dos métodos criados. Existem os modificadores de acesso public, private, protected e internal como espaços para nomes embutidos. O AS3 possibilita a criação de espaços para nomes customizados da mesma forma que é usada em XML, usando-se um URI. Criando um espaço para nomes: namespace meuEspaco = "http://www.estacio.br/ria/flash/classes"; Nomes criados sem endereço usam uma informação interna não acessível, exemplo: namespace meuEspaco; As classes definidas após a criação do espaço estarão nele e exigem que se declare que seja informado antes de seu uso. use namespace meuEspaço; Classes Podemos criar classe para podermos usar nos projetos, a orientação a objetos permitiu que o desenvolvimento evoluísse para um paradigma que facilita a manutenção e a evolução dos sistemas, quando esse são bem construídos. Exemplo public class minhaClasse { public var minhaPropriedade: String; public function meuMetodo() { trace(minhaPropriedade + " from meuMetodo ()"); } public minhaClasse(){ minhaPropriedade = "Um início"; } } A linguagem usa a notação de ponto para acesso aos métodos e propriedades públicas. Exemplo: Var meuObjeto: minhaClasse = new minhaClasse(); meuObjeto.minhaPropriedade = "Continuando"; meuObjeto.meuMetodo(); Estruturas da linguagem As estruturas da linguagem seguem o mesmo padrão do Javascript e os operadores também, existem algumas pequenas diferenças. Iremos ver as duas repetições de coleção que existem na lingaugem, "for..in" e " for each..in ". Ambos permitem que passemos por coleções e propriedades de objetos, nenhum dos dois permite que se ande por propriedades de classes definidas pelo usuário como class, porém o primeiro permite que se passe pelas propriedades de classe dinâmica. Interagindo com os objetos da tela Podemos interagir com os elementos da tela com Actionscript, para fazê-lo, o elemento deve ser convertido para botão ou clipe de filme, porque eles podem receber nomes em suas cópias no palco. A versão três da linguagem trouxe uma forma de atribuição de eventos diferente das anteriores. Os eventos existentes são similares aos vistos em Javascript, quando podemos clicar com o mouse ou apertar uma tecla sobre um elemento e ele percebe a ação. Iremos programar para as interações que desejamos que o nosso filme reaja. Janela para a codificação das ações O código fica associado a uma camada, ele fará referência ao símbolo desejado, ligando-o ao evento específico. Poderemos colocar o código em cenas diferentes ou dentro de símbolos. Iremos começar com botões que fazem um retângulo andar para a direita e esquerda. Tela inicial com dois botões e um retângulo Faremos dois retângulos com cantos arredondados (Ferramenta Primitiva de Retângulo) e um normal. Os dois primeiros serão convertidos para o símbolo Botão e o de baixo para Clipe de Vídeo. Os nomes serão respectivamente, btn1, btn2 e Ret1. Podemos colocar o código na camada onde estão os elementos, mas o correto é colocar em outra camada, podem ser criadas quantas camadas forem necessárias para que exista uma maior organização, facilitando a manutenção do sistema. Criada a camada para o código Para que seja aberta a janela para que sejam colocadas as ações, clicamos com o botão direito sobre a camada ação no quadro 1, escolhemos a opção ação e será exibida a janela de ações. Código para fazer o retângulo andar com o clique do botão Vamos entender o código: 1) Associamos um evento com um símbolo através de um escutador de eventos. Btn1.addEventListener 2) Devemos especificar qual evento que estamos tratando Btn1.addEventListener(MouseEvent.CLICK 3) Será informada a função que será chamada quando o evento for disparado Btn1.addEventListener(MouseEvent.CLICK, movendoEsq); 4) Criamos a função que sera disparada pelo evento Function movendoEsq( event: MouseEvent){ } 5) Criamos a função que será disparada pelo evento Controlando Cenas As ações podem ser usadas em botões para controlar as cenas, podemos fazer um site inteiro usando essa funcionalidade, cada parte do site ficaria em uma cena diferente ou em um clipe de filme específico. Código em que o botão leva para outra cena O método gotoAndPlay passa o controle da execução do filme para a programação, o primeiro parâmetro é o número do quadro que passará a ser executado e o segundo é o nome da cena em que o quadro está. Além do método acima, pode ser usado o gotoAndStop, ele posiciona no quadro específico e o filme continua parado. Programação para internet rica/Aula_01 (2).ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 1-A evolução da Web * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Conteúdo Programático desta aula Criação da World Wide Web; A evolulução; O XHTML; O evento Web 2.0 e a transformação constatada; Futuro da Web. * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A criação da Web Tim Berners-Lee publica uma proposta junto com Robert Cailliau de criação de documentos com hipertexto. Requisitos do CERN: Acesso remoto; Heterogeneidade; Descentralização; Acesso aos dados; Links (privado e dinâmico); “Sinos e assobios”. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A Primeira Criação Tim Berners-Lee desenvolve: Primeiro navegador; Primeiro servidor Web; Proposta do HTML; Protocolo HTTP. Next A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Tela do Next Step A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA 1991 1995 1994 Alguns Fatos 1989 1990 Proposta da WWW Revisão da proposta Mosaic Mosaic Communications (Netscape) Internet Explorer * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA 2002 2005 2004 Continuando 1999 2000 API XMLHttpRequest Outlook Web Access Ajax no Firefox Ajax no Safari Ajax nos Konqueror e Opera * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Outlook Web Access A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA XML e HTML A versão original do HTTP foi proposta em 1991, permitindo que se realizasse uma requisição de uma página e ela fosse devolvida pela servidor Web. Tim Berners-Lee faz a proposta do HTML 1.0 com 20 marcações. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA CGI (Common Gatway Interface) As página passam a permitir que os usuários enviem informações. HTML 2.0 inclui funcionalidades, entre elas o formulário. O Perl permite que os programadores tratem as informações enviadas. A pasta cgi-bin é o local padrão para os códigos. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA HTML 3 (3.2) Style Sheet; Empresas dos Navegadores participam; Tabelas; Applets Java; Inclusão do DTD. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A evolução continua Style Sheet (Folha de Estilo) Empresas dos Navegadores participam Tabelas Applets Inclusão da DTD DOM (Document Object Model) CSS – Cascate Style Sheet Tag NOFRAMES Frame inline (IFRAME) A tag TABLE recebe novos elementos Versão do Html Algumas Características 3.0 (3.2) 4.0 (4.0.1) * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA XHTML Baseado no HTML 4; É recomendação W3C desde 2000; Verificação e validação de códigos; Facilidade de implementação de novas funcionalidades; Acelera a interpretação feita pelo navegador; Facilita a criação de navegadores para outros equipamentos. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Web 2.0 "Web 2.0 é a mudança para uma internet como plataforma, e um entendimento das regras para obter sucesso nesta nova plataforma. Entre outras, a regra mais importante é desenvolver aplicativos que aproveitem os efeitos de rede para se tornarem melhores quanto mais são usados pelas pessoas, aproveitando a inteligência coletiva" Tim O’Reilly A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Web 2.0 - Princípios Web 2.0 usa a rede como uma plataforma. Usuário recebe, manipula e controlados os dados no site. Arquitetura participativa na qual o usuário pode adicionar ou editar total ou parcialmente uma aplicação de acordo com suas necessidades e experiência. Uma interface rica, interativa e amigável, baseado em Ajax ou estruturas similares. Modelos de negócios enxutos facilitados pelo gerenciamento de conteúdos e serviços. Fim do Ciclo de software ( versão beta ) Alguns aspectos de rede social. Algumas interfaces gráficas, como gradientes e cantos arredondados . * A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Comparando A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA O que acontece na Web 2.0 Conteúdo gerado pelo Usuário Inteligência Coletiva Folksonomia (Folksonomy) Redes Sociais Mídia Social Blogging Logos da Web 2.0 A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Um pouco mais de Web 2.0 Ajax Aplicações para Internet Rica (RIA) Metodologias ágeis Software como serviço (SaaS) Beta perpétuo A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA O Futuro da Web (Web 3.0) A Web está sempre trazendo novidades para todos, a velocidade em que o mundo tecnológico evolui é assustadora até para os profissionais da área. Existem muitas discussões sobre quais serão os marcos que definirão a Web 3.0, os três tópicos mais comentados são: Web 3D, Web Semântica e a Internet do mundo real. Web Semântica http://opte.org/ A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Conclusão A proposta inicial de um uso para interligar conhecimentos cresceu, a Internet se mesclou com o mundo real. O aumento da banda permitiu que os sítios oferecessem mais serviços e que as tecnologias evoluíssem. A Web mudou a forma das pessoas agirem. Não conseguimos pensar o nosso dia-a-dia sem Internet e sem acesso às páginas que apresentam informações de todas as formas possíveis. Mapas, tempo, mensagens, fotos, aulas, o ser humano está vivendo dentro desse novo universo em ebulição constante. A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Bibliografia DEITEL, Harvey M.; DEITEL, Paul J. Ajax, Rich Internet Applications e Desenvolvimento: Web para Programadores. São Paulo: Prentice Hall Brasil, 2009 LEMAY , Laura. Aprenda a Criar Páginas Web com HTML e XHTML em 21 Dias. São Paulo: Pearson Education do Brasil, 2002 PRIMO, Alex - O aspecto relacional das interações na Web 2.01 - E- Compós (Brasília), v. 9, p. 1-21, 2007 CIRILO, Carlos Eduardo C. e MAGALHÃES, Vanessa M. A. – Apresentação Web 2.0 - Conceitos e Tecnologias de Suporte - PPGCC/DC – 2009 http://oreilly.com/web2/archive/what-is-web-20.html http://www.web2con.com/web2con/ http://www.osignificado.com.br/web-3-0/ http://www.w3.org/MarkUp/draft-ietf-iiir-html-01.txt A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA A EVOLUÇÃO DA WEB – AULA1 PROGRAMAÇÃO PARA INTERNET RICA Bibliografia http://www.w3.org/People/Raggett/book4/ch02.html http://www.websense.com/assets/white-papers/whitepaper-web-security-gateway-web20-secured-and-simplified-pt.pdf http://sites.google.com/site/historiasobreossitesdebusca/historia-da-web-20 http://www.ietf.org/rfc/rfc3875 http://www.w3.org/TR/2000/REC-xhtml1-20000126/ http://www.hpl.hp.com/research/idl/papers/tags/ http://info.abril.com.br/aberto/infonews/082006/09082006-25.shl http://www.web3d.org/realtime-3d/ http://info.cern.ch/NextBrowser1.html http://blogs.bmj.com/bmj-journals-development-blog/2010/11/19/the-semantic-web-whats-the-point/ Programação para internet rica/Aula_02_rica.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 2-RIA (Rich Internet Application) * Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Conteúdo Programático desta aula Introdução à Internet Rica; Ajax; Tecnologias utilizadas; Frameworks; Benefícios. * Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Introdução à Internet Rica A evolução das teconologias que envolviam o desenvolvimento Web permitiu que fossem criadas interfaces que melhorassem a sensação do usuário ao intreagir com os seus objetos. As páginas apresentadas nos navegadores se aproximaram da tela criadas para os progrmas desktop. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA XMLHttpRequest, DHTML e DOM A criação da API XMLHttpRequest pela Microsoft com o uso de DHTML permitiu que a interfaces oferecessem mais funcionalidades e que as ações do usuário fossem respondidas sem que houvesse a necessidade de carregar uma nova página. O DOM facilitou a manipulação das informações na página. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Exemplo de interface rica usando o framework Rialto Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Comparação entre o carregamento tradicional e com o uso do Ajax Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Soluções adotadas RIA Remote Scripting IFrame Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Tecnologias Utilizadas XHTML; CSS; Javascript; Flash; Silverlight; XUL; Linguagens e Tecnologias executadas no Servidor. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Flash Software desenvolvido pela FutureWave Software; O arquivo gerado pelo aplicativo é chamado de filme Flash; Utiliza a linguagem Action Script; Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Silverlight Programa criado pela Microsoft para concorrer com o Flash; Permite a criação das interfaces com o uso de bloco de notas; Foi desenvolvido o Microsoft Expression Blend; Utiliza XAML(Extensible Application Markup Language). Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA XUL (XML User Interface Language) Linguagem para criação de interfaces a partir de tags XML; Criada para desenvolvimento em portáteis; Desenvolvida pelo projeto Mozilla; Pode ser executada em browsers baseados em Gecko; Add-ons do Firefox. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Exemplo de código em XUL Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Interface gerada Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Linguagens e Tecnologias de Servidor Linguagens: PHP Java – J2EE Ruby Python Cold Fusion Perl Tecnologias: Asp puro Asp dotNet Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Frameworks Funcionamento cross-browser; Tratamento de Ajax; Efeitos; Arrastar e soltar; Navegação; Atualizações. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Alguns Frameworks Prototype; Mochikit; Sajax; Script.aculo.us; Rialto; DWR (Direct Web Remoting); GWT (Google Web Toolkit); Dojo Toolkit; JQuery. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Exemplo de uso do JQuery Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Benefícios A melhora da experiência do usuário ao interagir com uma interface mais elegante, com um funcionamento mais próximo do que está acostumado e com respostas mais rápidas para o mesmo tipo de ação, torna as interfaces ricas uma forma de aumento de qualidade na construção de aplicativos Web. Muitas ferramentas estão sendo migradas para a plataforma Web, elas necessitam de funcionalidades que o HTML não consegue suprir. A RIA permite cronstruções de páginas com as características necessárias. Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Bibliografia DEITEL, Harvey M.; DEITEL, Paul J. Ajax, Rich Internet Applications e Desenvolvimento: Web para Programadores. São Paulo: Prentice Hall Brasil, 2009 LEMAY , Laura. Aprenda a Criar Páginas Web com HTML e XHTML em 21 Dias. São Paulo: Pearson Education do Brasil, 2002 http://www.adobe.com/br/resources/business/rich_internet_apps/getting_started http://www.ashleyit.com/rs/news.htm http://uxmag.com/articles/rich-internet-application-screen-design http://www.adobe.com/macromedia/proom/pr/2002/flash_mx_apps.html Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Rich Internet Application – AULA2 PROGRAMAÇÃO PARA INTERNET RICA Bibliografia http://www.adobe.com/macromedia/proom/pr/2002/flash_mx_apps.html http://www.adobe.com/devnet/flash.html http://msdn.microsoft.com/pt-br/silverlight/bb187401.aspx https://developer.mozilla.org/En/XUL http://chronosbox.org/blog/tags/rich-internet-application http://www.w3schools.com/Ajax/default.asp http://uxmag.com/articles/rich-internet-application-screen-design http://delicious.com/stacks/view/IqJHr2 http://www.worldofmerix.com/ Programação para internet rica/Aula_03.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 3 - Fundamentos de XHTML FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Introdução ao XHTML; Tipos de definição padrões; Diferenças entre HTML e XHTML; Construção de formulários; Conceitos no uso de Camadas; Outras marcações XHTML. FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Introdução ao XHTML O HTML 4.01 e o XML SGML XML XHTML 1.0 e 1.1 HTML 5.0 FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Definições de Tipo de Documento - DTD A DTD define qual a estrutura do documento, informando quais as marcações podem ser usadas. Existem três definições para XHTML. Permite a validação das páginas criadas: http://validator.w3.org/ FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Validação do Documento FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Estrutura de uma DTD Parte da DTD que define a marcação HTML FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Definições Padrões DTD Strict Frameset Transitional FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Comparação entre HTML e XHTML HTML XHTML As marcações (tags) são normalmente em maiúsculas As marcações são em minúsculas Existem marcações sem fechamento Marcações informam ao navegador que não possuem o par Não existe restrição de intercalação A estruturação é hierárquica Permite que valores dos atributos estejam sem aspas Exigem o uso de aspas para os valores Permite atributos sem valor Todos os atributos devem possuir valor Abrir marcações antes ou após a tag HTML não gera erro Um documento XML possui apenas uma raiz FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Formulários Iremos olhar a construção de um formulário. FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Exemplo de Formulário FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Camadas Iremos olhar as possibilidades das camadas. FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Outras Marcações Imagem Hyperlink Listas Objetos FUNDAMENTOS DE XHTML – AULA 3 PROGRAMAÇÃO PARA INTERNET RICA * Próxima Aula - CSS Fundamentos Aplicação Programação para internet rica/Aula_04.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 4 - Fundamentos de CSS FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Introdução ao CSS; Começando com CSS; Conhecendo as possibilidades. FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Introdução CSS estende as formatações existentes no HTML As folhas de estilos auxiliam na padronização e manutenção Alteração nas folhas de estilo, auxiliam na inclusão digital Melhoria na interface do usuário Tableless FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Histórico Håkon Wium Lie Cascading HTML Style Sheets Bert Bos Stream-based Style Sheet Proposal Argo Lie, Yves Lafon e Dave Raggett Navegador Arena com suporte a CSS HTML 3.0 Suporte a CSS FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Começando Onde colocar o CSS? Como podemos configurar os estilos? Como podemos aplicar o CSS? FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Trabalhando com CSS Vamos explorar um pouco o mundo do CSS. FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Alternando Estilos Podemos alternar entre folhas de estilos externas. stylesheet alternative stylesheet title FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Alternando Estilos - Exibir FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Importando estilos Existe outra forma para se importar uma folha de estilos externa Carregamento / Ordem Versões antigas de navegadores FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Cores em CSS FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Conhecendo as possibilidades Página inicial FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * Possibilidades de formatação Iremos interagir com a tela anterior e criar as formatações, para melhorar os nossos conhecimentos em CSS. FUNDAMENTOS DE CSS – AULA 4 PROGRAMAÇÃO PARA INTERNET RICA * O CSS amplias as possibilidades A criação de interfaces Web passou por uma transformação e o CSS auxiliou muito. Iremos ver fundamentos de Javscript na próxima aula, ele fornece mais poder para a interface, permitindo que processamentos sejam realizados no lado do ciente. A interação do Javascript com o CSS será visto em outra aula. Programação para internet rica/Aula_05.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 5 - Fundamentos de Javascript * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Introdução ao Javascript Criando funções Usando os eventos Validando um formulário * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Introdução ao Javascript O Javascript foi desenvolvido pela Netscape, criado por Brendan Eich Mocha Livescript Javascript FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Microsoft lança o Jscript Active Scripting VBscript Jscript ASP Internet Explorer 3.0 I.I.S 3.0 FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * O Javascript Sintaxe Escrevendo na tela Variáveis Estruturas Bloco Objetos FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Locais onde podemos colocar os scripts * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Funções Sintaxe Criando funções Parâmetros Variáveis locais Chamando a função FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Funções da Linguagem As linguagens oferecem funções para que possamos trabalhar com as variáveis * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Explorando a Criação de Funções * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Eventos Os tratadores de eventos são os locais onde colocamos os código. Cada objeto consegue perceber algumas ações sobre ele. FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * Formulário - Validação * FUNDAMENTOS DE JAVASCRIPT – AULA 5 PROGRAMAÇÃO PARA INTERNET RICA * O Navegador assumiu mais funcionalidades A Internet Rica faz uso de muita programação Javascript. O Navegador assume a responsabilidade de controlar a informação que aparece na tela e realiza as chamadas das outras páginas através do Javascript. Programação para internet rica/Aula_06-Notebook-PC.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 6 - DHTML DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula O DHTML ontem e hoje; As partes que fazem um todo poderoso; Andando por dentro das páginas; Formatando as páginas dinamicamente; Animando um pouco; Falando sobre as dificuldades. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * O DHTML ontem e hoje O grande uso do DHTML no passado ficou por conta dos efeitos. Hoje ele vem aumentar as possibilidades da interface, trazendo funcionalidades que só eram encontradas em sistemas desktop. http://www.fromdesigner.com DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * As partes que fazem um todo poderoso O DOM define a estrutura da página XHTML CSS e o poder da formatação Javascript, não só o Javascript XHTML é base para os outros DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Andando por dentro das páginas O Javascript possui métodos para andar pela estrutura do objeto do documento XHTML. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Código para andar pela estrutura DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Recuperando o valor de um campo de formulário DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Recuperando o valor de um campo do tipo radio DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Manuseando elementos em uma página A interação poderá gerar a necessidade de que o código acrescente marcações na estrutura do documento ou altere alguma informação. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Manuseando um pouco DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mexendo com o Dom hasAttribute("atributo") - Verfica se o elemento possui o atributo. setAttribute("atributo","valor") - Atribui um valor ao atributo. getAttribute("atributo") - Obtém o valor do atributo. removeAttribute("atributo") - Remove o atributo. appendChild(objeto) - Adiciona um elemento como filho do atual. createElement("elemento") - Cria um elemento. createTextNode("conteúdo") - Cria um texto para por em um elemento DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mexendo com o Dom parentNode - Retorna o elemento pai do nó (elemento) atual. childNodes - Retorna a coleção de filhos do elemento. firstChild - Retorna o primeiro nó interno ao elemento. lastChild - Retorna o último nó interno ao elemento. nextSibling - Retorna o próximo nó filho do mesmo pai que o nó atual. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Formatando as páginas dinamicamente Controlando o CSS com o Javascript. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Configurando o CSS DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Iniciando com Animação DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Lembrando Usamos o CSS para gerar os efeitos dinâmicos no XHTML, por isso que muito que será programado terá início no propriedade "style" do objeto recuperado com getElementById. A propriedade "style" também é um objeto que possui propriedades, usamos: top, left visibility position DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mais um menu DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Problemas que podemos encontrar Navegador Internet Explorer Firefox Outros Portátil DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * jQuery Algumas vantagens: Programação para internet rica/Aula_06.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 6 - DHTML DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula O DHTML ontem e hoje; As partes que fazem um todo poderoso; Andando por dentro das páginas; Formatando as páginas dinamicamente; Animando um pouco; Falando sobre as dificuldades. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * O DHTML ontem e hoje O grande uso do DHTML no passado ficou por conta dos efeitos. Hoje ele vem aumentar as possibilidades da interface, trazendo funcionalidades que só eram encontradas em sistemas desktop. http://www.fromdesigner.com DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * As partes que fazem um todo poderoso O DOM define a estrutura da página XHTML CSS e o poder da formatação Javascript, não só o Javascript XHTML é base para os outros DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Andando por dentro das páginas O Javascript possui métodos para andar pela estrutura do objeto do documento XHTML. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Código para andar pela estrutura DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Recuperando o valor de um campo de formulário DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Recuperando o valor de um campo do tipo radio DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Manuseando elementos em uma página A interação poderá gerar a necessidade de que o código acrescente marcações na estrutura do documento ou altere alguma informação. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Manuseando um pouco DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mexendo com o Dom hasAttribute("atributo") - Verfica se o elemento possui o atributo. setAttribute("atributo","valor") - Atribui um valor ao atributo. getAttribute("atributo") - Obtém o valor do atributo. removeAttribute("atributo") - Remove o atributo. appendChild(objeto) - Adiciona um elemento como filho do atual. createElement("elemento") - Cria um elemento. createTextNode("conteúdo") - Cria um texto para por em um elemento DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mexendo com o Dom parentNode - Retorna o elemento pai do nó (elemento) atual. childNodes - Retorna a coleção de filhos do elemento. firstChild - Retorna o primeiro nó interno ao elemento. lastChild - Retorna o último nó interno ao elemento. nextSibling - Retorna o próximo nó filho do mesmo pai que o nó atual. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Formatando as páginas dinamicamente Controlando o CSS com o Javascript. DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Configurando o CSS DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Iniciando com Animação DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Lembrando Usamos o CSS para gerar os efeitos dinâmicos no XHTML, por isso que muito que será programado terá início no propriedade "style" do objeto recuperado com getElementById. A propriedade "style" também é um objeto que possui propriedades, usamos: top, left visibility position DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Mais um menu DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * Problemas que podemos encontrar Navegador Internet Explorer Firefox Outros Portátil DHTML – AULA 6 PROGRAMAÇÃO PARA INTERNET RICA * jQuery Algumas vantagens: Programação para internet rica/Aula_07.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 7 - jQuery jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Começando com jQuery; Associando eventos; Usando caixas de diálogo; Arrastando objetos na tela; jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Começando com o jQuery John Resig criou um framework com a intenção de que se usasse o Javascript sem existir a necessidade de se escrever tanto. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Incluindo os arquivos jQuery Funções do Usuário Plugins jQuery UI spritely gameQuery jqwysiwyg jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Exemplo jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Seletores jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Configurando CSS As possibilidades do CSSs podem ser acessadas através do método css. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * DOM - construindo e destruindo O jQuery fornece formas de acessar a estrutura do documento, permitindo que se faça uma construção dinâmica. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Os eventos iniciam o código Objetos percebem ações jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Eventos Vamos associar funções aos eventos. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Caixas de diálogo Camadas podem ser usadas como caixas de diálogo. Janelas Modal não permitem que interaja com a tela antes de fechá-la. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Caixas de diálogo Criando uma caixa de diálogo jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Arrastando os objetos Existem muitas aplicações que necessitam que arrastemos os objetos pela tela. jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Possibilidades Calendário Editor Animação jQuery – AULA 7 PROGRAMAÇÃO PARA INTERNET RICA * Próxima Aula Programação para internet rica/Aula_08.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 08 -FLASH FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Construção de um jogo em Flash FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * O Jogo Criação de Jogos Engines Criação de Personagens FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * O Princípio de Arquimedes Loren ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation. Ut wisi enim ad minim veniam, quis nostrud exerci tation. PROFESSOR, EMBAIXO DO TÍTULO COLOQUE O CONCEITO (OU AS PALAVRAS-CHAVE, EM TÓPICOS) EM NO MÁXIMO 7 LINHAS. MODELO 1 PARA TELA COM TEXTO E IMAGEM PROFESSOR, INSIRA O NOME DO CONCEITO OU TEMA COMO TÍTULO DO SLIDE, CF EXEMPLO ABAIXO MODELO DE MOLDURA PARA IMAGEM COM ORIENTAÇÃO VERTICAL FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * O Princípio de Arquimedes Loren ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation. PROFESSOR, EMBAIXO DO TÍTULO COLOQUE O CONCEITO (OU AS PALAVRAS-CHAVE, EM TÓPICOS) EM NO MÁXIMO 7 LINHAS. MODELO DE MOLDURA PARA IMAGEM COM ORIENTAÇÃO HORIZONTAL MODELO 2 PARA TELA COM TEXTO E IMAGEM PROFESSOR, INSIRA O NOME DO CONCEITO OU TEMA COMO TÍTULO DO SLIDE, CF EXEMPLO ABAIXO FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * O Princípio de Arquimedes Loren ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation. Loren ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam. inserir aqui texto de destaque referente ao conceito em questão, máximo 3 linhas MODELO PARA TELA COM TEXTO E CAIXA DE ATENÇÃO/DESTAQUE PROFESSOR, INSIRA O NOME DO CONCEITO OU TEMA COMO TÍTULO DO SLIDE, CF EXEMPLO ABAIXO FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * 1725 1727 1726 Evolução Histórica do xxxxxxxxxxxxxxxx 1723 PROFESSOR, ESTE É UM MODELO PARA “LINHA DE TEMPO” (EVOLUÇÃO CRONOLÓGICA DE UM DETERMINADO FENÔMENO). RENOMEIE O TÍTULO, AS DATAS E USE APENAS PALAVRAS-CHAVE 1724 Palavra chave Palavra chave Palavra chave Palavra chave Palavra chave FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Ar comprimido Classificação segundo xxxxxxxxxxxxxxxx PROFESSOR, ESTE É O MODELO 1 PARA “CLASSIFICAÇÃO/HIERARQUIZAÇÃO/FLUXO”. RENOMEIE O TÍTULO E AS PALAVRAS MERGULHO SUBAQUÁTICO Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Estrutura Organizacional xxxxxxxxxxxxxxxx PROFESSOR, ESTE É O MODELO 2 PARA “CLASSIFICAÇÃO/HIERARQUIZAÇÃO/FLUXO/ESTRUTURA”. RENOMEIE O TÍTULO E AS PALAVRAS MERGULHO SUBAQUÁTICO Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia Apnéia FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Fluxograma xxxxxxxxxxxxxxxx PROFESSOR, ESTE É O MODELO 3 PARA “CLASSIFICAÇÃO/HIERARQUIZAÇÃO/FLUXO/ESTRUTURA”. RENOMEIE O TÍTULO E AS PALAVRAS XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXX FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Título xxxxxxxxxxxxxxxx Elementos de apoio A DDD CCCCCC B FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Explorando o tema PROFESSOR, ESTE É UM MODELO PARA “MULTIMÍDIA” (INDICAÇÃO DE FILMES, LINKS, LIVROS ETC.). COLOCAR TEXTO, TÍTULOS E/OU LINKS Loren ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation. FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Título do Item MODELO PARA TABELAS xxxxxxxxxx xxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx 66 xxxxxxxxxxxxxxxxxxxxxxx Nível 1 Nível 2 xxxxxxxxxxxxxxxxxxxxxxx 25 41 xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxx FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Aplicando o conhecimento MODELO PARA ATIVIDADE DE CONSULTA/CÁLCULO SIMPLES (EXERCÍCIO DE FIXAÇÃO DE CONTEÚDO). A política monetária é o conjunto de medidas adotadas pelo governo para controlar a oferta de moeda na economia visando atingir determinados objetivos. Contudo, para realizar esse tipo de política, o governo utiliza-se de alguns instrumentos. RELACIONE A POLÍTICA MONETÁRIA AO SEU INSTRUMENTO: INSTRUMENTO EXPANSIONISTA CONTRACIONISTA Compulsório Redesconto Operações de Mercado Aberto FLASH – AULA 08 PROGRAMAÇÃO PARA INTERNET RICA * Aplicando o Conhecimento MODELO PARA ATIVIDADE COMPLEXA Demanda é a quantidade de um bem ou serviço que pode ser adquirido por um preço definido em um dado mercado, durante uma unidade de tempo. Para as empresas, é muito importante identificar a demanda para um determinado produto ou serviço, pois é ela que vai dizer o quanto se comprará da oferta da empresa. Isto é, quem e quantos são os consumidores que irão adquirir o produto ou serviço. A revista Forbes publicou, em sua edição no 109 de 25/04/05, a matéria Micro-cervejarias investem na produção artesanal e conquistam admiradores. A matéria sobre a cerveja Devassa. A produção mensal é de 70 mil litros/mês, sendo apenas 16 mil litros engarrafados. Tem três versões: a Devassa Loura, a Devassa Ruiva e a Devassa Negra (esta somente servida na versão chope). PROBLEMATIZAÇÃO As empresas precisam atender à demanda, portanto não produzem muito mais do que vendem. A capacidade de produção é limitada pelo modo de confecção do produto (industrial ou artesanal). A cerveja industrial pode facilmente aumentar sua produção caso haja um aumento da demanda. Em qual modo de produção a cerveja Devassa se encaixa? Por quê? Programação para internet rica/Aula_09.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 9 - AJAX * AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Conteúdo Programático desta aula O início; Funcionamento; Princípios; Objeto XMLHttpRequest; Tipo de Recebimento de Dados; Envio de Dados; Construção de Interfaces. * AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA O Início A Microsoft inicia grupos de trabalhos para a criação do Outlook Web Access para o Exchange 2000 em 1998 Criação do objeto XMLHttpRequest Lançamento do Internet Explorer 5.0 em 1999 contendo o ActiveX AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Ajax O termo Ajax Consultoria de usabilidade Adaptive Path Tecnologias usadas Jesse James Garrett AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Os quatro princípios O navegador hospeda uma aplicação, e não conteúdo; O servidor fornece dados, e não conteúdo; A interação do usuário com a aplicação pode ser flexível e contínua; Real codificação requer disciplina. AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Funcionamento Tradicional e Ajax AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Funcionamento Tradicional e Ajax - Olhando o Cenário AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Funcionamento Tradicional e Ajax - Atualização Ajax AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA As Mágicas do Ajax Arrastar e soltar Botão Direito Carga de Dados Preenchimento automático AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA O Objeto XMLHttpRequest e o processamento Apresentação Javascript XMLHttpRequest response XHTML /DOM Base de Dados Acesso aos Dados Codificação Executada no Servidor Requisição HTTP XML outro Formato AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA A função AJAX * AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Tipo de Recebimento de Dados XHTML XML JSON Texto AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Recebendo Dados * AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Envio de Dados GET QUERYSTRING POST AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Como enviar dados através do método "POST" * AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Construção de Interfaces AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Próxima Aula AJAX – AULA 9 PROGRAMAÇÃO PARA INTERNET RICA Links http://blogs.technet.com/b/exchange/archive/2005/06/21/406646.aspx http://en.wikipedia.org/wiki/XMLHttpRequest http://maps.google.com.br/maps?hl=pt-BR&tab=wl http://www.adaptivepath.com/ideas/ajax-new-approach-web-applications Programação para internet rica/Aula_10.ppt PROGRAMAÇÃO PARA INTERNET RICA Aula 10 – Fundamento de ASP.NET FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Principais características Da IDE Visual Web Developer; Fundamentos do dot Net; Funcionamento da interface e sua classe associada; Acesso ao Banco; Funcionamento de Controles. FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Ambientes de Desenvolvimento Microsoft para Web Expression Web Expression Blend Web Matrix Visual Web Developer FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Visual Web Developer Express Framework dot Net C# Vb dot Net Tipos Windows Web Cloud Silverlight WDF FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Começando um Web Site FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Web Site FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Conhecendo o Ambiente FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Conhecendo o Ambiente - continuação FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Web Site FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Web Site Design Split Source FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Começando um site ASP.Net Site acessando um banco de dados FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Iniciando Web Site vazio “peixes” FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Conhecendo o Ambiente - continuação Copiando os arquivos da aula anterior: CSS Imagem do título Imagem dos Peixes FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Base de Dados FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Configurando o Banco de Dados http://dev.mysql.com/downloads/connector/net/ FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Extensão MySQL FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Extensão MySQL – by Devart Softwre FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Extensão MySQL FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Configurando a conexão Host: localhost Port: 3306 User Id: root Password: Database: petshop Renomeie para “Petshop” Obs.: O script com a base de dados poderá ser baixada no SAI. FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Configurando a conexão Host: localhost Port: 3306 User Id: root Password: Database: petshop Obs.: O script com a base de dados poderá ser baixada no SAI. FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Criando uma página http://dev.mysql.com/downloads/connector/net/ FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Código FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Inserindo um GridView Design Toolbox – Data – GidView – executar duplo clique ou arratar para a Página FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Código FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Criando o Data Source FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Criando o Data Source FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Instrução SQL FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Aparência FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Aparência FUNDAMENTOS DE ASP.NET– AULA1 PROGRAMAÇÃO PARA INTERNET RICA * Programação para Internet Rica Programação para internet rica/revisaoav1.ppt PROGRAMAÇÃO PARA INTERNET RICA Revisão para AV1 REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Fatos marcantes da evolução da Web O que são aplicações ricas? Regras que o XML que fizeram o HTML se transformar em XHTML Os Formulários e suas aplicações As Camadas e suas aplicações Aumentando a funcionalidade da Web com o CSS A linguagem cliente e suas características REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Nasce a Web e ela não para de evoluir Tim Berners Lee e Cailliau CGI e Formulários HTML 1.0 a 4.01 XMLHttpRequest e o AJAX MODELO DE MOLDURA PARA IMAGEM COM ORIENTAÇÃO VERTICAL REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Aumentam os recursos DOCTYPE CSS DTD XHTML (XML e HTML) REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Web 2.0 Conferências que levaram o nome, mudam a forma de pensar e agir. REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Web 3.0 Web Semântica 3D Internet do Mundo Real REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Internet Rica Javascript XMLHttpRequest Ajax Frameworks Javascript REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Tecnologias Flash – Silverlight REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * XHTML DTD Strict Transitional Frameset Mudanças gerada pelo XML REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Formulários Permite ao usuário iteragir com a página, enviando informações. Os tipos de campos permitem que sejam apresentação telas de entrada de dados para situações diferentes. REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Camadas REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * O CSS gerando funcionalidade e aparência Criação Usando Alternando REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Formatações CSS REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Linguagens Clientes Linguagens scripts Estruturas Operadores Criando Chamando as funções REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Funções e Eventos Criando Funções Usando Funçõss Funções da Linguagem Eventos REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Avaliações Estude, leia, experimente, isso ajudará a sanar as dúvidas antes da prova. Preste atenção durante a prova, leia quantas vezes forem necessárias as questões. Não tenha pressa de acabar a prova, aproveite o tempopara rever as questões. Boa Prova Programação para internet rica/revisaoav2_2.ppt PROGRAMAÇÃO PARA INTERNET RICA Revisão para AV1 REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Conteúdo Programático desta aula Revisão dos conteúdos da aula 6 a 10 REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DHTML - DOM REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DHTML Concurso: FCC - 2009 - TJ-SE - Técnico Judiciário - Programação de Sistemas Para produzir websites "animados", com recursos de acesso dinâmico, a linguagem DHTML é a junção de tecnologias como XML, JSP e CSS XML, JavaScript e CSS Java, JSP e JavaScript HTML, JavaScript e folhas de estilo HTML, XML e folhas de estilo REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DHTML- CSS Concurso: FCC - 2009 - TRE-PI - Técnico Judiciário - Programação de Sistemas Em CSS, a propriedade background-image é usada para configurar uma imagem de fundo. Pode ser usada em JavaScript, com a seguinte sintaxe: background.Image backgroundImage background.image background_image background(image) REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DHTML- DOM Andando pelo Documento: Elemento – Raiz Atributo Diferença entre getElementById e getElementsByTagName childNodes appendChild REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DOM Concurso: FCC - 2008 - MPE-RS - Técnico em Informática - Área Sistemas Usando DHTML no Internet Explorer, em cada elemento é permitido, sem ter que recarregar a página, alterar os dados por meio das propriedades innerHTML e innerDOM. innerText e innerDOM. innerText e innerHTML innerDOM e innerDHTML. innerHTML e innerDHTML. REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * DHTML- CSS Configurando style relação dos nomes CSS e Javascript Postionando elementos: position left top Classes REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * jQuery REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * jQuery Concurso: FUNDAPE - 2011 - UFAC - DESENHISTA TÉCNICO/ESPECIALIDADE:WEBDESIGN Assinale a alternativa que possui o código em JavaScript (utilizando JQuery) que seleciona todos os “checkbox” de um “form”. a) $("form input[type='checkbox']") b) $("form output[type='checkbox']") c) $("output[type='checkbox']") d) $("form input['checkbox'].teste") e) $("form.checkbox") REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * jQuery Seletores CSS Formulário Eventos CSS Eventos Direto bind UI REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Flash REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Flash Concurso: FGV - 2010 - BADESC - Analista de Sistemas - Desenvolvimento de Sistemas Um dos recursos do Flash está relacionado à capacidade de distribuição do conteúdo de um site em um navegador, na Internet. Uma vez que parte da arte vetorial do site descarregou, o Flash pode rapidamente exibí-la enquanto o resto dos dados continua a descarregar. Quando o Flash reproduz os primeiros quadros de um filme, os quadros subsequentes continuam a ser mostrados no browser e o Flash alimenta-os na velocidade de projeção especificada. REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Flash Este recurso é conhecido por: skinning mirroring tweening splashing streamming REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Flash – Objetos do Filme Linha de Tempo Cena Clipe de Filme Camadas REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Flash – AS3 Espaço de nomes Classes Eventos REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * AJAX REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * AJAX Concurso: FCC - 2011 - TRE-RN - Técnico Judiciário - Programação de Sistemas Agrega um conjunto de tecnologias conhecidas trabalhando juntas para tornar páginas Web mais interativas com o usuário, utilizando-se de solicitações assíncronas de informações: XML JavaScript XHTML AJAX CSS REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * AJAX – O Objeto Concurso: FCC - 2012 - TJ-PE - Técnico Judiciário - Programador de Computador Esse objeto é o ponto chave do AJAX. Pode ser considerado um objeto Javascript que torna possível a comunicação assíncrona com o servidor. O objeto citado é do tipo XMLRequest XMLAjaxActiveXObject HttpServletResponse. HttpServletRequest. XMLHttpRequest REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * AJAX – O Objeto - usando Concurso: CONSULPLAN - 2012 - TSE - Técnico Judiciário - Programação de Sistemas Ajax que tem por significado “Asynchronous Javascript And XML” e representa um conceito para descrever a interação do objeto XMLHttpRequest no lado do Cliente com os scripts baseados no servidor. Uma vez criada a instância do objeto XMLHttpRequest, existem diversos métodos disponíveis para o usuário, dos quais dois são detalhados a seguir. Observe. REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * AJAX – O Objeto Especifica os diferentes atributos necessários para realizar uma conexão com o servidor e permite que se façam seleções tais como GET e POST. Acrescenta um par de rótulos e/ou valores ao registro inicial, quando enviado. Esses métodos são conhecidos, respectivamente, por open() e getRequestHeader() open() e setRequestHeader() send() e getRequestHeader() send() e setRequestHeader() REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * ASP.Net REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * ASP.NET Linguagens Microsoft C# VB.Net Sintaxe IDEs Conexão com bancos de dados REVISÃO PARA AV1 PROGRAMAÇÃO PARA INTERNET RICA * Avaliações Estude, leia, experimente, isso ajudará a sanar as dúvidas antes da prova. Preste atenção durante a prova, leia quantas vezes forem necessárias as questões. Não tenha pressa de acabar a prova, aproveite o tempopara rever as questões. Boa Prova
Compartilhar