Assistente Cliente móvel para aplicativo da web: Criação de um aplicativo cliente-servidor

O IDE permite que você crie MIDlets clientes que podem se conectar aos serviços Web por meio de um aplicativo Web middleware.

Este tutorial mostra como usar o assistente Cliente móvel para aplicativo Web para criar uma conexão com os serviços web se os seus dispositivos não oferecerem suporte à especificação JSR-172 para a plataforma Java ME. O assistente gera um servlet para calcular dois números que se conecta a um aplicativo web que inclui um cliente de serviço web e contém o método para somar os números fornecidos.

Se ainda não estiver familiarizado com o NetBeans Mobility ou o J2EE, antes de continuar seria recomendável ler o Guia de início rápido do NetBeans Java ME MIDP.

Conteúdo

O conteúdo desta página se aplica ao NetBeans IDE 7.0

Para acompanhar este tutorial, são necessários os recursos e softwares listados abaixo.

Software ou recurso Versão necessária
NetBeans IDE com Java ME Versão 7.0 e superior
Java Development Kit (JDK) Versão 6
GlassFish ou Tomcat Incluído no Java EE e em todas as instalações do IDE

Criando o projeto web

Antes de usar o assistente Cliente móvel para aplicativo web, você deve ter um projeto web que inclua um cliente de serviço web.

Vamos criar um novo projeto de aplicativo web para nosso Servlet Java do início. Para criar um aplicativo Java no IDE, faça o seguinte:

  1. Configure um projeto de aplicativo web
  2. Adicione lógica de negócio
  3. Compile o projeto

Configurando um projeto de aplicação Web

  1. Escolha Arquivo > Novo projeto (Ctrl-Shift-N). Em Categorias, selecione Java Web. Em Projetos, selecione aplicativo Web e clique em Próximo.
  2. Digite WebApplication no campo Nome do projeto. Especifique a Localização do projeto para qualquer diretório no computador. Para fins deste tutorial, esse diretório é chamado de NetBeansProjects.
  3. (Opcional) Marque a caixa de verificação Utilizar pasta dedicada para armazenamento de bibliotecas e especifique o local da pasta de bibliotecas.
  4. Desmarque a caixa de verificação Definir como projeto principal e clique em Próximo.
  5. No painel Servidor e configurações, deixe GlassFish Server 3.1 como o servidor no qual seu aplicativo para dispositivos móveis será implementado posteriormente e deixe J2EE 1.4 como a versão que deseja usar com seu aplicativo.
  6. Deixe Definir nível de código-fonte para 1.4 selecionado.

    Observação: o Caminho de contexto (ou seja, no servidor) se torna /WebApplication, que está baseado no nome dado ao projeto na etapa anterior.

  7. Clique em Próximo. No painel Frameworks, clique em Terminar para criar o projeto.
    O IDE cria a pasta do projeto NetBeansProjects/WebApplication. A pasta do projeto contém todas as fontes e metadados do projeto, como o script de construção Ant do projeto. O projeto WebApplication é aberto no IDE. A página de boas vindas, index.jsp, se abre no editor de código-fonte na janela principal.

Projeto WebApplication e index.jsp

Adicionando lógica de negócio

Para criar uma classe Java com um método público dentro de um projeto web que representará a lógica de negócio do aplicativo, execute as seguintes etapas:

  1. Na janela Projetos, clique com o botão direito do mouse no nó Pacotes de código-fonte e selecione Novo > Pacote Java. Digite MyPackage na caixa de texto Nome do pacote e clique em Terminar.
  2. Clique com o botão direito do mouse no nó MyPackage criado e escolha Novo > Classe Java. Digite Calculator na caixa de texto Nome da classe e clique em Terminar.
  3. No arquivo Calculator.java que é aberto no Editor de código-fonte, insira o seguinte método:
     public int calcSum(int a, int b) {
            return a + b;
        } 
  4. Pressione Ctrl + S para salvar suas edições.

Compilando o projeto

Na janela Projetos, clique com o botão direito do mouse no nó do projeto WebApplication e escolha Compilar (F11).
Seu aplicativo web para somar números está pronto.

Observação: por padrão, o projeto foi criado com o recurso Compilar ao salvar ativado, assim, não é necessário compilar o código primeiro.

Calculator.java

Criando o projeto móvel

O IDE permite criar um MIDlet cliente que pode se conectar a um aplicativo web recém-criado, fornecer dois números a ele e exibir sua soma.

Para criar um aplicativo cliente Java ME, faça o seguinte:

  1. Crie o projeto
  2. Adicione pacote e um MIDlet visual ao projeto
  3. Adicione componentes ao projeto
  4. Adicione comandos ao projeto
  5. Conecte os componentes para criar um fluxo de aplicativo
  6. Assistente Cliente Java ME para aplicativo web

Criando o projeto

O NetBeans IDE fornece um assistente que permite que você crie rapidamente um projeto MIDP.

  1. Escolha Arquivo > Novo projeto (Ctrl-Shift-N). Em Categorias, selecione Java ME. Em Projetos, selecione Aplicativo móvel e clique em Próximo.
  2. Digite MobileApplication no campo Nome do projeto. Altere a Localização do projeto para um diretório em seu sistema. Neste tutorial, esse diretório é definido como NetBeansProjects.
  3. Desmarque a caixa de verificação Criar Hello MIDlet (ela é marcada por padrão). Clique em Próximo.
  4. Deixe o Java(TM) Platform Micro Edition SDK 3.0 como a plataforma do emulador selecionada. Clique em Próximo e em Terminar.
    O IDE cria a pasta do projeto NetBeansProjects/MobileApplication.
    A pasta do projeto contém todos os códigos-fonte e os metadados do projeto, como o script Ant do projeto.

    Projeto MobileApplication criado

Adicionando pacote e um MIDlet visual ao projeto

  1. Selecione o projeto MobileApplication na janela Projetos e, a seguir, selecioneArquivo > Novo arquivo (Ctrl-N) . Em Categorias, selecione MIDP. Em Tipos de arquivo, selecione MIDlet visual. Clique em Próximo.
  2. Digite Calculator nos campos Nome do MIDlet e Nome da classe MIDP e CalculatorPackage no campo de texto Pacote. Clique em Terminar.
    O aplicativo é exibido na janela Design de fluxo do Visual Mobile Designer.

    Pacote e MIDlet visual adicionados

Adicionando componentes ao projeto

  1. Na Visualização de fluxo, arraste e solte os componentes a seguir da seção Exibíveis da Paleta:
    • Tela de espera
    • Formulário (x2)
    • Alerta

      Componentes adicionados

  2. Clique em Tela para alternar para a exibição Tela e selecione form na lista suspensa à direita do botão Analisador.
  3. Clique com o botão direito do mouse no componente form e selecione Novo/Adicionar > Campo de texto no menu pop-up.
  4. Repita a etapa 3 para adicionar outro Campo de texto a seu formulário.
  5. Selecione o componente textField e digite A como o valor de Label na janela Propriedades (abaixo da Paleta).
  6. Clique com o botão direito do mouse no componente A e escolha Renomear no menu pop-up.
  7. Na caixa de diálogo Renomear, digite fieldA no campo Novo nome e clique em OK.
  8. Selecione o componente textField1 e digite B como o valor de Label na janela Propriedades.
  9. Clique com o botão direito do mouse no componente B e escolha Renomear no menu pop-up.
  10. Na caixa de diálogo Renomear, digite fieldB no campo Novo nome e clique em OK.
    Os campos renomeados representarão os argumentos do método calcSum.

    Campos A e B

  11. Selecione form1 na lista suspensa à direita do botão Analisador.
  12. Clique com o botão direito do mouse no componente form1 e selecione Novo/Adicionar > Campo de texto no menu pop-up.
  13. Selecione o componente textField e digite Result como o valor de Label na janela Propriedades.
  14. Clique com o botão direito do mouse no componente Result e escolha Renomear no menu pop-up.
  15. Na caixa de diálogo Renomear, digite resultField no campo Novo nome e clique em OK.
    O campo renomeado destina-se a exibir a saída do método calcSum.

    Campo do resultado

  16. Selecione alert na lista suspensa à direita do botão Analisador.
  17. Na janela Propriedades, altere a propriedade Title para Alerta e a propriedade String para Erro ao obter resultados do aplicativo web.
    O alerta será exibido caso o aplicativo web não retorne qualquer resultado.

    Campo de alerta

Adicionando comandos ao projeto

  1. Na visualização Tela, com form1 selecionado, clique com o botão direito do mouse dentro da Tela de dispositivos e selecione Novo/Adicional > Comando Sair no menu pop-up.

    Form1: exitCommand adicionado

  2. Na visualização Tela, Selecione form na lista suspensa à direita do botão Analisador.
  3. Clique com o botão direito do mouse dentro da Tela de dispositivos e selecione Novo/Adicional > Comando Ok no menu pop-up.
  4. Repita a etapa 4 para adicionar Comando Cancelar a partir do menu pop-up.

    Form: okCommand e cancelCommand adicionados

  5. Pressione Ctrl + S para salvar suas edições.

Conectando os componentes para criar um fluxo de aplicativo

Na visualização Fluxo, clique no texto Started no Dispositivo móvel e arraste-o para o componente form. Da mesma forma, conecte os componentes como mostrado no gráfico seguinte.

Fluxo de aplicativo

Assistente Cliente Java ME para aplicativo web

Vamos usar o assistente Cliente Java ME para aplicativo web para criar um cliente para dispositivos móveis dentro do projeto móvel com a seleção do método calcSum.

  1. Expanda MobileApplication, clique com o botão direito do mouse em Pacotes de código-fonte e selecione Novo > Cliente Java ME para aplicativo web.
  2. No painel Tipo de servlet e de cliente, selecione o tipo de aplicativo web com o qual o MIDlet interage: digite WebToMobileServlet como o Nome do servlet, assegure-se de que opção Métodos no Aplicativo web esteja selecionada (como o cliente móvel se conectará diretamente ao aplicativo web) e clique em Próximo.

    Assistente

  3. No painel Métodos no projeto web, marque int calcSum (int a, int b) e clique em Próximo.
  4. No painel Opções do cliente, deixe o nome e o pacote da classe do cliente gerada como estão, assegure-se de que as opções Gerar stubs e Permitir ponto flutuante estejam marcadas e clique em Terminar.
    O cliente Java ME e os arquivos de mapeamento são gerados sob o projeto Java ME.
    O servlet e as classes de apoio são geradas sob o projeto web.

    Cliente Java ME gerado

Adicionando código-fonte ao cliente Java ME

  1. Clique na aba Calculator.java.
  2. Na visualização Tela, Selecione waitScreen na lista suspensa à direita do botão Analisador.
  3. Clique com o botão direito do mouse na tarefa [SimpleCancellableTask] em Recursos e selecione Ir para o código-fonte no menu pop-up.
  4. Na janela Editor de código-fonte, localize a seção // write task-execution user code here" e substitua-a pelo seguinte código:
        WebToMobileClient wc = new WebToMobileClient();
        int a = Integer.valueOf(getFieldA().getString()).intValue();
        int b = Integer.valueOf(getFieldB().getString()).intValue();
        int result = wc.calcSum(a, b);
        System.out.println(result);
        getResultField().setString(String.valueOf(result));
  5. Pressione Ctrl + S para salvar suas edições.

Implementado o projeto web

Para implementar o aplicativo web, na janela Projetos, clique com o botão direito do mouse no nó WebApplication e selecione Implementar no menu pop-up.
A janela Saída exibe o seguinte:

WebApplication implementado

início

Executando o projeto do cliente

Para executar o aplicativo cliente móvel, selecione Executar > Executar o projeto principal ou pressione F6 para executar o projeto principal.

Observação: Antes de executar o aplicativo cliente, verifique se o aplicativo do lado do servidor está implementado e em execução.

Conforme MobileApplication é executado, uma janela do emulador é aberta e exibe o aplicativo em execução no emulador do dispositivo padrão.

Aplicativo cliente no emulador

Verificando o funcionamento

  1. Na janela Emulador, digite qualquer número no campo A, alterne para o campo B clicando na seta para baixo no botão central e digite outro número no campo B.

    A e B definidos

  2. Clique no botão sob Menu, selecione Ok no menu pop-up e clique no botão central no Emulador para confirmar.
    Depois que WebApplication calcular a soma dos números digitados, form1 será exibido com o resultado.

    Resultado calculado

    Observação: Para ver o resultado final do tutorial, baixe MobileCientToWebApplicationSample.zip.

início


Consulte também

início

get support for the NetBeans

Support


By use of this website, you agree to the NetBeans Policies and Terms of Use. © 2013, Oracle Corporation and/or its affiliates. Sponsored by Oracle logo