Componentes padrão do Visual Mobile Designer: criando telas de espera para aplicativos móveis
Os aplicativos Java ME oferecem com frequência conexões para uma rede para funcionarem corretamente. Infelizmente, as redes sem-fio ainda são relativamente lentas. Uma tarefa em segundo plano esperando por uma conexão de rede ou a transferência de dados pode pausar seu aplicativo e fazer com que os se perguntem se a tela está indefinidamente congelada ou se é melhor desligar e tentar novamente mais tarde (ou não voltar a conectar). Portanto, como os desenvolvedores evitam esta experiência desagradável, mas muito comum?
A resposta para isso é adicionar uma "tela de espera". As telas de espera permitem que os usuários executem uma tarefa de bloqueio de segundo plano (por exemplo, conexão a uma rede) e mostram o progresso da tarefa ou exibem uma mensagem na tela para informar ao usuário que o aplicativo ainda está funcionando como esperado. Neste tutorial, mostraremos como o Visual Mobile Designer (VMD) simplifica a criação de telas de espera ao incluir um componente Tela de espera personalizado, que você pode personalizar e adicionar em seu fluxo do aplicativo.
Se você é novo no desenvolvimento de aplicativos móveis no NetBeans, deveria começar pelo Guia de início rápido do NetBeans Java ME MIDP antes de continuar.
Nota: se estiver utilizando o NetBeans IDE 6.8, consulte o tutorial Criando telas de espera para aplicativos móveis no NetBeans IDE 6.8.
Conteúdo
Para concluir este tutorial, são necessários os seguintes recursos e softwares:
Como funciona o componente Tela de espera
Há duas formas para criar tarefas em segundo plano para o componente Tela de espera. Você pode escrever uma classe que implemente a interface CancellableTask ou apenas usar o recurso SimpleCancellableTask. Você atribui tarefas em segundo plano na Tela de espera usando o método setTask().
O componente Tela de espera alterna automaticamente para um objeto exibível diferente quando a tarefa em segundo plano é concluída. Se a tarefa termina com êxito, a Tela de espera alterna para uma exibição fornecida pelos métodos setNextDisplayable(). Se a tarefa falha, a Tela de espera alterna para uma exibição fornecida pelos métodos setFailureDisplayable(). Se não houver um padrão exibível definido para falha, a Tela de espera alterna para uma exibição especificada pelo método setNextDisplayable(). Se não houver uma próxima tela exibível, a Tela de espera alterna de volta para a tela que foi anteriormente exibida.
Observe que este componente está disponível para aplicativos que suportam somente o perfil de dispositivo MIDP 2.0.
início
Instalando e executando o aplicativo de amostra
Antes de começar, talvez você queira ver o resultado final do
tutorial.
Siga as etapas seguintes para instalar o aplicativo de amostra waitscreensample:
- Faça download de WaitScreenExample.zip.
- Descompacte o arquivo.
- No IDE, escolha Arquivo > Abrir projeto e vá para a pasta que contém o arquivo descompactado.
- Clique em Abrir projeto.
A visualização Projeto deve ter uma aparência semelhante a seguinte:
- Na janela Projetos, clique com o botão direito do mouse no nó do projeto e escolha Executar (ou pressione F6). Conforme o aplicativo é executado, uma janela do emulador se abre e exibe o aplicativo que está sendo executado no emulador do dispositivo padrão.
- Na janela Emulador, clique no botão abaixo de
"Iniciar." O emulador exibe o endereço URL do website do NetBeans:: http://netbeans.org.
- Clique no botão abaixo de "OK." A tela pergunta se está de acordo em usar tempo de conexão.
- Clique no botão "Sim" abaixo para continuar. Quando o emulador tenta se conectar ao site, ele exibe a Tela de espera.
- Após o emulador se conectar, feche o aplicativo.
início
Criando um aplicativo móvel com o componente Tela de espera personalizado
Criando o projeto WaitScreenExample
- Escolha Arquivo > Novo projeto (Ctrl-Shift-N). Em Categorias, selecione Java ME. Em Projetos, selecione Aplicativo móvel e clique em Próximo.
- Insira
WaitScreenExample no campo Nome do projeto. Altere a Localização do projeto para um diretório em seu sistema. Este diretório denomina-se $PROJECTHOME.
- Desmarque a caixa de verificação Criar Hello MIDlet. Clique em Próximo.
- Deixe o Sun Java Wireless Toolkit 2.5.2 como a plataforma do emulador selecionada. Clique em Terminar.
Adicionando pacotes em um Visual MIDlet ao projeto WaitScreenExample
- Escolha o projeto
WaitScreenExample na janela Projetos e, a seguir, escolha Arquivo > Novo arquivo (Ctrl-N). Em Categorias, selecione Java. Em Tipos de arquivo,
selecione Pacote Java. Clique em Próximo.
- Insira
waitscreenexample no campo Nome do pacote. Clique em Terminar.
- Escolha o pacote
waitscreenexample na janela Projetos e, a seguir, escolha Novo > Novo arquivo (Ctrl-N). Em Categorias, selecione MIDP. Em Tipos de arquivo, selecione
MIDlet visual. Clique em Próximo.
- Insira
MyWaitScreenMidlet nos campos Nome MIDlet e Nome da classe MIDP. Clique em Terminar.
Adicionando componentes ao MyWaitScreenMidlet
Selecionando o Visual MIDlet abre o Visual Mobile Designer (VMD). Ao clicar na visualização Fluxo na parte superior da janela VMD, o Designer de fluxo se abre, onde você projeta o fluxo do aplicativo.
- Alterne seu Visual MIDlet para a visualização Fluxo. Arraste os seguintes componentes Tela da paleta de componentes e solte-os no Designer de fluxo:
-
Caixa de texto
-
Tela de espera
-
Lista
-
Alerta
- Escolha textBox. Na janela Propriedades (abaixo da paleta de componentes), altere a propriedade Título para
Caixa de texto.
- Use o mesmo processo para alterar os títulos dos seguintes componentes:
- Use os valores das propriedades em cada um dos componentes seguintes:
-
Altere a propriedade Texto de textBox para http://netbeans.org
-
Altere a propriedade String de alert para Falha de conexão
-
Altere a propriedade Texto de WaitScreen para Aguarde...
A visualização Fluxo deve se parecer com a seguinte imagem:

Adicionando recursos de imagem
Nesta seção, você adiciona imagens que são usadas pela Tela de espera e pela Tela de alerta.
- Faça o download e copie os arquivos alert.png e sandglass.png na pasta
$PROJECTHOME/src/waitscreenexample.
- Clique com o botão direito do mouse no componente alert e escolha Propriedades no menu pop-up.
- Na caixa de diálogo Propriedades, clique no botão de reticências (
) na propriedade Imagem.
- Na caixa de diálogo Imagem, clique em Adicionar.
O componente image1 é adicionado.
- Clique em Procurar e, na caixa de diálogo Abrir, especifique o caminho para o arquivo alert.png copiado.
- Clique em Abrir.
A imagem é adicionada.
- Clique em OK para fechar a caixa de diálogo Imagem.
- Clique em Fechar para sair da caixa de diálogo Propriedades.
A imagem alert.png está vinculada ao componente alert.
- Repita as etapas de 2 a 8 do componente waitScreen, adicione andglass.png como image2, e vincule-a ao componente.
Adicionando os comandos OK, Voltar e Sair nos componentes Caixa de texto e Tela de espera
- Escolha o comando OK na seção Comandos da Paleta. Arraste e solte-o em textBox.
- Escolha o comando Voltar na seção Comandos da Paleta. Arraste e solte-o em list.
- Escolha o comando Sair na seção Comandos da Paleta. Arraste e solte-o em list.
Criando o fluxo do aplicativo
Agora você está pronto para criar o fluxo do aplicativo.
- Na visualização Fluxo, clique no texto Iniciado no dispositivo móvel e arraste-o para o componente textBox.
- Da mesma forma, conecte os componentes como mostrado no gráfico seguinte.
Tela do Designer de fluxo conectada da seguinte forma: dispositivo móvel ao textBox1 ao waitScreen1 ao list ao MobileDevice. 
Criando uma tarefa em segundo plano para a Tela de espera
- Na visualização Fluxo, clique com o botão direito do mouse no componente waitScreen e escolha Propriedades no menu pop-up.
- Na caixa de diálogo Propriedades, escolha <NewCancellableTask> no menu suspenso Tarefa e clique em Fechar.
simpleCancellableTask é agora uma tarefa em segundo plano do componente waitScreen.
- Clique no botão Código-fonte na parte superior Visual Mobile Designer para passar para o código-fonte do aplicativo.
- Adicione um método da tarefa em segundo plano ao colar o seguinte código no código-fonte
MyWaitScreenMIDlet após public void destroyapp(boolean unconditional) { }:
private void getServerInfo() throws IOException {
String url = textBox.getString();
list.deleteAll();
/**
* Open an HttpConnection
*/
HttpConnection hc = (HttpConnection) Connector.open(url);
/**
* Gets a header field key and header field by index and
* insert it into list.
*/
list.setTitle(hc.getURL());
for (int i=0;hc.getHeaderFieldKey(i)!=null; i++){
list.insert(i,hc.getHeaderFieldKey(i)+" :"+hc.getHeaderField(i),null);
}
/**
* Closing time ...
*/
hc.close();
}
- Clique com o botão direito do mouse no código-fonte e escolha Corrigir importações no menu pop-up (como alternativa, pressione Ctrl+Shift+I).
- Localize a string public class MyWaitScreenMidlet extends MIDlet implements CommandListener { (linha 18) e insira final de modo que fique:
public final class MyWaitScreenMidlet extends MIDlet implements CommandListener {
- Localize o método public MyWaitScreenMidlet() no código-fonte (linha 38) e insira o código a seguir depois de public MyWaitScreenMidlet() {:
List list1 = getList();
- Clique em Tela para passar para a visualização Tela e selecione SimpleCancellableTask.
- Na janela Propriedades, clique no botão de reticências (
) na propriedade Código executável.
- Clique em Ir para o código na caixa de diálogo Código executável.
- Localize o método getSimpleCancellableTask() no código-fonte (linha 328) e insira o código a seguir depois de public void execute() throws Exception {, onde se lê // write task-execution user code here (escrever aqui o código do usuário para execução de tarefa):
getServerInfo();
Executando o projeto
Pressione F6 para executar o projeto principal.
Como alternativa, você pode selecionar Executar > Executar projeto principal.
início
Javadoc para os componentes Tela de espera e Tarefa cancelável simples
O NetBeans IDE oferece Javadocs da API para os componentes WaitScreen e SimpleCancellableTask, bem como para outros componentes que podem ser usados no VMD. Para ler os Javadocs dos componentes WaitScreen e SimpleCancellableTask, complete a etapas abaixo:
- Coloque o cursor no componente WaitScreen ou SimpleCancellableTask e pressione Ctrl-Shift-Barra de espaço (ou escolha Código-fonte > Mostrar documentação).
O Javadoc para este elemento é exibido em uma janela suspensa.
- Clique em Mostrar documentação no ícone do navegador da Web externo (
) na janela pop-up para visualizar informações detalhadas sobre o componente WaitScreen ou SimpleCancellableTask no seu navegador.
início
Veja também
início