Trabalhando Com Botões e Eventos Click

            Olá Pessoal no Video abaixo Mostro como Trabalhar Com Botões como Ouvir o Evento Click utilizando ClickListerner,  os requisitos para os Códigos descritos no Video Funcionarem é a IDE de Sua Escolha configurado um projeto Java EE no NetBeans ou Dynanmic Web Project no Eclipse e com as Bibliotecas do Vaadin7 configuradas no Seu Build Path, se você ainda não Migrou sua Aplicação Vaadin6 veja num outro video como fazer num outro video, espero que gostem!

Olá Mundo com Vaadin 7 no Netbeans

      Olá pessoal, hoje veremos como fazer um Olá Mundo com Vaadin 7, a nova Versão do Framework conta com algumas mudanças em relação a Versão 6, mostro no video abaixo as mudanças básicas que são Necessárias para se Fazer um famoso Olá Mundo.

No Exemplo foi Criado uma Nova Aplicação  Utilizando a versão 6 com o Plugin para Netbeans, que pode ser baixado aqui, também foi removido a biblioteca antiga do Vaadin 6 e Adicionada todos os Novos JARS da Versão 7

Dentre as Mudanças apresentadas são elas:
- A Classe Principal não Estende mais de application e sim de UI
- O Método init agora recebe um parametro do tipo VaadinRequest que estende de com.vaadin.server
- na Classe web.xml o Parametro <param-name> agora recebe UI e continua apontando para sua Classe Principal e também o Parametro <servlet-class> agora recebe o valor com.vaadin.server.VaadinServlet.

Com isso já é possivel rodar a Aplicação! espero que tenham gostado! nos proximos dias vou começar a postar uma Serie de videos que Vai compor um Curso Básico sobre Vaadin 7! quem quiser receber as atualizações é só me seguir no Twitter @marconidev ou se inscrever no meu canal no Youtube.

Configurando Ambiente de Desenvolvimento para Vaadin Framwork

Configurando o ambiente de Desenvolvimento para Aplicações Web com Vaadin Framework!

         Olá pessoal, como mencionei no post anterior hoje preparei um video mostrando como configurar o Ambiente de Desenvolvimento para Vaadin, no video Utilizei a IDE Eclipse e o Servidor Apache Tomcat para Implantar a Aplicação, você pode fazer o download da IDE e do TomCat nos Links Abaixo:

Eclipse IDE Juno: http://www.eclipse.org
Apache Tomcat 7: http://tomcat.apache.org

O código fonte comentado e explicado esta no final deste post.

  

package com.example.olamundo;

import com.vaadin.Application;
import com.vaadin.ui.*;
import com.vaadin.ui.Button.ClickEvent;

public class OlaMundo extends Application {
    @Override
    public void init() {
        final Window mainWindow = new Window("Janela Principal da Aplicação"); //Define uma Janela
        Label label = new Label("Olá Mundo!"); //Define um Label
        Button bt_teste = new Button("Clique-me!"); //Instancia um Novo Botão, informando seu Caption como "Clique-me"
        //Adiciona Listener para o Clique do Botão
        bt_teste.addListener(new Button.ClickListener() {
            
            //Função do Clique do Botão, Existem outras formas de definir uma função para um clique depois veremos outras
            public void buttonClick(ClickEvent event) {
                mainWindow.showNotification("Vaadin Framwork BR ! - @marconidev");                
            }
        });
        Button bt_teste2 = new Button("Segundo Botão");
        mainWindow.addComponent(label); //Adiciona o Label dentro da Janela
        mainWindow.addComponent(bt_teste);//Adiciona Botão que Criamos dentro da Janela bem abaixo do Label
        mainWindow.addComponent(bt_teste2);
        setMainWindow(mainWindow);//Seta a Janela criada como Janela Principal da Aplicação
    }

}

 #Explicação

Como devem ter notado a classe Principal da Aplicação tem que ser extendida de Application e tem que implementar um método init(), mais isto o plugin do vaadin já faz pra nós na criação do projeto novo, e também ja adiciona uma Window, que se refere a uma janela do navegador ou mesmo uma guia, e quando é instanciada é definido o título da janela como "Janela Principal da Aplicação" , um componente Label também é instanciado, e também um botão é instanciado, definindo-se o caption para "Clique-me" e adicionado um Listenter e na função desse clique adicionamos uma notificação na Window criada mais acima, criamos também um segundo botão e por fin adicionamos tudo a Window criada no inicio e por ultimo definimos que a Window criada será e janela principal da Aplicação, isso porque na teoria uma aplicação Web pode conter uma ou mais janelas no navegador, mais precisa-se definir a principal.

NOTA: A medida que fazemos alterações em nossa aplicação não basta somente da um refresh no navegador para visualiza-las, isso porque o Apache Tomcat persiste as informações mesmo se o servidor for restartado, para isso adicionamos o parametro após o endereço no navegador (?restartApplication) com isso o vaadin se encarrega de terminar aquela sessão e começar outra, veremos mais detalhes, quando falarmos sobre ciclo de vida de Aplicações Web com Vaadin.

por hoje ficamos por aqui espero que tenham gostado e que consigam, montar também o vosso ambiente de desenvolvimento, reomenda-se também a utilização do Firefox junto com Firebug, mais isso veremos numa outra oportunidade.

Grande Abraço a Todos!

Overview Sobre Vaadin Framework

Overview Sobre Vaadin Framework

     Olá pessoal, hoje faremos um Overview sobre Vaadin Framework, os tópicos abordados serão: O que é Vaadin?, Pra que Serve?, Compatibilidade, Suporte a IDE, Filosofia , e até um exemplo de aplicação em Vaadin!

então mãos a obra!

 # O que é Vaadin e pra Que serve?

   O Vaadin é um framework escrito em Java, para desenvolvimento de Aplicações Web, possui uma ampla gama de componentes RIA, ou seja provê uma aplicação mais agradável, mais suave, mais sensivel e quase nos moldes de uma aplicação desktop, só que rodando diretamente do seu navegador.

# Compatibilidade

   O Vaadin utiliza uma arquitetura cliente-servidor, ou seja permite que você desenvolva separadamente a camada do cliente e a camada do servidor, falando sobre a camada do cliente é utilizado quase que invisivelmente o GWT(Google Web Toolkit) para compilar os códigos Java e transforma-los em JavaScript Otimizado, isso libera o desenvolvedor dos conhecimentos em JavaScript, o GWT já faz todo trabalho, e deixa sua aplicação compatível com a maioria dos navegadores.

NOTA: Toda Interface do Usuário é Escrita em Java, Puro Java e Mágicamente é Transformada em JavaScript ao Ser Compilada. Simplemente FANTASTICO!

# Suporte a IDE 

   O Vaadin não é ligado diretamente a nenhuma IDE, você poderá desenvolver aplicações com Vaadin utilizando qualquer IDE que suporte Java EE, no entando o Vaadin mantem um suporte especial para a IDE Eclipse isto porque de longe é uma das mais utilizadas para o desenvolvimento de Java, existe inclusive o Plugin Vaadin para Eclipse, que Proporciona, e Facilita a Criação de Novos Projetos, Criação de Widgets, Customização de Temas, e até Criação de Novos Componentes Personalizados, realmente vale muito apena Utilizar o Plugin do Vaadin para Eclipse, sem falar na facilidade de Atuailzar o Proprio Plugin para as Versões mais atuais. 

# Filosofia

   A Filosifia do Vaadin é bem ambiciosa, eles pretendem torna-la a melhor ferramente para o Desenvolvimento de Interfaces de Usuários para Aplicações de Negocio, o Vaadin foi projetado para ser a Ferramenta Certa para o Propósito certo, Vaadin Framework é para desenvolver Aplicações Web, não é pra desenvolver WebSites, não foi desenhado pra isto e não é recomendado, para estes fins existe o Flash, JSP/JSF e outros, a Robustez do Vaadin tem sido enfatizada bastante na Simplicidade de Desenvolvimento e na Facilidade de Manutenção, isto envolve as melhores práticas no desenvolvimento, o Vaadin foi projetado também para ser Extensível ou seja a Ferramenta nunca terá um limite, se por acaso você precisar de uma nova funcionalidade o Vaadin Framework te permite Extender classes, componentes e criar novos componentes que possa ser reutilizavel e que seja fácil de manter.

e por fim um Exemplo de Aplicação com Vaadin:

import com.vaadin.ui.*;

public class OlaMundo extends com.vaadin.Application{
    
    public void init(){
        Window main = new Window("Olá Janela");
        setMainWindow(main);
        main.addComponent(new Label("Olá Mundo!"));
    }
}
 

Não irei entrar em detalhe no momento, sobre o código acima, porém depois de compilado, exibirá no Navegador semelhante a Figura abaixo:

por hoje ficamos por aqui, no proximo post estarei detalhando com montar o ambiente de desenvolvimento em Vaadin e aí sim detalharemos a aplicação exemplo que foi criada mais acima, espero que tenha sido útil as explicações acima!

Grande Abraço a Todos e até a proxima!

Introdução ao Blog Vaadin Framework BR!

             

               Olá Pessoal, me Chamo Marconi César, sou desenvolvedor web há 6 anos e a pelo menos 4 anos venho utilizando varias tecnologias em meus projetos, dentre elas: PHP, Mysql, Java,Flex, a alguns dias tive a oportunidade de conhecer o Vaadin Framework e estou começando a dar meus primeiros passos, como a comunidade Brasileira mais específicamente em lingua portguesa é muito pequena, pretendo da uma força a quem esta começando  como eu a estudar Vaadin, estarei postando alguns tutoriais, dicas, receitas de bolo, e por ai vai, espero que gostem.

No Proximo post pretendo fazer um Overview Sobre o Vaadin Framework, até lá!

Grande Abraço a Todos!