1 / 32

RIA com ZK Framework

ZK. RIA com ZK Framework. O que é ZK ?.

baris
Download Presentation

RIA com ZK Framework

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. ZK RIA com ZK Framework

  2. O que é ZK? • ZK é um framework AJAX orientado a eventos, baseado em componentes, open-source para desenvolvimento de aplicações WEB escrito em Java que permite a criação de interfaces ricas(RIA) com o usuário para aplicações web sem Javascript e poucos conhecimento de programação. • ZK possui a denominada abordagem server-centric na qual a sincronização de conteúdo de componentes e o pipelining de evento entre clientes e servidores são feitas automaticamente pelo motor e os códigos de canalização AJAX são completamente transparentes para os desenvolvedores de aplicativos web.

  3. Server Centric vs Client centric Server-Centric Client-Centric

  4. Pontos Fortes • Open Source: Zk é o principal framework open source Ajax + Mobile. A comunidade de desenvolvedores ZK é extremamente ativa com mais de 20 traduções, mais de 100 artigos/blogs e mais de 100.000 linhas de código, mais de 1.300.000 downloads de mais de 190 paises. • Experiência Rica de Usuário: Mais de 200 componentes prontos. Vários componentes de terceiros: JFreeChart. JasperReports, Google Maps, FCKeditor, Timeline, ExtJS, Dojo e mais. • Baseado em padrões: ZK é um solução baseada em padrões • Extensibilidade e customização: ZK é totalmente personalizável e extensível com uma arquitetura modular e plug-and-play • Acesso Móvel: ZK estende o alcance de sua aplicação para os dispositivos móveis. ZK suporta Java Mobile, Android e vários navegadores móveis • Segurança: ZK é concebido desde sua criação para ser seguro.

  5. Simplificando as coisas…

  6. Componentes ZK • Site com exemplo dos componentes: • http://www.zkoss.org/zkdemo/userguide/

  7. Configuração do ambiente • JDK: • http://java.sun.com/javase/downloads/widget/jdk6.jsp • Eclipse Galileo para Java EE: • http://www.eclipse.org/downloads/packages/eclipse-ide-java-ee-developers/galileosr2 • Tomcat 6: • http://tomcat.apache.org/download-60.cgi • ZK Studio(Plugin para o Eclipse): • http://www.zkoss.org/download/zkstudio.dsp • ZK 5.0.X: • http://www.zkoss.org/download/zk.dsp

  8. Instalado o plugin do ZK no Eclipse • Em Window Help -> InstallNew software • Add... • Name: Zk Studio • Location: http://www.zkoss.org/download/zkstudio.dsp • Selecione o plugin e mande instalar • Depois de instalar, baixe a versão mais atual do ZK: http://www.zkoss.org/download/zk.dsp • Depois de baixado, em Window -> Preferences. ZK -> ZK Packages • Add File • Selecione o File Import, o local do arquivo do ZK • Depois disso selecione esse pacote que voce instalou, apply e ok • Pronto!

  9. Primeiros passos • Criação de um Projeto com ZK • Configuração do servidor • Iniciando a aplicação • Primeiro exemplo… • Projeto: Primeiros passos no site de comp2 • Criação de uma view com um controlador. Demonstração do uso de MVC com o ZK.

  10. ZUML

  11. O que é? • O ZK User Interface Markup Language (ZUML) é baseada em XML • Arquivos ZUML possuem extensão .zul

  12. Características • Cada elemento ZK instrui ao ZK Loader qual componente criar • Uma propriedade ZK descreve um valor inicial a ser atribuído ao componente criado • Uma instrução de processamento ZK descreve como processar a página inteira, como o título da página. • XML • Implicit Objects • Expresion Language • zscript  • ZK Processing Instruction • ZK Attributes • ZK Elements

  13. XML • O ZUML é baseado em XML: • http://docs.zkoss.org/wiki/ZUML_XML

  14. Implicit Objects • Objetos implícitos são muito parecidos com variáveis globais tratadas pelo sistema. Você pode usá-lo para obter informações do sistema e do cliente. Além disso, é uma maneira de passar informações entre páginas. São realmente úteis para o desenvolvimento de uma aplicação web. • http://docs.zkoss.org/wiki/ZUML_Implicit_Objects

  15. ZScript • O zscript permitem escrever código Java dentro ZUML, para prototipagem rápida. Possui suporte a vários tipos de linguagens além de Java • http://docs.zkoss.org/wiki/Zscript

  16. Expression Language (EL) • Expression Language é uma linguagem de scripting. Através dela, o pode-se escrever código em ZUML para acessar componentes Java facilmente. Além disso, o desenvolvedor pode acessar componentes ZUML através de uma expressão clara e simples. EL pode acessar objetos implícitos também. • http://docs.zkoss.org/wiki/ZUML_Expression_Language_(EL)

  17. Outros... • ZK Processing Instruction • http://docs.zkoss.org/wiki/ZUML_ZK_Processing_Instructions • ZK Attributes • http://docs.zkoss.org/wiki/ZUML_ZK_Attributes • ZK Elements • http://docs.zkoss.org/wiki/ZUML_ZK_Elements

  18. Ciclo de Vida

  19. O ciclo de vida de carregamento de uma página • A fase inicial da Page • A fase de criação da Page • A fase de processamento de eventos • A fase de renderização

  20. Gerando uma pagina HTML

  21. O ciclo de vida de atualização de uma página • A fase de processamento de solicitação • A fase de processamento de eventos • A fase de renderezição

  22. ZK fazendo Ajax

  23. Componente UI • Componente • Parte Visual • Parte Java

  24. Desktop, Page e Componentes • Um desktop é uma janela do navegador. É uma coleção de páginas para atender a solicitação de uma mesma URL • Uma página é uma coleção de componentes, que são exibidos em uma determinada parcela do seu navegador. • Um componente é um objeto de interface do usuário, por exemplo: janela, botão ...

  25. ID Space <?page id="P"?> <zk> <window id="A"> <hbox id="B"> <button id="D" /> </hbox> <window id="C"> <button id="E" /> </window> </window> <hbox id="F"> <button id="G" /> </hbox> </zk>

  26. JPA

  27. Integração com JPA • Uso do arquivo META-INF\persistence.xml no source • Configuração do arquivo zk.xml: <preference> <name>JpaUtil.PersistenceUnitName</name> <value>comp2web_persistence_unit</value> </preference> <listener> <description>JPA "OpenEntityManagerInView" Listener</description> <listener-class>org.zkoss.zkplus.jpa.OpenEntityManagerInViewListener</listener-class> </listener> • Uso da classe: org.zkoss.zkplus.jpa.JpaUtil

  28. Data binding

  29. Conceito Básico • Data binding é um mecanismo que automatiza o código de cópia de dados entre os componentes de interface e fonte de dados. Os desenvolvedores só tem que informar ao gerenciador de data binding sobre as associações entre os componentes de interface e a fonte de dados. Em seguida, o gerenciador de data binding irá fazer o trabalho de carregar(carregar dados da fonte de dados para componentes de interface do usuário) e salvar(guardar dados de componente de UI para a fonte de dados) automaticamente. • Projeto de exemplo: DataBinding

  30. Referências: • Guia do Desenvolvedor: • http://docs.zkoss.org/wiki/Developer's_Guide • Referências de componentes(Versão 5.0.X): • http://books.zkoss.org/wiki/ZK_Component_Reference • ZK Java API: • http://www.zkoss.org/javadoc/latest/zk/

  31. Dúvidas?

  32. FIM

More Related