20 05 2008

Como criar um teclado numérico usando java Applet

Pergunta do aluno: Como criar um teclado numérico para ser usado numa página web?

Resposta: Você pode usar o java e criar um applet para isso.

appletnoie6.JPG
Applet executando no Internet Explorer 6

Applet é um aplicativo, escrito em java, que estende java.applet.Applet e que não é executado diretamente. Ele deve ser inserido dentro de outra estrutura, como uma página HTML, por exemplo.

A classe Applet tem os seguintes membros (principais):

  • init - contém o código que é executado quando o aplicativo é carregado na página;
  • getAppletInfo - retorna uma String com informações sobre o Applet;
  • getCodeBase - retorna uma java.net.URL com o endereço da pasta onde o aplicativo reside;
  • getDocumentBase - retorna uma java.net.URL com o endereço da página onde o aplicativo está inserido;
  • getParameter - retorna o conteúdo de um parâmetro passado do HTML, usando a tag <param>;
  • start - executado pelo navegador ou por um visualizador de applet, para iniciar a execução ao aplicativo;
  • stop - executado pelo navegador ou por um visualizador de applet, para interromper a execução.

Para passar um valor do applet para o HTML, precisei criar um objeto da classe netscape.javascript.JSObject.

O código do applet Teclado é:

import java.applet.Applet;
import java.awt.event.ActionListener;
import java.awt.event.ActionEvent;
import java.awt.Button;
import java.awt.Graphics;
import netscape.javascript.JSObject;        

public class Teclado extends Applet{
   public String conteudo = "";
   public String formulario;
   public String campo;
    public JSObject campoDoFormularioHTML;        

   public void init(){
      formulario = getParameter("formulario");
      campo = getParameter("campo");        

      ActionListener trataEventos = new ActionListener(){
         public void actionPerformed(java.awt.event.ActionEvent e){
            conteudo += e.getActionCommand();
            campoDoFormularioHTML.setMember("value", "" + conteudo);
         }
      };        

      Button b7 = new Button("7");
      add(b7);
      b7.addActionListener(trataEventos);        

      Button b8 = new Button("8");
      add(b8);
      b8.addActionListener(trataEventos);        

      Button b9 = new Button("9");
      add(b9);
      b9.addActionListener(trataEventos);        

      Button b4 = new Button("4");
      add(b4);
      b4.addActionListener(trataEventos);        

      Button b5 = new Button("5");
      add(b5);
      b5.addActionListener(trataEventos);        

      Button b6 = new Button("6");
      add(b6);
      b6.addActionListener(trataEventos);        

      Button b1 = new Button("1");
      add(b1);
      b1.addActionListener(trataEventos);        

      Button b2 = new Button("2");
      add(b2);
      b2.addActionListener(trataEventos);        

      Button b3 = new Button("3");
      add(b3);
      b3.addActionListener(trataEventos);        

      Button b0 = new Button("0");
      add(b0);
      b0.addActionListener(trataEventos);        

      Button bl = new Button("Limpa");
      add(bl);
      bl.addActionListener(new ActionListener(){
         public void actionPerformed(java.awt.event.ActionEvent e){
            conteudo = "";
            campoDoFormularioHTML.setMember("value", "" + conteudo);
         }
      });        

      JSObject objWin = JSObject.getWindow(this);
      JSObject objDoc = (JSObject)objWin.getMember("document");
      JSObject objForms = (JSObject)objDoc.getMember("forms");
      JSObject objForm = (JSObject)objForms.getMember(formulario);
      JSObject objElements = (JSObject)objForm.getMember("elements");
      campoDoFormularioHTML = (JSObject)objElements.getMember(campo);
      campoDoFormularioHTML.setMember("value", "");
   }
}

O código HTML necessário para executar o applet Teclado é:

<table border="1" cellpadding="15" cellspacing="0" align="center">
   <tr>
      <td>
         <form name="formulario">
            Digite sua senha: <input type="password" name="senha"
               onfocus="javascript:alert('use o SOMENTE teclado virtual')">
            <br/>
            <input type="button" value="clique aqui"
               onclick="javascript:alert(this.form.senha.value);" >
         </form>
      </td>
      <td>
         <applet code="Teclado.class" width=80 height=110>
            <param name="campo" value="senha">
            <param name="formulario" value="formulario">
         </applet>
      </td>
   </tr>
</table>

Existem tags HTML próprias para isso:

  • <applet>…</applet> - depreciada (definida como ultrapassada e substituída pela <object>;
  • <object>…</object> - modo atual de se inserir elementos em uma página.

Quem define a sintaxe para essas tags é o W3C (World Wide Web Consortium).

Os principais atributos da tag <applet> (que foi a usada por mim neste exemplo) são:

  • code - nome da classe que será carregada (obrigatório);
  • width - largura da área onde será “desenhado” o corpo do applet (obrigatório);
  • height - altura da área onde será “desenhado” o corpo do applet (obrigatório);
  • alt - texto que será apresentado no navegador se este aceita a tag <applet> mas não pode executar;
  • name - nome do applet que está sendo executado (nome da instância) que permite a comunicação entre applets ou entre o applet e o formulário.

A tag <applet> pode conter tags <param/>, que definem os parâmetros passados do HTML para o aplicativo.

Os atributos da tag <param> são:

  • name - o nome do parâmetro;
  • value - o conteúdo do parâmetro.

Esse applet executou sem problemas em máquinas com IE6, quando compilado com:

javac Teclado.java

Porém tive problemas com o IE7 (tem a ver com a MS JVM). Para resolver, compilei o applet de uma forma especial (para que o aplicativo fosse compatível com uma versão mais antiga de JVM), usando o comando:

javac -source 1.3 -target 1.1 Teclado.java

appletnoie7.jpg
Applet executando no Internet Explorer 7 (Windows XP)

Para que o aplicativo seja executado, inclua a propriedade mayscript na tag <applet>.

6 Respostas para “Como criar um teclado numérico usando java Applet”

  • 1
    Bruno Rafael Escreveu:

    parabéns professor pela iniciativa de criar um site com dicas. muito legal.

    eu não consegui compilar o arquivo no NetBeans. ele fala que o pacote não existe.
    da erro na linha:
    import netscape.javascript.JSObject;

    como resolvo. falow t+

  •  

    [...] Nesse post mostrei a criação de um applet capaz de alterar valores de um campo de formulário HTML mas não entrei em detalhes como consegui acessar a estrutura da página onde o applet estava inserido. [...]

  • 3
    Paraiso Escreveu:

    Realmente, essa solução está completamente dependente do pacote netscape.javascrip.JSObject, é através dele que se faz o acesso ao código fonte do html, introduzindo os valores premidos, mas esse pacote, não é originario de, por exemplo, o NetBeans, o que significa que se torna um bocado incompatível com a programação de quem usa o netBeans.
    Mesmo assim se realmente funciona é um bom exemplo. Pena mesmo não se poder reproduzir por falta do netscape.javascrip.JSObject.

  • Interessante comentário… mas está incorreto…

    pode ser reproduzido, sim. E pode ser feito no NetBeans.

    veja como se adiciona uma referência a bibliotecas no NetBeans no meu post:

    http://www.50minutos.com.br/?p=332 (Passando valores para o HTML com JSObject)

  • Gostaria de saber como adicionar um actionListener numa classe kualker…Fiz uma classe para gestao de alunos de uma instituicao, a minha dificuldade esta nesse ponto, simplestente para concluir a capa da meu projecto. Paz

  • objetoDaClasse.addActionListener(new ActionListener(){
    //código do método actionPerformed
    });

    não esquecer dos imports:
    import java.awt.*;
    import java.awt.event.*;

Comente