| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> | |
| <!-- | |
| Copyright (c) 2009, 2010, Oracle and/or its affiliates. All rights reserved. | |
| --> | |
| <HTML> | |
| <HEAD> | |
| <TITLE>Assistente Cliente móvel para aplicativo da web: Criação de um aplicativo cliente-servidor - Tutorial do NetBeans Java ME</TITLE> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" > | |
| <link rel="stylesheet" type="text/css" href="../../../netbeans.css"> | |
| </HEAD> | |
| <BODY> | |
| <a name="top"></a> | |
| <H1>Assistente Cliente móvel para aplicativo da web: Criação de um aplicativo cliente-servidor </H1> | |
| <p>O IDE permite que você crie MIDlets clientes que podem se conectar aos serviços Web por meio de um aplicativo Web middleware.</p> | |
| <P>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 à <a href="http://jcp.org/en/jsr/summary?id=172">especificação JSR-172</a> 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.</p> | |
| <p>Se ainda não estiver familiarizado com o NetBeans Mobility ou o J2EE, antes de continuar seria recomendável ler o <A HREF="../../docs/javame/quickstart.html">Guia de início rápido do NetBeans Java ME MIDP</A>.</p> | |
| <p><b>Conteúdo</b></p> | |
| <img src="../../../images_www/articles/70/netbeans-stamp.gif" class="stamp" width="114" height="114" alt="O conteúdo desta página se aplica ao NetBeans IDE 7.0" title="O conteúdo desta página se aplica ao NetBeans IDE 7.0" > | |
| <ul class="class"> | |
| <li><a href="#create-web">Criando o projeto web</a> | |
| <ul> | |
| <LI><A HREF="#create">Configurando um projeto de aplicação Web</A> | |
| </LI> | |
| <LI><A HREF="#add">Adicionando lógica de negócio</A> | |
| </LI> | |
| <LI><A HREF="#comp">Compilando o projeto</A> | |
| </LI> | |
| </ul></li> | |
| <li><a href="#create-mob">Criando projeto móvel</a> | |
| <ul> | |
| <LI><A HREF="#create-prj">Criando o projeto | |
| </A> | |
| </LI> | |
| <LI><A HREF="#add-pkg">Adicionando pacote e um MIDlet visual ao projeto</A> | |
| </LI> | |
| <li><A href="#add-component">Adicionando componentes ao projeto</a></li> | |
| <li><A HREF="#add-command">Adicionando comandos ao projeto</a></li> | |
| <li><A HREF="#connect-component">Conectando os componentes para criar um fluxo de aplicativo</a></li> | |
| <li><A HREF="#wizard">Assistente Usando o Cliente Java ME para aplicativo web</A></li> | |
| <li><A HREF="#wizCode">Adicionando código-fonte to cliente Java ME</A></li> | |
| </ul></li> | |
| <LI><A HREF="#deploy">Implementado o projeto web</A> | |
| </LI> | |
| <LI><A HREF="#run">Executando o projeto móvel</A> | |
| </LI> | |
| <LI><A HREF="#check">Verificando o funcionamento</A> | |
| </LI> | |
| <li><a href="#see-also">Consulte também</a></li> | |
| </ul> | |
| <p><b>Para acompanhar este tutorial, são necessários os recursos e softwares listados abaixo.</b></p> | |
| <table> | |
| <tbody> | |
| <tr> | |
| <th class="tblheader" scope="col">Software ou recurso</th> | |
| <th class="tblheader" scope="col">Versão necessária</th> | |
| </tr> | |
| <tr> | |
| <td class="tbltd1"><a href="https://netbeans.org/downloads/index.html">NetBeans IDE com Java ME</a></td> | |
| <td class="tbltd1">Versão 7.0 e superior </td> | |
| </tr> | |
| <tr> | |
| <td class="tbltd1"><a href="http://www.oracle.com/technetwork/java/javase/downloads/index.html">Java Development Kit</a> (JDK)</td> | |
| <td class="tbltd1">Versão 6</td> | |
| </tr> | |
| <tr> | |
| <td class="tbltd1">GlassFish ou Tomcat</td> | |
| <td class="tbltd1">Incluído no <b>Java EE</b> e em <b>todas</b> as instalações do IDE</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| <!--<a name="sample-app"></a> | |
| <H2>Installing and Running the Sample Application</H2> | |
| <P>Before we begin you might want to see final result of the tutorial.</P> | |
| <p>Placeholder</p> | |
| <P>Take the following steps to install the <tt>LoginScreenExample</tt> application:</P> | |
| <OL> | |
| <LI>Download <A HREF="https://netbeans.org/projects/samples/downloads/download/Samples/Mobile/WebToMobile.zip">WebToMobileExample.zip</A>. This download contains the completed NetBeans Mobility and Web projects.</LI> | |
| <LI>Unzip the file.</LI> | |
| <LI>In the IDE, choose <tt>File</tt> > <tt>Open Project</tt> and browse to the folder that contains the unzipped files with the <tt>WebToMobileExample</tt> project.</LI> | |
| <li>Click Open Project.</li> | |
| <LI>The Projects view should look like the following:</li> | |
| <p class="align-center"> | |
| <IMG SRC="../../../images_www/articles/71/mobility/webtomobile/.png" NAME="graphics1" ALT="Project window with sample projects opened" BORDER=1> </p> | |
| <LI>In the Projects window, | |
| right-click the project <tt>AAA</tt> node and choose | |
| Run Project (or press F6 key).</li> | |
| <li>Right-click the | |
| project <tt>AAA</tt> node and choose Run Project. As the | |
| application runs, an emulator window opens and displays the | |
| application running in the default device emulator. </LI> | |
| <LI>In the Emulator window, click the button underneath | |
| "Launch".<BR>The emulator displays BBB, as shown:</li> <p class="align-center"><IMG SRC="../../../images_www/articles/71/mobility/webtomobile/.png" NAME="graphics3" ALT="placeholder" BORDER=1> </p> | |
| </OL> | |
| <UL> | |
| <LI>Moving the cursor up and down allows you to | |
| navigate between the Login and Password fields. | |
| </LI> | |
| <li>Click on the central button enables the selected text field for editing.</li> | |
| <LI>Click the button underneath "Login" to finish. | |
| </LI> | |
| <LI>If the application connects to the server, you'll | |
| see the <code>alert1</code> component displayed on the screen with a "Login | |
| Successful" message. | |
| </LI> | |
| </UL> | |
| <p class="align-center"><a href="#top">top</a></p>--> | |
| <a name="create-web"></a> | |
| <H2>Criando o projeto web</H2> | |
| <p>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.</p> | |
| <P><!--Now that you have seen the AAA in action,--> Vamos | |
| <!--go back to the beginning and--> | |
| 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:</P> | |
| <OL> | |
| <LI><A HREF="#create">Configure um projeto de aplicativo web</A> | |
| </LI> | |
| <LI><A HREF="#add">Adicione lógica de negócio</A> | |
| </LI> | |
| <LI><A HREF="#comp">Compile o projeto</A> | |
| </LI> | |
| </OL> | |
| <H3><A NAME="create"></A>Configurando um projeto de aplicação Web</H3> | |
| <OL> | |
| <LI>Escolha <tt>Arquivo</tt> > <tt>Novo projeto (Ctrl-Shift-N)</tt>. Em Categorias, selecione Java Web. Em Projetos, selecione aplicativo Web e clique em Próximo. | |
| </LI> | |
| <LI>Digite <CODE>WebApplication</CODE> 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 <tt>NetBeansProjects</tt>. | |
| </LI> | |
| <li>(Opcional) Marque a caixa de verificação Utilizar pasta dedicada para armazenamento de bibliotecas e especifique o local da pasta de bibliotecas.</li> | |
| <li>Desmarque a caixa de verificação Definir como projeto principal e clique em Próximo. </li> | |
| <li>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.</li> | |
| <li>Deixe Definir nível de código-fonte para 1.4 selecionado. | |
| <p class="notes"><b>Observação:</b> o Caminho de contexto (ou seja, no servidor) se torna <tt>/WebApplication</tt>, que está baseado no nome dado ao projeto na etapa anterior.</p> | |
| </li> | |
| <li>Clique em Próximo. No painel Frameworks, clique em Terminar para criar o projeto.<br> | |
| O IDE cria a pasta do projeto <tt>NetBeansProjects/WebApplication</tt>. 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. </li> | |
| </ol> | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/projects-window.png" rel="lytebox" | |
| title="Projeto WebApplication e index.jsp"> <img src="../../../images_www/articles/71/mobility/webtomobile/projects-window-reduced.png" | |
| alt="Projeto WebApplication e index.jsp" border=1></a></p> | |
| <H3><A NAME="add"></A>Adicionando lógica de negócio</H3> | |
| <p>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: </p> | |
| <ol> | |
| <li>Na janela Projetos, clique com o botão direito do mouse no nó <tt>Pacotes de código-fonte</tt> e selecione Novo > Pacote Java. Digite <tt>MyPackage</tt> na caixa de texto Nome do pacote e clique em Terminar.</li> | |
| <li>Clique com o botão direito do mouse no nó <tt>MyPackage</tt> criado e escolha Novo > Classe Java. Digite <tt>Calculator</tt> na caixa de texto Nome da classe e clique em Terminar. </li> | |
| <li>No arquivo <tt>Calculator.java</tt> que é aberto no Editor de código-fonte, insira o seguinte método: | |
| <pre> public int calcSum(int a, int b) { | |
| return a + b; | |
| } </pre> | |
| </li> | |
| <li>Pressione Ctrl + S para salvar suas edições.</li> | |
| </ol> | |
| <H3><A NAME="comp"></A>Compilando o projeto</H3> | |
| <p>Na janela Projetos, clique com o botão direito do mouse no nó do projeto <tt>WebApplication</tt> e escolha Compilar (F11).<br>Seu aplicativo web para somar números está pronto.</p> | |
| <p class="notes"><b>Observação:</b> por padrão, o projeto foi criado com o recurso Compilar ao salvar ativado, assim, não é necessário compilar o código primeiro.</p> | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/calculator.png" rel="lytebox" | |
| title="Calculator.java"> <img src="../../../images_www/articles/71/mobility/webtomobile/calculator-reduced.png" | |
| alt="Calculator.java" border=1></a></p> | |
| <a name="create-mob"></a> | |
| <h2>Criando o projeto móvel</h2> | |
| <p>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. </p> | |
| <p> Para criar um aplicativo cliente Java ME, faça o seguinte:</P> | |
| <OL> | |
| <LI><A HREF="#create-prj">Crie o projeto</A> | |
| </LI> | |
| <LI><A HREF="#add-pkg">Adicione pacote e um MIDlet visual ao projeto</A> | |
| </LI> | |
| <LI><A HREF="#add-component">Adicione componentes ao projeto</A> | |
| </LI> | |
| <li><A HREF="#add-command">Adicione comandos ao projeto</a></li> | |
| <li><A HREF="#connect-component">Conecte os componentes para criar um fluxo de aplicativo</a></li> | |
| <li><a href="#wizard">Assistente Cliente Java ME para aplicativo web</a></li> | |
| </ol> | |
| <H3><A NAME="create-prj"></A>Criando o projeto | |
| </H3> | |
| <p>O NetBeans IDE fornece um assistente que permite que você crie rapidamente um projeto MIDP.</p> | |
| <OL> | |
| <LI>Escolha <tt>Arquivo</tt> > <tt>Novo projeto (Ctrl-Shift-N)</tt>. Em Categorias, selecione Java ME. Em Projetos, selecione Aplicativo móvel e clique em Próximo. </LI> | |
| <LI>Digite <tt>MobileApplication</tt> 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 <tt>NetBeansProjects</tt>.</LI> | |
| <LI>Desmarque a caixa de verificação Criar Hello MIDlet (ela é marcada por padrão). Clique em Próximo. </LI> | |
| <LI>Deixe o Java(TM) Platform Micro Edition SDK 3.0 como a plataforma do emulador selecionada. Clique em Próximo e em Terminar.<br> | |
| O IDE cria a pasta do projeto <tt>NetBeansProjects/MobileApplication</tt>.<br>A pasta do projeto contém todos os códigos-fonte e os metadados do projeto, como o script Ant do projeto. | |
| <p class="align-center"> | |
| <IMG SRC="../../../images_www/articles/71/mobility/webtomobile/mobile-prj-created.png" NAME="graphics1" ALT="Projeto MobileApplication criado" BORDER=1> </p> | |
| </LI> | |
| </OL> | |
| <h3><A NAME="add-pkg"></A>Adicionando pacote e um MIDlet visual ao projeto</h3> | |
| <OL> | |
| <LI>Selecione o projeto <CODE>MobileApplication</CODE> na janela Projetos e, a seguir, selecione<tt>Arquivo</tt> > <tt>Novo arquivo (Ctrl-N)</tt> . Em Categorias, selecione MIDP. Em Tipos de arquivo, selecione | |
| MIDlet visual. Clique em Próximo.</LI> | |
| <LI>Digite <CODE>Calculator</CODE> nos campos Nome do MIDlet e Nome da classe MIDP e <tt>CalculatorPackage</tt> no campo de texto Pacote. Clique em Terminar.<br> | |
| O aplicativo é exibido na janela Design de fluxo do Visual Mobile Designer. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/midlet-added.png" rel="lytebox" | |
| title="Pacote e MIDlet visual adicionados"> <img src="../../../images_www/articles/71/mobility/webtomobile/midlet-added-reduced.png" | |
| alt="Pacote e MIDlet visual adicionados" border=1></a></p> | |
| </LI> | |
| </OL> | |
| <h3><A NAME="add-component"></A>Adicionando componentes ao projeto</h3> | |
| <OL> | |
| <LI>Na Visualização de fluxo, arraste e solte os componentes a seguir da seção Exibíveis da Paleta: | |
| <UL> | |
| <LI>Tela de espera</LI> | |
| <LI>Formulário (x2)</LI> | |
| <li>Alerta | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/components-added.png" rel="lytebox" | |
| title="Componentes adicionados"> <img src="../../../images_www/articles/71/mobility/webtomobile/components-added-reduced.png" | |
| alt="Componentes adicionados" border=1></a></p></li> | |
| </UL> </LI> | |
| <li>Clique em Tela para alternar para a exibição Tela e selecione <tt>form</tt> na lista suspensa à direita do botão Analisador.</li> | |
| <li>Clique com o botão direito do mouse no componente <tt>form</tt> e selecione <tt>Novo/Adicionar</tt> > <tt>Campo de texto</tt> no menu pop-up.</li> | |
| <li>Repita a etapa 3 para adicionar outro Campo de texto a seu formulário.</li> | |
| <li>Selecione o componente <tt>textField</tt> e digite <tt>A</tt> como o valor de <tt>Label</tt> na janela Propriedades (abaixo da Paleta).</li> | |
| <li>Clique com o botão direito do mouse no componente <tt>A</tt> e escolha Renomear no menu pop-up.</li> | |
| <li>Na caixa de diálogo Renomear, digite <tt>fieldA</tt> no campo Novo nome e clique em OK.</li> | |
| <li>Selecione o componente <tt>textField1</tt> e digite <tt>B</tt> como o valor de <tt>Label</tt> na janela Propriedades.</li> | |
| <li>Clique com o botão direito do mouse no componente <tt>B</tt> e escolha Renomear no menu pop-up.</li> | |
| <li>Na caixa de diálogo Renomear, digite <tt>fieldB</tt> no campo Novo nome e clique em OK.<br> | |
| Os campos renomeados representarão os argumentos do método <tt>calcSum</tt>. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/fields.png" rel="lytebox" | |
| title="Campos A e B"> <img src="../../../images_www/articles/71/mobility/webtomobile/fields-reduced.png" | |
| alt="Campos A e B" border=1></a></p></li> | |
| <li>Selecione <tt>form1</tt> na lista suspensa à direita do botão Analisador.</li> | |
| <li>Clique com o botão direito do mouse no componente <tt>form1</tt> e selecione <tt>Novo/Adicionar</tt> > <tt>Campo de texto</tt> no menu pop-up.</li> | |
| <li>Selecione o componente <tt>textField</tt> e digite <tt>Result</tt> como o valor de <tt>Label</tt> na janela Propriedades.</li> | |
| <li>Clique com o botão direito do mouse no componente <tt>Result</tt> e escolha Renomear no menu pop-up.</li> | |
| <li>Na caixa de diálogo Renomear, digite <tt>resultField</tt> no campo Novo nome e clique em OK.<br>O campo renomeado destina-se a exibir a saída do método <tt>calcSum</tt>. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/resultfield.png" rel="lytebox" | |
| title="Campo do resultado"> <img src="../../../images_www/articles/71/mobility/webtomobile/resultfield-reduced.png" | |
| alt="Campo do resultado" border=1></a></p></li> | |
| <li>Selecione <tt>alert</tt> na lista suspensa à direita do botão Analisador.</li> | |
| <li> Na janela Propriedades, altere a propriedade <tt>Title</tt> para <tt>Alerta</tt> e a propriedade <tt>String</tt> para <tt>Erro ao obter resultados do aplicativo web</tt>.<br>O alerta será exibido caso o aplicativo web não retorne qualquer resultado. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/alert.png" rel="lytebox" | |
| title="Campo de alerta"> <img src="../../../images_www/articles/71/mobility/webtomobile/alert-reduced.png" | |
| alt="Campo de alerta" border=1></a></p> </li> | |
| </ol> | |
| <h3><A NAME="add-command"></A>Adicionando comandos ao projeto</h3> | |
| <ol> | |
| <li>Na visualização Tela, com <tt>form1</tt> selecionado, clique com o botão direito do mouse dentro da Tela de dispositivos e selecione <tt>Novo/Adicional</tt> > <tt>Comando Sair</tt> no menu pop-up. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/second-form.png" rel="lytebox" | |
| title="Form1: exitCommand adicionado"> <img src="../../../images_www/articles/71/mobility/webtomobile/second-form-reduced.png" | |
| alt="Form1: exitCommand adicionado" border=1></a></p> </li> | |
| <li>Na visualização Tela, Selecione <tt>form</tt> na lista suspensa à direita do botão Analisador.</li> | |
| <li>Clique com o botão direito do mouse dentro da Tela de dispositivos e selecione <tt>Novo/Adicional</tt> > <tt>Comando Ok</tt> no menu pop-up.</li> | |
| <li>Repita a etapa 4 para adicionar <tt>Comando Cancelar</tt> a partir do menu pop-up. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/first-form.png" rel="lytebox" | |
| title="Form: okCommand e cancelCommand adicionados"> <img src="../../../images_www/articles/71/mobility/webtomobile/first-form-reduced.png" | |
| alt="Form: okCommand e cancelCommand adicionados" border=1></a></p></li> | |
| <li>Pressione Ctrl + S para salvar suas edições.</li> | |
| </ol> | |
| <h3><A NAME="connect-component"></A>Conectando os componentes para criar um fluxo de aplicativo</h3> | |
| <p>Na visualização Fluxo, clique no texto <tt>Started</tt> no Dispositivo móvel e arraste-o para o componente <tt>form</tt>. Da mesma forma, conecte os componentes como mostrado no gráfico seguinte.</p> | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/app-flow.png" rel="lytebox" | |
| title="Fluxo de aplicativo"> <img src="../../../images_www/articles/71/mobility/webtomobile/app-flow-reduced.png" | |
| alt="Fluxo de aplicativo" border=1></a></p> | |
| <h3><A NAME="wizard"></A>Assistente Cliente Java ME para aplicativo web</h3> | |
| <p>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 <tt>calcSum</tt>.</p> | |
| <OL> | |
| <LI>Expanda <tt>MobileApplication</tt>, clique com o botão direito do mouse em <tt>Pacotes de código-fonte</tt> e selecione <tt>Novo</tt> > <tt>Cliente Java ME para aplicativo web</tt>.</LI> | |
| <li>No painel Tipo de servlet e de cliente, selecione o tipo de aplicativo web com o qual o MIDlet interage: digite <tt>WebToMobileServlet</tt> 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. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/wizard.png" rel="lytebox" | |
| title="Assistente"> <img src="../../../images_www/articles/71/mobility/webtomobile/wizard-reduced.png" | |
| alt="Assistente" border=1></a></p></li> | |
| <li>No painel Métodos no projeto web, marque <tt>int calcSum (int a, int b)</tt> e clique em Próximo.</li> | |
| <li>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.<br> | |
| O cliente Java ME e os arquivos de mapeamento são gerados sob o projeto Java ME.<br> | |
| O servlet e as classes de apoio são geradas sob o projeto web. | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/client-generated.png" rel="lytebox" | |
| title="Cliente Java ME gerado"> <img src="../../../images_www/articles/71/mobility/webtomobile/client-generated-reduced.png" | |
| alt="Cliente Java ME gerado" border=1></a></p></li> | |
| </ol> | |
| <h3><A NAME="wizCode"></A>Adicionando código-fonte ao cliente Java ME</h3> | |
| <ol> | |
| <li>Clique na aba <tt>Calculator.java</tt>.</li> | |
| <li>Na visualização Tela, Selecione <tt>waitScreen</tt> na lista suspensa à direita do botão Analisador.</li> | |
| <li>Clique com o botão direito do mouse na <tt>tarefa [SimpleCancellableTask]</tt> em Recursos e selecione Ir para o código-fonte no menu pop-up.</li> | |
| <li>Na janela Editor de código-fonte, localize a seção <tt>// write task-execution user code here"</tt> e substitua-a pelo seguinte código: | |
| <pre> 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));</pre></li> | |
| <li>Pressione Ctrl + S para salvar suas edições.</li> | |
| </ol> | |
| <a name="deploy"></a><H2>Implementado o projeto web</H2> | |
| <p>Para implementar o aplicativo web, na janela Projetos, clique com o botão direito do mouse no nó <tt>WebApplication</tt> e selecione Implementar no menu pop-up.<br>A janela Saída exibe o seguinte:</p> | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/web-deploy.png" rel="lytebox" | |
| title="WebApplication implementado"> <img src="../../../images_www/articles/71/mobility/webtomobile/web-deploy-reduced.png" | |
| alt="WebApplication implementado" border=1></a></p> | |
| <p class="align-center"><a href="#top">início</a></p> | |
| <H2><A NAME="run"></A>Executando o projeto do cliente</H2> | |
| <p> Para executar o aplicativo cliente móvel, selecione <tt>Executar</tt> > <tt>Executar o projeto principal</tt> ou pressione F6 para executar o projeto principal.</p> | |
| <p class="notes"><b>Observação:</b> Antes de executar o aplicativo cliente, verifique se o aplicativo do lado do servidor está implementado e em execução.</p> | |
| <p>Conforme <tt>MobileApplication</tt> é executado, uma janela do emulador é aberta e exibe o aplicativo em execução no emulador do dispositivo padrão.</p> | |
| <p class="align-center"> | |
| <a href="../../../images_www/articles/71/mobility/webtomobile/client-run.png" rel="lytebox" | |
| title="Aplicativo cliente no emulador"> <img src="../../../images_www/articles/71/mobility/webtomobile/client-run-reduced.png" | |
| alt="Aplicativo cliente no emulador" border=1></a></p> | |
| <a name="check"></a><H2>Verificando o funcionamento</H2> | |
| <ol> | |
| <li>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. | |
| <p class="align-center"><img src="../../../images_www/articles/71/mobility/webtomobile/ab.png" | |
| alt="A e B definidos" border=1></p></li> | |
| <li>Clique no botão sob Menu, selecione Ok no menu pop-up e clique no botão central no Emulador para confirmar.<br> | |
| Depois que WebApplication calcular a soma dos números digitados, <tt>form1</tt> será exibido com o resultado. | |
| <p class="align-center"><img src="../../../images_www/articles/71/mobility/webtomobile/abresult.png" | |
| alt="Resultado calculado" border=1></p> | |
| <p class="notes"><b>Observação:</b> Para ver o resultado final do tutorial, baixe <A HREF="https://netbeans.org/project_downloads/samples/Samples/Mobile/MobileClientToWebApplicationSample.zip">MobileCientToWebApplicationSample.zip</A>.</p> </li> | |
| </ol> | |
| <p class="align-center"><a href="#top">início</a></p> | |
| <div class="feedback-box"><a href="/about/contact_form.html?to=6&subject=Creating%20a%20Client-Server%20Application">Envie-nos seus comentários</a><br style="clear:both;" ></div> | |
| <br style="clear:both;" > | |
| <a name="see-also"></a> | |
| <H2>Consulte também</H2> | |
| <UL> | |
| <li><a href="smscomposer.html">Componentes padrão do Visual Mobile Designer: criando um aplicativo SMS Composer</a></li> | |
| <li><a href="filebrowser.html">Componentes padrão do Visual Mobile Designer: criando um navegador de arquivo de dispositivo móvel</a></li> | |
| <li><a href="pimbrowser.html">Componentes padrão do Visual Mobile Designer: criando um aplicativo de gerenciador de informações pessoais</a></li> | |
| <li><a href="splashscreen.html">Componentes padrão do Visual Mobile Designer: usando telas de splash em aplicativos Java ME</a></li> | |
| <li><a href="waitscreen.html">Componentes personalizados do Visual Mobile Designer: Criando telas de espera para aplicativos móveis</a></li> | |
| <li><a href="tableitem.html">Componentes padrão do Visual Mobile Designer: usando itens de tabela em aplicativos Java ME</a></li> | |
| <li><a href="http://wiki.netbeans.org/VisualMobileDesignerPalatteReference">Reference: Visual Mobile Designer Palette Guide</a></li> | |
| </UL> | |
| <p class="align-center"><a href="#top">início</a></p> | |
| </BODY> | |
| </HTML> |