Componentes de Interface Gráfica Básicos

Page 1

Capítulo 4: Componentes de UI Básicos A construção de interfaces talvez seja uma das maiores contribuições que a BlackBerry API forneceu a Java ME. Os grandes problemas que tíanhamos em relação a isso foram minimizados drasticamente (Veja o quadro abaixo para saber mais sobre UI e Java ME). A construção de interfaces gráficas em Java ME tem três caminhos: o uso de componentes gráficos prontos, a construção de telas personalizadas com diretivas gráficas e, por fim, o uso de algum framework que personaliza alguns componentes padrões da MIDP. O uso de componentes prontos, inseridos dentro do pacote javax.microedition.lcdui tornam o processo de desenvolvimento mais rápido, porém, não é possível adicionar cores, mudar fontes ou estilo de linhas dos componentes, eles são fechados. O uso de diretivas gráficas torna o processo de codificação mais penoso, porém, o resultado gráfico, na maioria das vezes, será superior aos componentes, isso porque, o usuário pode fazer a combinação de diretivas que quiser, criando os mais variados tipos de interfaces. Além disso, existem frameworks que podem ser entendidos como componentes mais amigáveis, com opções de configuração de comportamento gráfico

A BlackBerry API nos fornece diversos componentes de interfaces gráfica, prontos para uso, porém, ao contrário dos componentes Java ME. que não permitiam customização e sua visualização era sempre um mistério para o desenvolvedore, a APi da RIM permite mudança de diversos parâmetros, além de permitir que as classes sejam extendidas. Neste capítulo veremos primeiramente alguns destes componentes, em seguida, como tratar da interação dos mesmos com o usuário, posteriormente, como customizá-los, ou, criar seus próprios componentes e, por fim, os gerenciadores de layout. Em relação a interfaces gráficas, o programador não tem escolha, ou ele usa o Java ME ou a BlackBerry API, não existe uma maneira de fazer uma junção entre as duas.


Componentes Os componentes que serão vistos aqui estão todos no pacote net.rim.device.api.component. Para nossos exemplos vamos dar continuidade ao projeto que criamos no capítulo anterior. Reveja a Listagem 1 para dar uma refrescada na memória. LabelField Este componente nada mais é que um campo de texto. Ele já foi utilizado, podendo ser visualizado na Figura 17. Ele foi configurado como o texto que servirá como título da tela. Porém, podemos utilizar este componente como item normalmente. A classe tem cinco versões de construtores. Utilizamos uma que aceita uma String e constantes (long) que definirão seu layout. As outras opções são: • LabelField(); • LabelField(Objext texto); • LabelField(ResourceBundleFamily rb, int key); • LabelField(Object texto, int offset, int tamanho, long estilo); A biblioteca da API permite a utilização de várias constantes que alteram radicalmente a visualização do componente. Utilizamos duas em especial: • LabelField.ELLIPSIS: se o texto for maior que a largura da tela, subtitui a parte que sobra por três pontos. • LabelField.USE_ALL_WIDTH: utilizará a largura total do display. Vamos adicionar as linhas de código abaixo no construtor da classe: LabelField item = new LabelField("LabelField como Item dentro da tela, olha o que acontece se o texto for muito extenso;", LabelField.ELLIPSIS | LabelField.USE_ALL_WIDTH); add(item);

Com isso pretendemos mostrar duas coisas. Primeira, o LabelField pode muito bem ser usado como um componente de UI e, segundo, o comportamento do ELLIPSIS. Depois de executar o aplicativo novamente veremos o seguinte (Figura 18):


Figura 18: LabelField em execução.

Consulte a documentação da classe aqui: http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/ui/ component/LabelField.html. ButtonField O componente ButtonField é totalmente auto explicativo. Vamo adicionar mais algumas linhas de código abaixo dos LabelField´s. Veja a listagem abaixo: ButtonField btnLimpar = new ButtonField("Limpar"); ButtonField btnEnviar = new ButtonField("Enviar", ButtonField.FIELD_HCENTER | ButtonField.ELLIPSIS); add(btnLimpar); add(btnEnviar);


A classe ButtonField apresenta quatro versões de construtor. Podemos passar somente o texto do botão como parâmetro (btnLimpar) ou o texto mais um conjunto de constantes que moldarão o estilo do componente (btnEnviar). As outras duas opções são: • ButtonField(); • ButtonField(String rótulo, long estilo). No nosso exemplo, passamos duas constantes long na inicialização do último botão. O FIELD_HCENTER faz com que o mesmo seja alinhado no centro da tela, horizontalmente. E o segundo já vimos anteriormente. É importante ressaltar que o estilo do componente, quando estamos tratando de alinhamento, pode apresentar comportamento controverso em conjunto com gerenciadores de layout. Execute novamente a aplicação e veja o resultado (Conforme Figura 19).

Figura 19: ButtonField em execução.


Saiba mais sobre a classe e veja todos os métodos aqui: http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/ui/ component/ButtonField.html. BitmapField A classe BitmapField representa um componente de interface que permite a inserção de imagens na tela. Para evitar uma confusão visual, comente os códigos que inserimos anteriormente, com os outros componentes vistos até aqui. Depois disso, insira as linhas abaixo no construtor da classe: Bitmap myBitmap = Bitmap.getPredefinedBitmap(Bitmap.HOURGLASS); BitmapField bit1 = new BitmapField(myBitmap, BitmapField.FIELD_HCENTER); BitmapField bit2 = new BitmapField(Bitmap.getBitmapResource("a.jpg")); add(bit1); add(bit2);

Construimos dois objetos BitmapField, na linha 2 e 3, respectivamente. Utilizamos duas versões do construtor, a terceira não recebe nenhum parâmetro. Perceba que na linha 2 passamos por parâmetro uma instância de Bitmap, criado na primeira linha. Utilizamos o método getPredefinedBitmap, passando por parâmetro uma das constantes da classe Bitmap. Esse método recuperará uma das imagens utilizadas pelo próprio sistema operacional. Ainda na linha 2, também passamos no mesmo construtor um long para mudar seu estilo, centralizando a imagem no centro da tela. Na terceira linha de código, utilizamos o construtor que recebe apenas uma instância de Bitmap. Diferentememte, estamos usando o método getBitmapResource(), passando por parâmetro o nome do recurso. Esse método faz com que o Bitmap seja construído de uma imagem que esteja no path de seu projeto. Para entender perfeitamente os conceitos vistos aqui, rode o projeto e dê uma olhada nas imagens (Figura 20).


Figura 20: BitmapField em execução.

Saiba mais sobre a classe e seus métodos aqui: http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/ui/ component/BitmapField.html. DateField Quer mostrar um campo de data na tela do usuário? Use o DateField. Veja o código abaixo e adicione o mesmo no construtor da sua classe: 1: DateField df1 = new DateField("Entrada: ", System.currentTimeMillis(), DateField.DATE_TIME|Field.READONLY); 2: DateField df2 = new DateField("Saída: ", System.currentTimeMillis(), DateField.DATE); 3: DateFormat dateFormat = new SimpleDateFormat("dd-MMM-yy");


4: DateField df3 = new DateField("Nascimento: ", System.currentTimeMillis(), dateFormat); 5: add(df1); 6: add(df2); 7: add(df3);

Aqui utilizamos três versões do construtor da classe. Na linha 1 passamos por parâmetros um rótulo para o componente, um valor long que configura a data e hora e, por fim, um valor long (ou um conjunto deles) para definir o estilo do DateFeld. Pontos relevantes aqui: • Para pegar a data e hora daquele exato instante podemos usar o método System.currentTimeMillis(); • O DateField contém algumas constantes, dentre elas o DATE_TIME para especificar que o componente mostrará a data e a hora. Depois vamos utilizar também o DATE, para informar a classe que vamos mostrar somente a data. • Por padrão, um campo DateField é sempre editável. Para mudar este comportamente podemos informar a constante Field.READONLY. Na linha 2 estamos criando um segundo componente, quase semelhante ao anterior, exceto pelo fato de não Ser somente leitura e também, por mostrar somente a data. Na linha 3 estamos criando uma instância de DateFormat. Isso foi feito para demonstrar como podemos especificar um layout de apresentação de data. No nosso caso estamos definindo o formato dd-mm-yy. Na linha 4 criamos a última instância de DateField, perceba que usamos outro construtor. Este, recebe três parâmetros: um rótulo, um long com a data e hora e, uma instância de DateFormat. Ainda deixamos de usar outros quatro construtores, são eles: • DateField(); • DateField(String rotulo, long data, DateFormat formato, long estilo); • DateField(String rotulo, long data, int estilo, DateFormat formato); • DateField(String rotulo, long data, long estilo, DateFormat formato);


Veja na Figura 21 como os componentes são apresentados na tela:

Figura 21: DateField em execução.

Perceba que os dois últimos componentes estão com a data diferente daquela que definimos no código, isso porque já alteramos seu valor manualmente. Também, veja na Figura 22, que até o foco do componente é diferente quando podemos editá-lo:

Figura 22: Foco em DateField editável.


Para saber mais sobre a classe DateFormart visite este link http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/i1 8n/DateFormat.html. Para saber mais sobre a DateField, por favor, visite este link http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/ui/ component/DateField.html. GaugeField O GaugeField representa a classe que permite inserir um campo indicar na sua interface gráfica. Veja a listagem de código abaixo e insira ela no seu construtor. Remova os componentes anteriores, para não poluir nossa interface e nossas cabeças: GaugeField g1 = new GaugeField("Limpo: ", 1, 100, 20, GaugeField.NO_TEXT); GaugeField g2 = new GaugeField("Percento: ", 1, 100, 29, GaugeField.PERCENT); GaugeField g3 = new GaugeField("Editável: ", 1, 100, 60, Field.FOCUSABLE | GaugeField.EDITABLE); add(g1); add(g2); add(g3);

A classe é muito simples, tem apenas dois construtores, um padrão, sem nenhum parâmetro e outro que estamos usando aqui. Neste, devemos passar cinco parâmetros: • Um rótulo; • Valor mínimo; • Valor máximo; • Valor inicial; • Um ou mais valores long para definir o estilo do componente. No g1 colocamos seu rótulo como limpo, porque definimos ele sem texto (NO_TEXT). O g2 mostrará o percentual de ocupação do indicador (PERCENT) e, por fim, o g3 receberá o foco do usuário e é editável. O GaugeField, por padrão, não é editável. Execute o projeto e veja como ficou (Figura 23):


Figura 23: GaugeField em execução.

Saiba mais sobre a classe GaugeField neste link: http://www.blackberry.com/developers/docs/4.1api/net/rim/device/api/ui/co mponent/GaugeField.html. Campos de Seleção Na API da BlackBerry temos algumas classes que permitem a criação de campos de seleção. Como seu objetivo é semelhante, resolvi tratar de ambas neste tópico. Antes de qualquer coisa, vamos dar uma olhada no código que iremos injetar no construtor da nossa classe. Novamente, limpe os componentes anteriores (última vez que pedirei isso). 1:add(new RichTextField("Marque as Preferências!"));


2:CheckboxField myCheckbox = new CheckboxField("Mobile", true); 3:CheckboxField myCheckbox2 = new CheckboxField("Web", false); 4:add(myCheckbox); 5:add(myCheckbox2); 6: 7:add(new SeparatorField()); 8:add(new RichTextField("Escolha um!")); 9:RadioButtonGroup rbGroup = new RadioButtonGroup(); 10:RadioButtonField rbField = new RadioButtonField("Grêmio"); 11:RadioButtonField rbField2 = new RadioButtonField("Inter", rbGroup, true); 12:rbGroup.add(rbField); 13:add(rbField); 14:add(rbField2);

Vamos mudar a ordem por um breve momento, antes de entendermos o código, rode a aplicação e veja seu resultado (Figura 24):

Figura 24: Componentes de seleção em ação.


Na linha 1 e 8 temos só os textos que ficam acima de cada conjunto de caixas de seleção. Ignore por um momento, veremos sobre este componente posteriormente. A linha 7 apresenta um componente, que de tão simples, não achei justo destacá-lo em um tópico: SeparatorField. Seu único objetivo é colocar um separador na tela, possui apenas dois construtores. Um que já utilizamos, sem nenhum parâmetro, ou, aquele que passamos valores long para definir seu estilo. Mas oque realmente nos interessa neste tópico são as caixas de seleção, então, vamos a elas. Nas linhas 2 e 3 temos a criação das instâncias de CheckboxField. Esta classe permite a criação de caixas de seleção com múltipla escolha. Por isso que no nosso exemplo fictício e sem valor de uso nenhum, criamos duas opções que podem ser combinadas. A classe possui três construtores. Utilizamos a opção que aceita dois parâmetros: um texto que servirá de rótulo e um valor booleano que indicará se o mesmo virá marcado por padrão (true para marcado e false para não marcado). Os outros construtores são: • CheckboxField(); • CheckboxField(String rótulo, boolean marcado, long estilo). Os outros itens que inserimos na tela são instâncias de RadioButtonField. Porém, os objetos desta classe devem estar associadas a um RadioButtonGroup, de forma obrigatório. Por esse motivo, criamos a instância de agrupamento na linha 9. Existe somente um construtor para esta classe. Nas linha 10 e 11 vamos criar as instâncias de RadioButtonField. Na linha 10 estamos usando a versão de construtor que recebe apenas o rótulo do componente. Na linha seguinte, utilizamos a versão do construtor que recebe três parâmetros: • String de rótulo; • Instância de RadioButtonGroup; • Booleano que indica se o mesmo virá marcado por padrão para o usuário, ou não. Os dois outros construtores que não foram usados aqui são: • RadioButtonField();


• RadioButtonField(String rotulo, RadioButtonGroup booleano selecionado, long estilo).

grupo,

Na linha 12 estamos adicionando uma instância do campo ao grupo de botões. Mas porque adicionamos somente um deles? Porque o outro já informou a qual grupo ele pertencia no próprio construtor da classe. Status e Dialog As dusa classes que dão nome a este tópico tem muito em comum, por isso estão agrupadas, ambas permitem que o usuário coloque avisos na tela do usuário. Como um Alert no Java ME por exemplo. Estes avisos não serão colocados na display stack. Outra coincidência das duas: ambas herdam de PopupScreen. Para testarmos as várias possibilidades dasduas classes, vamos fazer alterações no método onClose() da nossa classe. Primeiramente vamos trabalhar com Status. Altere o método onClose e adote o código mostrado na listagem abaixo. Nas próxims listagens, aleter somente a linha 1: public boolean onClose() { 1: Status.show("Tchau"); System.exit(0); return true; }

Ao sair do aplicativo veremos a seguinte mensagem (Figura 25). O aviso será removido o aplicativo fechado depois de um intervalo de tempo ou, quando o usuário clicar na barra de espaço, tecla de escape ou, trackwheel:

Figura 25: Status.


No método show da classe Status passamos somente uma String como parâmetros. Mas podemos utilizar outras versões do método: • show(String mensagem, int tempo): especifica mensagem, o tempo que ela deve ficar visível.

além

da

• show(String mensagem, Bitmap imagem, int tempo): especifica também a imagem que será mostrada, não a default, como aconteceu no nosso exemplo anterior. • show(String mensagem, Bitmap imagem, int tempo, long style, boolean allowDismiss (permiteRejeitar), boolean block, int prioridade): especifica vários parâmetros para uma mensagem customizada. Status possui somente o método show(). A classe Dialog nos permite uma diversidade maior. Ao todo são três opções. Os métodos alert e inform possuem a mesma assinatura: recebem apenas uma String como parâmetro, que será a mensagem exposta. E ambas tem o mesmo padrão visual. Altere a referida linha 1 anterior e coloque o seguinte código: Dialog.inform("Tchau");

O resultado é mostrado na Figura 26:

Figura 26: Dialog.inform().

O terceiro método da classe Dialog é ask(). Como o nome sugere, o programador consegue interagir com o usuário, podendo tratar a resposta da menira que lhe parecer adequada. Altere o método onClose para o código apresentdo abaixo:


public boolean onClose() { int response = Dialog.ask(Dialog.D_YES_NO, "Você realmente deseja sair?"); if (Dialog.YES == response) { System.exit(0); } else if (Dialog.NO == response){ //faz nada } return true; }

O método ask apresenta cinco versões, estamos usando a mais comum delas, que aceita uma constante da própria classe Dialog, que define o tipo da mensagem e, uma String que será o texto apresentado ao usuário. A resposta é salva na variável response. Para tratar o retorno de maneira adequada, também usamos as constantes da classe Dialog. Execute o projeto e veja como ficou (Figura 27):

Figura 26: Dialog.ask().

Escolhendo não o aplicativo não fecha, somente a caixa de diálogo desaparece. Escolhendo sim, a mensagem e a aplicação fecham normalmente. E se o programador quer uma versão em português do diálogo? Bem, nesse caso podemos utilizar o método ask que aceita três paraâmetros. Reescreva o método onClose: public boolean onClose() { int response = Dialog.ask("Você realmente deseja sair?", new String[]{"Sim", "Não", "Não sei", "Não entendi"}, 0);


if (0 == response) { System.exit(0); } else if (1 == response){ Dialog.alert("Tudo bem, depois eu fecharei."); } else if (2 == response){ Dialog.alert("Então se decide logo."); } else if (3 == response){ Dialog.alert("Quer que eu desenha, nossa."); } return true; }

Nesta versão bem humorada, passamos para o método quais são as opções que desejamos. Os parâmetros são: • String com mensagem exposta ao usuário; • Array de Object com as opções apresentadas ao usuário; • Índice da opção que virá selecionada por padrão Perceba que nossos testes id-else agora estão usando valores inteiros finais. Isso porque a sequência de índices trabalha exatamente como no array. Partindo do zero e indo até o número de elementos menos um. O método ask também permite que você indique com quais índices deseja trabalhar, veja: public boolean onClose() { int response = Dialog.ask("Você realmente deseja sair?", new String[]{"Sim", "Não", "Não sei", "Não entendi"}, new int[]{3, 4, 5, 6}, 5); if (3 == response) { System.exit(0); } else if (4 == response){ Dialog.alert("Tudo bem, depois eu fecharei."); } else if (5 == response){ Dialog.alert("Então se decide logo."); } else if (6 == response){ Dialog.alert("Quer que eu desenha, nossa."); } }

return true;

O resultado prático será exataente o mesmo.


Campos de Escolha Estes componentes podem muito bem ser confundidos com dropdown, eles podem apresentar um conjunto de opções com objetos inteiros ou texto. Adicione o seguinte código no seu construtor: 1: NumericChoiceField a = new NumericChoiceField("Selecione um número: ", 1, 20, 10); 2: add(a); 3: add(new SeparatorField()); 4: String choiceItems[] = {"Pera", "Uva", "Melancia"}; 5: add(new ObjectChoiceField("Select uma fruta:", choiceItems));

Para inserir uma escolhe com números, use a clase NumericChoiceField, utilizada na linha1. A classe apresenta três construtores. O utilizado no código recebe uma String que será o rótulo do componente, um valor inteiro inicial e outro valor final e, o quarto parâmetro é novamente um número inteiro que dita a taxa de incremento. Os outros dois construtores são: • ObjectChoiceField(); • ObjectChoiceField(String rotulo, int inicial, int final, int incremento, int indiceInicial): apenas adiciona um valor que será informado como padrão. Quando precisamos utilizar instância de Object, ou mais comum, textos, usaremos a classe ObjectChoiceField. Seu uso tamém é bem simples. Porém, a classe apresenta seis versões de construtor. Naquele utilizado em nosso exemplo, passamos uma String que servirá de rótulo e um array de Object que serão os itens a serem escolhidos. As outras versões de construtores são: • ObjectChoiceField(); • ObjectChoiceField(String rotulo, Object[] itens, indiceInicial): informa também o índice selecionado padrão.

int

• ObjectChoiceField(String rotulo, Object[] itens, Object objetoInicial): informa Object que será selecionado inicialmente.


• ObjectChoiceField(String rotulo, Object[] itens, int indiceInicial, long estilo): possibilidade de mudar o estilo do componente. • ObjectChoiceField(String rotulo, Object[] itens, Object objetoInicial, long estilo): possibilidade de mudar o estilo do componente. Execute este aplicativo e veja como ficou (Figura 27):

Figura 26: NumberChoiceField e ObjectChoiceField em ação.

Para saber mais sobre NumberChoiceField, visite este link: http://www.blackberry.com/developers/docs/3.6api/net/rim/device/api/ui/co mponent/NumericChoiceField.html. Para saber mais sobre a ObjectChoiceField, visite este link: http://www.blackberry.com/developers/docs/4.0.2api/net/rim/device/api/ui/ component/ObjectChoiceField.html.


EditField Um campo de edição permite que o usuário insira alguma informação nele. A BlackBerry API nos oferece cinco opções de classes que permitem campos de edição: AutoTextEditField, EditField e PasswordEditField, que estendem de BasicEditField e, RichTextField. Vamos trabalhar com todas elas. Veja a tabela abaixo com um resumo das característicasde uma dasclasses: Tabela 1: Classe

Descrição

RichTextField

Cria um campo de edição somente leitura. Pode ser formatado com diferentes fontes e estilos. Pode receber foco, mesmo não sendo editável.

BasicEditField

Classe base para EditField e PasswordEditField. Campo editável com formatação padrão, mas permite a utilização de filtros.

EditField

Permite que o usuário acesse caracteres especial. Por exemplo, mantendo a tecla Alt pressionando e rolando o trackwheel, o usuário

PasswordEditField

Mascara entrada de usuário com asteriscos (*). Formatações automáticas não são suportadas. Recortar ou copiar também não são suportados.

AutoTextEditField

Aplica formatações que são específicas da engine AutoText. Qualquer texto que for digitado neste campo é formatado de acordo com as especificações do banco de dados AutoText presente do aparelho. Filtros podem ser aplicativos neste componente mas não terão nenhuma efetividade.

A API também permite a inserção dos seguintes filtros: • DEFAULT_MAXCHARS; • FILTER_DEFAULT; • FILTER_EMAIL; • FILTER_HEXADECIMAL; • FILTER_INTEGER; • FILTER_LOWERCASE; • FILTER_NUMERIC;


• FILTER_PHONE; • FILTER_PIN_ADDRESS; • FILTER_UPPERCASE; • FILTER_URL; • JUMP_FOCUS_AT_END; • NO_NEWLINE. Adicione o seguinte código no seu construtor: add(new RichTextField("Exemplo de RichTextField: ")); add(new EditField("Exemplo de EditField: ", "", 20, EditField.FILTER_PIN_ADDRESS)); add(new PasswordEditField("Exemplo de PasswordEditField: ", "")); add(new AutoTextEditField("Exemplo de AutoTextEditField: ", ""));

Ao executarmos o código veremos os quatro campos. Brinque um pouco com eles ():

Figura 27: Campos de edição em ação.


Perceba a máscara que foi adicionada no segundo campo, ele aceitará somente números e, mesmo que informamos “20” como quantidade máxima de caracteres, ao digitarmos o nono dígito ele nos traz uma informação dizendo que o campo está cheio. TreeField Esta classe permite a inserção de um componente que simula uma hierarquia de árvores, semelhantes as pastas no sistema operacional Windows, por exemplo. Para exemplificar o item, vamos criar um campo na nossa interface de usuário que hierarquiza alguns esportes. A classe TreeField possui apenas um construtor, veja na linha de código abaixo: TreeField myTree = new TreeField(myCallback, Field.FOCUSABLE);

Device ao padrão de código dos componentes, um TreeField necessita de um TreeFieldCallback para controlar o desenho dos seus itens. Portanto, o primeiro parâmetro é uma instância da classe de callback. Por fim, passamos um ou mais variáveis long como segundo parâmetro. Veja a listagem de código abaixo para conhecer a instância de TreeFieldCallback, chamada myCallback: 1: TreeFieldCallback myCallback = new TreeFieldCallback(){ 2: 3: public void drawTreeItem(TreeField treeField, Graphics graphics, 4: int node, int y, int width, int indent) { 5: graphics.setColor(Color.BLACK); 6: Object obj = treeField.getCookie(node); 7: 8: if (obj instanceof String) { 9: String text = (String)obj; 10: graphics.drawText(text, indent + 5, y); 11: } 12: } 13: };

Sempre que extendemos de TreeFieldCallback, devemos obrigatoriamente implementar o método drawTreeItem. Se deixarmos este método em branco nosso componente não vai nos apresentar nada. Porque


é neste método que definimos o comportamento de cada item. No nosos código estamos apenas mostrando o texto em fonte preta, normal. Veja como o nosso componente fica na Figura 28:

Figura 27: Componente TreeField em ação.

Porém, poderíamos desenhar uma imagem, um círculo, usar cores bem estravagantes, o limite é nossa imaginação. Por exemplo, poderíamos mudar a primeira linha do método drawTreeItem para configurar a cor verde: graphics.setColor(Color.GREEN);

Os parâmetros do drawTreeItem são: • Instância de TreeField;


• Instância de Graphics, que será utilizada para desenhar item. Utilizando a idéia de Canvas, presente em muitas plataformas de desenvolvimento. • Índice da linha da árvore que está sendo desenhada; • Inteiro que define a distância deste item em particular em relação ao topo da árvore. Utilizamos este parâmetro na linha 10, para saber onde desenhar o texto. • Inteiro que define a largura da área restante, ou seja, a largura total do display menos o ícone de menos ou mais. • Inteiro que define o número de pixeis que devem ser reservados para o ícone da árvore. Também utilizamos este parâmetro na linha 10 para não escrever sobre a imagem de menos ou mais. Mas ainda não vimos o código onde inserimos todos estes textos no TreeField. Portanto, veja a listagem abaixo: TreeField int node1 int node2 int node3 int node4 int node5

myTree = new TreeField(myCallback, Field.FOCUSABLE); = myTree.addChildNode(0, field1); = myTree.addChildNode(node1, field2); = myTree.addChildNode(node1, field3); = myTree.addChildNode(node3, field4); = myTree.addChildNode(node3, field5);

add(myTree);

A classe TreeField tem um método addChildNode, que aceita dois ou três parâmetros. No exemplo usamos a primeira opção, passando o índice do nodo e o Field propriamente dito, que é apenas uma instância de String. Poderíamos ter passado um terceiro parâmetro booleano, que indica se após a inserção o componente deve ter seu layout atualizado ou não. Para saber mais sobre a classe TreeFieldCallback, visite a página http://www.blackberry.com/developers/docs/3.6api/net/rim/device/api/ui/co mponent/TreeFieldCallback.html. Para saber mais sobre a classe TreeField, visite a classe http://www.blackberry.com/developers/docs/3.6api/net/rim/device/api/ui/co mponent/TreeField.html.


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.