Capítulo 03 - Formulários, menus e navegação entre telas

11,523 views

Published on

Neste capítulo discutimos itens como:
1. Rolagem de tela com ScrowView;
2. Range de notas com SeekBar;
3. Exibição de Imagens com ImageView;
4. Exibição de menus com OptionMenu, MenuInflater e ActionBar;
5. Transição de telas com Intents;
6. Encerramento de uma activity 

Published in: Technology

Capítulo 03 - Formulários, menus e navegação entre telas

  1. 1. Capítulo 03: Formulários e menus
  2. 2. Instrutor ● Programador desde 2000 ● Aluno de doutorado ● ● ● ● Mestre em informática pelo ICOMP/UFAM Especialista em aplicações WEB – FUCAPI marcio.palheta@gmail.com sites.google.com/site/marcio palheta M.Sc. Márcio Palheta
  3. 3. Agenda ● ● Activity para Formulario de cadastro de alunos Novos componentes: ScrollView, ImageView e SeekBar ● Trocar a tela inicial de uma App ● Trabalhando com Menus: OptionMenu e ActionBar ● Transição de telas com Intents M.Sc. Márcio Palheta 3/51
  4. 4. Incrementando o cadastro ● ● ● ● Precisamos Cadastrar e Alterar os dados do aluno Dados: Foto, Nome, Fone, Endereço, Site, Email e Nota Mas a tela do device é limitada Vamos criar uma nova Activity (tela) para edição dos dados dos alunos M.Sc. Márcio Palheta 4/51
  5. 5. Exercício 01: Tela de dados do Aluno ● Ctrl+N / Android / Android Activity M.Sc. Márcio Palheta 5/51
  6. 6. Exercício 01: Tela de dados do Aluno ● Configure os dados da nova Activity M.Sc. Márcio Palheta 6/51
  7. 7. Passo-a-passo ● ● ● ● ● Altere o arquivo de internacionalização: strings.xml Na tela nova, inclua os campos necessários ao formulário de cadastro de alunos Implemente o método onCreate() da classe de controle, para associação de atributos a componentes de tela Altere o arquivo AndroidManifest.xml, para que sua nova tela seja a primeira a ser executada, ao invés da tela de listagem Execute sua app M.Sc. Márcio Palheta 7/51
  8. 8. Exercício 02: Formulário de cadastro ● ● Vamos criar um formulário para cadastro de alunos Novos componentes: – ImageView: para exibir a foto o usuário, armazenada no próprio device; – SeekBar: para que o usuário escolha uma nota, dentro de um intervalo M.Sc. Márcio Palheta 8/51
  9. 9. Exercício 02: Formulário de cadastro ● Início do arquivo: /res/layout/formulario.xml M.Sc. Márcio Palheta 9/51
  10. 10. GroupView que, Exercício 02: Formulário de cadastro na a falta de espaço, permite rolagem da tela ● Início do arquivo: /res/layout/formulario.xml M.Sc. Márcio Palheta 10/51
  11. 11. Exercício 02: Formulário de cadastro ● Início do arquivo: /res/layout/formulario.xml GroupView para agrupamento de componentes do formulario M.Sc. Márcio Palheta 11/51
  12. 12. Exercício 02: Formulário de cadastro ● Início do arquivo: /res/layout/formulario.xml Exibe um arquivo de imagem com a foto do aluno M.Sc. Márcio Palheta 12/51
  13. 13. Exercício 02: Formulário de cadastro ● Início do arquivo: /res/layout/formulario.xml Local de armazenamento da imagem M.Sc. Márcio Palheta 13/51
  14. 14. Exercício 02: Nome e Telefone M.Sc. Márcio Palheta 14/51
  15. 15. Exercício 02: Site e E-mail M.Sc. Márcio Palheta 15/51
  16. 16. Exercício 02: Endereço e Nota M.Sc. Márcio Palheta 16/51
  17. 17. Exercício 02: Botão para salvar ● Final do arquivo: /res/layout/formulario.xml M.Sc. Márcio Palheta 17/51
  18. 18. Exercício 03: Baixa de imagens ● Baixando imagens direto do repositório do nosso curso: https://github.com/marciop alheta/cursosandroid/tree/ master/CadastroAluno/res Baixe as imagens das pastas: – ● – drawable-(hdpi, mdpi e xhdpi) M.Sc. Márcio Palheta 18/51
  19. 19. AndroidManifest.xml M.Sc. Márcio Palheta
  20. 20. AndroidManifest.xml Definições da nossa App M.Sc. Márcio Palheta
  21. 21. AndroidManifest.xml Definições da Tela de Listagem M.Sc. Márcio Palheta
  22. 22. AndroidManifest.xml Define a Activity ListaAlunos como tela inicial da aplicação M.Sc. Márcio Palheta
  23. 23. AndroidManifest.xml Definições da Tela de Formulário M.Sc. Márcio Palheta
  24. 24. Exercício 04: Alteração de tela inicial ● Altere o AndroidManifest para que o formulário seja a tela inicial da nossa App
  25. 25. Exercício 04: Alteração de tela inicial ● Altere o AndroidManifest para que o formulário seja a tela inicial da nossa App Definições da Tela de Formulário
  26. 26. Exercício 04: Alteração de tela inicial ● Altere o AndroidManifest para que o formulário seja a tela inicial da nossa App Definições da Tela de Formulário Seta o Formulario como tela inicial
  27. 27. Execute a App 27/51
  28. 28. Antes de continuar... ● Torne novamente a ListaAlunosActivity a tela inicial da nossa aplicação: Definições da Tela de Listagem
  29. 29. Navegação entre telas ● Agora que temos duas telas na nossa App, precisamos de algum mecanismo para navegar entre elas ● Para essa atividade, é comum utilizarmos menus ● Toda Activity do Android já sabe tratar menus ● Precisamos apenas sobrescrever o método: – ● ● onCreateOptionsMenu(Menu menu), que recebe do Android um menu vazio O próprio Android se encarrega de encaixar o menu na tela Para exibir o menu da App: – Basta clicar no Botão Menu do device 29/51
  30. 30. Estratégia para definição de Menus ● Apesar de ser possível a definição de Menus a partir de objetos Java, é mais comum o uso de arquivos XML: <item android:id="@+id/menu_novo" android:icon="@drawable/ic_novo" android:showAsAction="always" android:title="Novo"/> <item android:id="@+id/menu_mapa" android:icon="@drawable/ic_mapa" android:showAsAction="always" android:title="Mapa"/> ● O método Activity.onCreateOptionsMenu retorna true para indicar que o menu deve ser exibido na tela 30/51
  31. 31. Estratégias para definição de Menus ● O Android precisa ler o XML com itens do menu e criar objetos do tipo View, a partir das tags ● Essa é a especialidades dos Inflaters ● O MenuInflater é especialista em carregar XML de menu ● ● ● O método Activity.onCreateOptionsMenu(Menu menu) nos oferece um objeto Menu vazio, que pode ser utilizado pelo MenuInflater para carregar um XML com itens do menu O método Activity.getMenuInflater() nos devolve um MenuInflater Inflater.inflate(): lê um XML e carrega um Menu 31/51
  32. 32. Exercício 05: Menu principal ● Altere o nome da App, no arquivo strings.xml:
  33. 33. Exercício 05: Menu principal ● Altere o nome da App, no arquivo strings.xml:
  34. 34. Exercício 05: Menu principal ● Altere o nome da App, no arquivo strings.xml:
  35. 35. Exercício 05: Menu principal ● Crie o arquivo XML: res/menu/menu_principal: M.Sc. Márcio Palheta 35/51
  36. 36. Exercício 05: Menu principal ● Crie o arquivo XML: É comum que apenas dois Itens do Menu fiquem res/menu/menu_principal: demais, ocultos visíveis e os M.Sc. Márcio Palheta 36/51
  37. 37. Exercício 05: Menu principal ● Crie o arquivo XML: res/menu/menu_principal: Define que o item pertence a uma ActionBar, que surgiu no Android 3.0 M.Sc. Márcio Palheta 37/51
  38. 38. Exercício 05: Menu principal ● Crie o arquivo XML: res/menu/menu_principal: Define que o item pertence a uma ActionBar, que surgiu no Android 3.0 Devices com Android 2.x trocam a ActionBar por OptionMenu M.Sc. Márcio Palheta 38/51
  39. 39. Exercício 05: Menu principal (cont...) M.Sc. Márcio Palheta 39/51
  40. 40. Exercício 05: Menu principal ● Altere o método onCreateOptionsMenu(Menu menu) da classe ListaAlunosActivity: M.Sc. Márcio Palheta 40/51
  41. 41. Exercício 05: Execute a sua App M.Sc. Márcio Palheta 41/51
  42. 42. Exercício 06: Eventos de click ● ● Para monitorar o click, precisaremos implementar o método onOptionsItemSelected da ListaAlunosActivity Por ora, exibiremos apenas uma mensagem num Toast, quando o usuário clicar no item NOVO: M.Sc. Márcio Palheta
  43. 43. Exercício 06: Clique no item NOVO M.Sc. Márcio Palheta 43/51
  44. 44. Navegação entre telas da nossa App ● ● ● ● Agora que temos configurada a ActionBar, podemos continuar incrementando nossa App Vamos fazer com que o clique no menu NOVO faça surgir a tela de Formulário Para isso, usamos objetos do tipo Intent, que recebem um contexto e uma Activity que deve ser exibida Depois de configurada nossa Intenção, podemos iniciar a nova tela (startActivity) M.Sc. Márcio Palheta 44/51
  45. 45. Exercício 07: Abrir o Formulário ● Método de clique da ListaAlunosActivity: M.Sc. Márcio Palheta 45/51
  46. 46. Exercício 07: Abrir o Formulário ● Método de clique da ListaAlunosActivity: M.Sc. Márcio Palheta 46/51
  47. 47. Exercício 08: Fechar o Formulario M.Sc. Márcio Palheta 47/51
  48. 48. Exercício 08: Fechar o Formulario M.Sc. Márcio Palheta 48/51
  49. 49. O que vem a seguir? ● Persistência com SQLite ● Intents ● Câmera e arquivos ● LayoutInflater ● Serviços de background ● Integração via JSON M.Sc. Márcio Palheta 49/51
  50. 50. Referências ● www.caelum.com.br ● d.android.com ● ● LECHETA, Ricardo. Google Android, 3a edição, Novatec, São Paulo, 2013 Código fonte completo: https://github.com/marciopalheta/cursosandroid M.Sc. Márcio Palheta 50/51
  51. 51. Capítulo 03: Formuários e menus

×