Ir para conteúdo



Foto

Lição 7: menus e estilos


  • Este tópico está fechado Este tópico está fechado
Não há respostas para este tópico

#1

seiken

    Membro Platinum PluS

  • Membro Prime
  • PipPipPipPipPipPipPip
  • 24.925 posts

Postado 01 Jun 2013 - 11:25

Autor: TheCodeBakers
Licença de uso do Curso: GPL Free Documentation
Publicado no site http://www.thecodebakers.org
Também comentem sobre curso lá .


Menu de opções

Toda activity pode ter menus:
  • Menu de opções (options menu) – acionado pela tecla "menu" do dispositivo;
  • Menu de contexto (context menu) – acionado pelo "touch and hold";

Recupere o projeto "BioMago", que utilizamos nas lições anteriores (http://code.google.com/p/biomago/).



O menu de opções é utilizado para opções gerais, que se aplicam à Activity como um todo. Ele é acionado quando o usuário aciona a tecla "menu" do dispositivo.

O menu de contexto é utilizado em listas (veremos mais adiante), quando vários itens são exibidos simultaneamente. Ele se aplica a um só item.

Devemos evitar colocar opções de item dentro do menu de opções e opções gerais dentro do menu de contexto.

O Menu de Opções deve conter TODOS os comandos da Activity, independentemente se há botões para eles na tela. Ele é a opção preferencial de comandos do usuário. Entre colocar um botão na tela e colocar um comando no menu, prefira sempre a segunda opção.

Para criar um menu de opções, devemos criar um menu resource, que é um arquivo Android XML, dentro da pasta: "res/menu". Apesar de ser possível, não localizamos o menu em si, mas os Strings que ele exibe. Eis um arquivo de menu:
<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android"> 
 
<item android:id="@+id/mnuIncluirRegistro" 
android:title="@string/mnu_novo_registro" /> 
 
<item android:id="@+id/mnuAjuda" 
android:title="@string/mnu_ajuda" /> 
 
 
</menu> 


Cada elemento "item" é uma entrada de menu, cujo rótulo está na propriedade: "android: title". Note também que foram atribuídos "ids" a cada elemento, de modo que possam ser referenciados no código-fonte.

Podemos ter ícones no meu, mas teremos que fornecer as imagens, ou utilizar as que estão no Android. Por exemplo:


<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android"> 
 
<item android:id="@+id/mnuIncluirRegistro" 
android:icon="@android:drawable/ic_menu_add"     
android:title="@string/mnu_novo_registro" /> 
 
<item android:id="@+id/mnuAjuda" 
android:icon="@android:drawable/ic_menu_help" 
android:title="@string/mnu_ajuda" /> 
 
 
</menu> 


Só devemos ficar atentos porque os ícones do Android podem variar, quando mudamos a plataforma ou a versão.

Uma vez que criamos nosso menu resource, precisamos "inflá-lo" dentro da Activity. E isto é feito no "callback" "onCreateOptionsMenu()". Este "callback" é invocado apenas uma única vez, quando o menu precisa ser criado. Se você quiser alterar o menu antes de exibi-lo, use o "callback": "opPrepareOptionsMenu()".
@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
MenuInflater inflater = getMenuInflater(); 
inflater.inflate(R.menu.menu_lista, menu); 
return true; 
} 


Usamos a classe "android.view.MenuInflater" para transformar nosso XML de menu em uma estrutura de objetos de menu. É claro que o identificador do nosso menu foi criado dentro da classe "R.java", bastando passá-lo no método "inflate", juntamente com o menu recebido.

Ao invés de fazer isto, poderíamos criar o menu "na mão", preenchendo os itens necessários dentro do "callback". Isto está fora do escopo deste curso e não recomendamos que seja feito.

Agora só falta uma coisa: interceptar quando o usuário clicar em um item do menu! Como você deve ter advinhado, há um "callback" para quando um item do menu de opções é clicado: "onOptionsItemSelected() ". Eis o código usado no projeto "BioMago:
@Override 
public boolean onOptionsItemSelected(MenuItem item) { 
switch (item.getItemId()) { 
case R.id.mnuIncluirRegistro: 
this.incluirRegistro(null); 
return true; 
case R.id.mnuAjuda: 
Intent i = new Intent (this.getApplicationContext(), 
Ajuda.class); 
this.startActivity(i); 
return true; 
default: return super.onOptionsItemSelected(item); 
} 
} 


Este "callback" recebe uma instância de "android.view.MenuItem", classe que representa um item de menu. Se analisarmos a propriedade "id", através do seu "getter" ("item.getItemId()"), podemos comparar com os "ids" criados em nossa classe "R.java" (lembre-se: todo "id" é criado também dentro da classe "R.java", e você criou "ids" para os itens de menu dentro do XML!).

A parte sobre menu de contexto veremos mais adiante. Agora é hora de mais exercícios!

Laboratório 4 - Menu de opções

Vamos criar uma nova Activity para a Ajuda:
  • Crie um novo arquivo de layout chamado: "ajuda.xml", dentro de "res/layout" (new / Android XML file – layout);
  • Crie um bonito layout, com um texto explicativo sobre sua aplicação. Veja como fizemos no projeto BioMago;
  • Crie uma classe que estenda "android.app.Activity" e escreva seu "callback" "onCreate()", inicializando o seu layout. Veja o "callback" da activity principal;
  • Altere o arquivo "AndroidManifest.xml" para acrescentar a sua activity. Veja como o do BioMago foi feito;

Agora, vamos criar um menu resource:
  • Crie um string resource: "ajuda", com os textos apropriados em Português e Inglês!
  • Crie uma pasta "menu", dentro da pasta "res";
  • Selecione a pasta "menu" e crie um novo Android XML File, do tipo "menu";
  • Coloque os itens: "novoRegistro" e "ajuda". Tenha cuidado com os "ids" e com os "titles". Use os strings que já existem;

Finalmente, vamos inflar o menu dentro do nosso código-fonte:
  • No código da Activity principal (Principal.java), adicione o "callback": "onCreateOptionsMenu()", conforme fizemos na apostila e no BioMago;
  • No mesmo código, acrescente o "callback": "onOptionsItemSelected() ", conforme a apostila e o BioMago, alterando as opções do "switch" para:
  • calcular o fatorial;
  • invocar a activity de ajuda;

Se você não conseguir fazer, relaxe! Nós já colocamos a solução dentro do projeto do curso (http://code.google.com/p/curso-basico-thecodebakers/downloads/list).

Estilo

Um estilo é um conjunto de propriedades que afetam a visualização de um item. Podem ser definidas diretamente ou em um arquivo XML (similar ao conceito de CSS). Também existe o conceito de herança, onde um estilo "herda" de outros. Exemplo:
<style name="titulo_link" parent="@android:style/TextAppearance.Large"> 
<item name="android:textColor">#ffffff</item> 
<item name="android:typeface">monospace</item> 
<item name="android:textStyle">bold</item> 
<item name="android:layout_height">wrap_content</item> 
<item name="android:clickable">true</item> 
</style> 
<style name="titulo_link.vermelho"> 
<item name="android:textColor">#ff0000</item> 
</style> 


Podemos utilizar o estilo derivado em qualquer View:
<TextView 
style="@style/titulo_link.vermelho" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:text="@string/linear" 
android:onClick="clicouLinear" 
/> 


Podemos definir várias propriedades, dependendo do tipo de elemento, por exemplo:

TextView / EditText
"android:gravity"
como alinhar o texto se ele for menor que a "View". Os valores possíveis são: "top", "bottom", "left", "right", "center_vertical", "center_horizontal", "center", "fill_vertical", "fill_horizontal" etc;
"android:height"
altura da View. A unidade pode ser: px (pixels), dp (density-independent pixels), sp (scaled pixels basedos no tamanho de letra preferido), in (polegadas), mm (milímetros).;
"android:textColor"
uma cor em formato RGB Html (ou uma referência a outro estilo);
"android: textSize"
tamanho da letra. Pode usar qualquer unidade das já mencionadas;
"android:textStyle"
"normal", "bold" ou "italic";
"android: typeFace"
"normal", "sans", "serif" e "monospace" (**);


(**) Se você quiser utilizar fontes externas, é possível carregar arquivos "TTF" - Trye Type Font, como "asset" e configurar em sua aplicação, Mas isto está fora do escopo deste curso.

Os estilos podem ficar dentro de arquivos XML, localizados na pasta "res/values". Veja o projeto "Layouts".

Arquivo(s) anexado(s)


Não respondo dúvidas via email, caixa de entrada ou mensagem privada. Procure o fórum sobre seu aparelho e crie um tópico novo com a dúvida, assim não somente eu mas qualquer membro poderá ajudá-lo.