[CONCLUIDO] Como fazer um Browser em J2me?

Caro amigo, fiz algo semelhante no último projeto na empresa onde trabalho.

Na verdade não era bem um “browser”. Se trata de uma aplicação que “montava” as telas de cadastro, os campos, os dados, tudo ddinamicamente, usando um XML que vinha do servidor.

A aplicação analisava o XML, e ia montando a tela, de acordo com os campos e os dados informados no XML.

Acontece que eu sempre uso Canvas puro, e desenho em canvas todos os controles, entrada de texto, listas, grids, tabelas, combobox, checklistbox, e tudo o mais que uma aplicação precise.

Quanto ao seu browser, logicamente você deverá usar Canvas, e logicamente deverá criar na mão classes que representarão os controles de form.

Quanto so desenho em tela, você analisará cada TAG do HTML e pintará a aplicação de acordo.

Aconselho primeiro fazer um navegador que ignore todas as TAGs, e mostre apenas o texto do body sem qualquer formatação. Numa segunda fazer você faria a implementação da interpretação dos links. Numa terceira fazer você faria a formatação do texto usando as próprias tags HTML, como font, color, etc. Depois faria a interpretação do CSS. Depois forms e controles, depois javascript. E assim iria melhorando seu navegador.

Espero ter ajudado com alguma idéia.

Abraço.

Só como adendo uma das grandes vantagens do Opera Mini é o pré-processamnto Server-Side ou seja que pega o HTML de uma página não é o Opera Mini em si mas sim uma aplicação Server que pré-processa esses dados e envia de uma forma otimizada para o Client, isto é mais necessário quando o aplicativo for ser instalado em celulares convencionais, mas se vc for fazer para um SmartPhone esse pré-processamento não seria tão necessário.

Bom Senhores, Primeiro agradeço aos 2 terem respondido minha questão com certeza ambas foram de grande utilidade. Não sabia sobre isso do OperaMini mas vai ser necessário então…

Sobre ter que desenhar e tratar tudo em canvas eu já imaginava, mas vai dar um trabalho do caralho… Npereirajr, Tem como me mandar ou sei lá algo sobre esse projeto que fez por favor?

Agradeço.
Eduardo Ricoldi.

ricoldi:

Bom Senhores, Primeiro agradeço aos 2 terem respondido minha questão com certeza ambas foram de grande utilidade. Não sabia sobre isso do OperaMini mas vai ser necessário então…

Sobre ter que desenhar e tratar tudo em canvas eu já imaginava, mas vai dar um trabalho do caralho… Npereirajr, Tem como me mandar ou sei lá algo sobre esse projeto que fez por favor?

Agradeço.
Eduardo Ricoldi.

Quem disse que você está limitado ao Canvas ?

Você pode renderizar a página fazendo uma tradução dos elementos HTML para os respectivos componentes do MIDP.

O Elemento IMG do HTML vira o Image ou ImageItem do MIDP, a página é um elemento FORM do MIDP,etc…

Alguns browsers somente texto (Linux) fazem isto…

Fala Grande boone,

Eu até tinha pensado nisso tambem… estou analisando as possibilidades do que fazer pois creio que seja um projeto demorado não é? a ideia de ter um servidor que trata a pagina que vai pro celular tambem é bem interessante.

de momento eu Agradeço!

Nossas aplicações, na Abacomm, são todas em Canvas.

Dá trabalho sim, mas a aplicação fica muito melhor.

Na verdade, hoje, após ter todo um framework pronto, faço uma aplicação em Canvas mais rápido do que se fosse fazer em API gráfica de ato nível.

Resultado: a aplicação fica linda! Fica com a mesma cara em qualquer celular. Ocupa bem menos memória do que os custosos controles de alto nível, isso usando e abusando das imagens. Em Canvas faço efeitos personalizados de transição de telas e entrada de controles, assim como tem no OperaMini.

Amigo, vai por mim, se quer fazer algo bem feito, pensando no futuro, faça em Canvas. Não tenha medo.

Se você tem disponibilidade de um servidor bom para servir sua aplicação, será ótimo, pois você pode mandar apenas o necessário ao celular, e quando precisar fazer manutenção, não precisará atualizar as aplicações nos devices.

Abraço,

É meu caro npereirajr,
na questão da personalização com certeza canvas é bem mais negocio.

Estou estudando a ideia de criar um framework para canvas.

Concordo que o resultado final é muito mais bonito e enche bem os olhos de quem ve.

Mas não tenho ideia de como que se desenha esses tipo de objeto em canvas… por exemplo um TextField para os inputs, como que se desenha e dá aqueles efeitos nele?

Agradeço,
Eduardo Ricoldi.

Eduardo,

Em Canvas, como já deve saber, você deve desenhar e pintar tudo. É essencial que você saiba bem de design, ou tenha um profissional que lhe ajude a criar as imagens. Lembre-se: as imagenss é que farão a diferença.

Para fazer um InputTextField, você cria 1 imagem no Corel, ou Photoshop, com o textfield vazio, com os efeitos que desejar. Então você divide essa imagem em 3 partes pequenas: o início do campo, uma pequena parte do meio do campo, e a parte do final do campo, e colocar na sua aplicação em formato PNG.

Depois, seguindo agora da forma mais simples, você cria uma classe que representará seu TextField.

Cria uma propriedade chamada String text;

Cria uma propriedade chamada int width;

Cria um método chamado paint(Graphics g). Nesse método você faz o trabalho de pintura do TextField, montando as 3 partes da imagem, sendo que a imagem do meio deve ser repetida até completar a largura do TextField.

Depois você pinta o text, usando g.drawString(text…)

Na sua tela Canvas, no construtor você instancia um objeto TextField. E no Paint você dá um objetoTextField.paint(g); fazendo com que o próprio TextField se pinte do Graphics do Canvas.

No método keyPressed(int key) você insere cada caracter pressionado no text do TextField, e manda dar um repaint().

A grosso modo é assim. Claro que você pode implementar mais tarde todo um controle de foco, um gerenciador de controles de telas, etc, etc, etc.

Espero ter dado uma luz…

Vlw npereirajr,

Pessoal o lance do Navegador já era, rs…

Mas agradeço atenção de todos…

Vou fechar o topico.

npereirajr:

Eduardo,

Em Canvas, como já deve saber, você deve desenhar e pintar tudo. É essencial que você saiba bem de design, ou tenha um profissional que lhe ajude a criar as imagens. Lembre-se: as imagenss é que farão a diferença.

Para fazer um InputTextField, você cria 1 imagem no Corel, ou Photoshop, com o textfield vazio, com os efeitos que desejar. Então você divide essa imagem em 3 partes pequenas: o início do campo, uma pequena parte do meio do campo, e a parte do final do campo, e colocar na sua aplicação em formato PNG.

Depois, seguindo agora da forma mais simples, você cria uma classe que representará seu TextField.

Cria uma propriedade chamada String text;

Cria uma propriedade chamada int width;

Cria um método chamado paint(Graphics g). Nesse método você faz o trabalho de pintura do TextField, montando as 3 partes da imagem, sendo que a imagem do meio deve ser repetida até completar a largura do TextField.

Depois você pinta o text, usando g.drawString(text…)

Na sua tela Canvas, no construtor você instancia um objeto TextField. E no Paint você dá um objetoTextField.paint(g); fazendo com que o próprio TextField se pinte do Graphics do Canvas.

No método keyPressed(int key) você insere cada caracter pressionado no text do TextField, e manda dar um repaint().

A grosso modo é assim. Claro que você pode implementar mais tarde todo um controle de foco, um gerenciador de controles de telas, etc, etc, etc.

Espero ter dado uma luz…

Eduardo, segui sua dica, fiz varios textfield em canvas e inseri num canvas principal, mas como pego o foco?? pois sempre que digito algo ele insere no último textfield.
Gostaria que me ajudasse nessa duvida.
Agradeço a atenção dispensada,

FabioLira, Bom dia.

Então cara, sem ver o código fica dificil de entender o que esta acontecendo, mas o que da para adiantar é que para controlar onde vai ocorrer a entrada de dados você tem que fazer um indice dentro da sua classe da tela. Esse indice vai indicar onde esta o foco e deve ser alterado quando você pressionar as teclas de navegação.

Abraços,
Ricoldi.

ricoldi:

FabioLira, Bom dia.

Então cara, sem ver o código fica dificil de entender o que esta acontecendo, mas o que da para adiantar é que para controlar onde vai ocorrer a entrada de dados você tem que fazer um indice dentro da sua classe da tela. Esse indice vai indicar onde esta o foco e deve ser alterado quando você pressionar as teclas de navegação.

Abraços,
Ricoldi.

Ricoldi,

valeu pela dica, já fiz e fiz dessa mesma forma, criei um indice e um vetor com os campos.

Obrigado a todos.