Capítulo 02: Cadastro de Alunos - ?· M.Sc. Márcio Palheta 11/75 Exercício 02: Tela de listagem Agora…

  • View
    213

  • Download
    0

Embed Size (px)

Transcript

  • Captulo 02: Cadastro de Alunos

  • M.Sc. Mrcio Palheta 2/75

    Instrutor

    Programador desde 2000 Aluno de doutorado Mestre em informtica pelo

    ICOMP/UFAM Especialista em aplicaes

    WEB FUCAPI marcio.palheta@gmail.com sites.google.com/site/marcio

    palheta

    mailto:marcio.palheta@gmail.com

  • M.Sc. Mrcio Palheta 3/75

    Agenda Definies de projeto Registro Acadmico Pensando em Casos de Uso Criao de uma nova App Criao da Tela de Listagem de Alunos Trabalhando com ListView, List e Adapters Integrao entre componentes de tela e controladores Alertas baseados no componente Toast Evento de clique simples em uma lista Evento de clique longo

  • M.Sc. Mrcio Palheta 4/75

    Definies de Projeto

    Como estratgia para apresentao do contedo deste curso, realizaremos a implementao de uma app para Manipulao de Dados de Alunos

    Em linhas gerais, nossa app consiste em:

    Manter dados de alunos; Entrar em contato com alunos; Trocar dados com um servidor WEB; E Compartilhar contedo em mdias ;

  • M.Sc. Mrcio Palheta 5/75

    Funcionalidades da nossa App

  • M.Sc. Mrcio Palheta 6/75

    Funcionalidades da nossa App

  • M.Sc. Mrcio Palheta 7/75

    Comeando pelo cadastro Neste requisito da nossa

    App, precisamos de: Uma tela para listar

    Alunos E outra para cadastrar ou

    alterar dados de Alunos A excluso deve ocorrer

    com a seleo de um aluno na tela de listagem

    Vamos comear criando uma nova Android Application

  • M.Sc. Mrcio Palheta 8/75

    Exerccio 01: Nova Android Application

  • M.Sc. Mrcio Palheta 9/75

    Exerccio 01: Nova Android Application Clique em Next, at chegar ltima tela:

  • M.Sc. Mrcio Palheta 10/75

    Estrutura de pastas da App

  • M.Sc. Mrcio Palheta 11/75

    Exerccio 02: Tela de listagem

    Agora vamos definir a Tela de listagem de alunos Nossa tela precisa dos seguintes componentes:

    Lista: apresentao dos nomes dos alunos. O componente com essa funo o ListView, que recebe uma coleo de Objetos e lista seus dados

    Campo de texto: onde o usurio informa o nome de um aluno que deseja incluir na listagem. Usaremos o EditText

    Boto: para adicionar o nome do aluno lista. Usaremos o componente Button.

  • M.Sc. Mrcio Palheta 12/75

    Exerccio 02: Tela de listagem

    Altere o arquivo: /res/values/strings.xml

  • M.Sc. Mrcio Palheta 13/75

    Exerccio 02: Tela de listagem

    Altere o arquivo: /res/values/strings.xml

    Strings usadas naTela de Listagem

  • M.Sc. Mrcio Palheta 14/75

    Exerccio 02: Tela de listagem Altere: /res/layout/listaalunoslayout.xml

  • M.Sc. Mrcio Palheta 15/75

    Exerccio 02: Tela de listagem Altere: /res/layout/listaalunoslayout.xml

    Campo de Textoid=edNomeListagem

  • M.Sc. Mrcio Palheta 16/75

    Exerccio 02: Tela de listagem Altere: /res/layout/listaalunoslayout.xml

    Componente Botoid=btAddListagem

  • M.Sc. Mrcio Palheta 17/75

    Exerccio 02: Tela de listagem Altere: /res/layout/listaalunoslayout.xml

    Componente Listapara exibir Alunos

    id=lvListagem

  • M.Sc. Mrcio Palheta 18/75

    Exerccio 02: Tela de listagem

    Execute sua App Repare que os os

    componentes EditText e Button esto visveis

    No entanto, a ListView no aparece

    Isso ocorre porque nossa lista ainda est vazia

  • M.Sc. Mrcio Palheta 19/75

    Exerccio 02: Tela de listagem

    Execute sua App Repare que os os

    componentes EditText e Button esto visveis

    No entanto, a ListView no aparece

    Isso ocorre porque nossa lista ainda est vazia

    Campo de Texto e Boto estodisponveis

  • M.Sc. Mrcio Palheta 20/75

    Exerccio 02: Tela de listagem

    Execute sua App Repare que os os

    componentes EditText e Button esto visveis

    No entanto, a ListView no aparece

    Isso ocorre porque nossa lista ainda est vazia

    Campo de Texto e Boto estodisponveis

    Nossa Lista de alunos ainda est vazia

  • M.Sc. Mrcio Palheta 21/75

    Controladores e as regras de negcio

    As telas (xml) que criamos em Android esto associadas a classes Java (controladores), responsveis pela implementao de suas regras de negcio

    A nossa tela listaalunoslayou.xml controlada pela classe ListaAlunosActivity.java

    A classe de controle captura os eventos e componentes da tela e implementa as regrasde negcio necessrias s funcionalidades da nossa App

  • M.Sc. Mrcio Palheta 22/75

    Exerccio 03: Atributos e coleo

  • M.Sc. Mrcio Palheta 23/75

    Exerccio 03: Atributos e coleo

    Componente de Tela, acessados na classe

    de controle

  • M.Sc. Mrcio Palheta 24/75

    Exerccio 03: Atributos e coleo

    Objeto que guarda a coleo de Alunos

  • M.Sc. Mrcio Palheta 25/75

    Exerccio 03: Atributos e coleo

    Mtodo que pode serusado para inicializar

    os atributos

  • M.Sc. Mrcio Palheta 26/75

    Exerccio 04: Inicializao de atributos

  • M.Sc. Mrcio Palheta 27/75

    Exerccio 04: Inicializao de atributosO mtodo setContentView(...) associa uma Tela(.xml) a uma

    classe de controle (Activity.java)

  • M.Sc. Mrcio Palheta 28/75

    Exerccio 04: Inicializao de atributos

    O mtodo findViewById(...) associacomponentes da View a

    atributos da Activity

  • M.Sc. Mrcio Palheta 29/75

    Exerccio 04: Inicializao de atributos

    O mtodo setOnClickListener(...) usado para captura do

    Clique do Boto

  • M.Sc. Mrcio Palheta 30/75

    Exerccio 04: Inicializao de atributos

    O mtodo setOnClickListener(...) usado para captura do

    Clique do Boto

    comum utilizarmos umaimplementao annima

    da Interface OnClickListener

  • M.Sc. Mrcio Palheta 31/75

    Itens a ponderar

    Precisamos inicializar a coleo de alunos e exibir os nomes na nossa ListView

    Contudo, uma ListView um componente de tela que pode assumir diversos formatos de visualizao

    Com isso, a ListView precisa da ajuda de algum que saiba como organizar os dados na tela

    Ou seja, a ListView precisa do apoio de um Adaptador, que saiba converter objetos Java para componetes de Tela. Chamamos esse Objeto de apoio de Adapter.

  • M.Sc. Mrcio Palheta 32/75

    ListView's com layouts diferentes

  • M.Sc. Mrcio Palheta 33/75

    Exerccio 05: Novos atributos

  • M.Sc. Mrcio Palheta 34/75

    Exerccio 05: Novos atributos

    Declarao de Novos Atributos

  • M.Sc. Mrcio Palheta 35/75

    Exerccio 05: Novos atributos

    Declarao de Novos Atributos

    Objeto que converteListas e Vetores

    em View

  • M.Sc. Mrcio Palheta 36/75

    Exerccio 05: Novos atributos

    Declarao de Novos Atributos

    Definio do Layoutque o Adapter usar

  • M.Sc. Mrcio Palheta 37/75

    Passo-a-passo

    Agora que j:

    associamos objetos java a componentes de tela e criamos o adptador que sabe exibir List

    Vamos inicializar:

    A coleo de nomes de Alunos(List); O adaptador (ArrayAdapter); e A ListView que vai exibir os nomes na tela;

    No final, associaremos o adaptador ListView

  • M.Sc. Mrcio Palheta 38/75

    Exerccio 06: Inicializao da ListView

  • M.Sc. Mrcio Palheta 39/75

    Exerccio 06: Inicializao da ListView

    Declarao de Novos Atributos

  • M.Sc. Mrcio Palheta 40/75

    Exerccio 06: Inicializao da ListView

    Declarao de Novos AtributosInicializa a coleo de

    nomes de Alunos

  • M.Sc. Mrcio Palheta 41/75

    Exerccio 06: Inicializao da ListView

    Declarao de Novos AtributosInicializa o Adapter, com

    a atividade contexto (this),layout padro(adapterLayout) e a

    coleo de alunos (listaAlunos)

  • M.Sc. Mrcio Palheta 42/75

    Exerccio 06: Inicializao da ListView

    Declarao de Novos Atributos

    Associao do Adapter ListView

  • M.Sc. Mrcio Palheta 43/75

    Passo-a-passo

    Agora, podemos atualizar o evento de clique do boto Adicionar Aluno;

    Maaaas, o que devemos fazer quando do clique? Precisamos:

    Adicionar o nome digitado no campo edNome coleo listaAlunos;

    Limpar o contedo do campo edNome; e Atualizar o contedo da ListView

  • M.Sc. Mrcio Palheta 44/75

    Exerccio 07: Evento de Click do boto No final do mtodo onCreate(), inclua:

    Implementao doEvento de Clique

  • M.Sc. Mrcio Palheta 45/75

    Exerccio 07: Evento de Click do boto No final do mtodo onCreate(), inclua:

    Implementao doEvento de Clique

    Adiciona o nomeInformado no campo

    edNome coleo

  • M.Sc. Mrcio Palheta 46/75

    Exerccio 07: Evento de Click do boto No final do mtodo onCreate(), inclua:

    Implementao doEvento de Clique

    Limpa o contedodo campo edNome

  • M.Sc. Mrcio Palheta 47/75

    Exerccio 07: Evento de Click do boto No final do mtodo onCreate(), inclua:

    Implementao doEvento de Clique

    Atualiza o contedoda ListView

  • M.Sc. Mrcio Palheta 48/75

    Dando um confere no resultado

    Rode sua App Inclua alguns nomes Ainda poderamos agregar

    mais alguma funcionalidade?

    Que tal exibir um alerta com o nome do aluno, quando do clique em um nome da lista?

  • M.Sc. Mrcio Palheta 49/75

    Evento de click da ListView

    Assim como Button, a ListView possui o evento de click Contudo, a ListView apresenta dois tipos de click:

    Click curto, quando o usurio clica em um item da ListView; e

    Click Longo, quando o usurio clica e segura um item da ListView ;

    Vamos implementar os eventos de clique Longo e Simple