Componente Listview no Android Studio
Veja nesse artigo como criar um aplicativo em Android trabalhando com listas através do componente ListView com menus, eventos e chamadas de novas janelas pelo ambiente de desenvolvimento Android Studio.
O ListView é um componente visual utilizado para o Android onde sua finalidade é de armazenar uma ampla quantidade de informações e com o poderio de atualizar, receber e enviar eventos dinamicamente. Nesse artigo o ambiente de desenvolvimento a ser utilizado é o Android Studio, que além de possuir uma estrutura poderosa dividida em layouts de tela e de códigos, é muito leve e de fácil manipulação do usuário. O objetivo desse artigo é criar um aplicativo através de uma lista contendo menus e eventos em cada um, configurar permissões para internet e chamadas telefônicas e também desenvolver uma tela “Sobre” para a prática na navegação entre telas.
O emulador da máquina virtual compatível com o Android Studio e recomendado é o Genymotion, com o dispositivo virtual Google Nexus 5 – 5.0.0 – API 21 – 1080x1920 e também é necessário ter o JDK (Java SE Development Kit) com a versão 7 ou superior instalado na máquina.
Um Pouco sobre Android
Android é um sistema operacional voltado para dispositivos móveis. Possui interface por manipulação direta através de touch e seus elementos são de forma robusta, mudança de orientação de tela, os seus aplicativos em sua maioria estão na loja Google Play, tem alta recepção no mercado, o seu gerenciamento de memória por padrão é com economia de energia.
Algumas das vantagens do Android são: segurança, privacidade, possibilidade de uso em modo anônimo e seu código é aberto.
A arquitetura do Android é dividida em camadas, ou seja, cada parte é responsável por gerenciar seus respectivos processos. Essas camadas podem ser divididas em níveis zero, um, dois e três.
Nível 3: Camada de Aplicações
- Constituem de funções básicas do dispositivo;
- Possui interação entre o usuário e o dispositivo móvel;
- Organizam também em aplicativos, cliente de e-mail, programa de SMS, calendário, mapas, navegador, contatos entre outros.
Nível 2: Camada de Framework de Aplicação
- Contém programas que gerenciam as aplicações básicas do telefone;
- Tem acesso total ao framework como um conjunto de ferramentas simples com o qual possibilita construir ferramentas mais complexas;
Nível 1: Bibliotecas
- São um conjunto de instruções que dizem ao dispositivo como lidar com diferentes tipos de dados, incluindo um conjunto de biblioteca C/C + +;
- Possui relações com a parte Multimídia;
- Organizam se também em camadas 2D e 3D;
- Possibilitam a navegação Web;
- Armazenam gráficos, funções, imagens e acesso ao banco de dados SQLite.
Nível 1: Runtime
- Constitui em um conjunto de bibliotecas do núcleo Java (Core Libraries);
- Para desenvolver aplicações para o Android, se utiliza a linguagem de programação Java;
- Contém a Máquina Virtual Dalvik (para cada aplicação no Android) trazendo melhor desempenho e executa vários processos paralelamente.
Nível 0: Kernel (Linux)
- Camada derivada do kernel 2.6 do Linux;
- Contém programas de gerenciamento de memória;
- Gerenciam configurações de segurança;
- Possui drivers de hardware;
- Faz os controles de processos;
- Controla o gerenciamento de memória, threads, rede e segurança.
Genymotion
Genymotion é um software de emulação do Android onde permite que o usuário execute o sistema operacional do Google no Windows.
A vantagem desse aplicativo é que ele oferece imagens de edições diversas desse sistema operacional incluindo Jelly Bean, posteriormente denominado Nexus S e suas evoluções, dentre outros dispositivos.
Quando o Genymotion é emulado, ele não apenas roda o Android na máquina, ele também conta com suporte para redes de conexão à internet (Wi-Fi), recursos como GPS, ADB e integrações com Android Studio e Eclipse.
Talvez a única 'desvantagem' seja ter que fazer cadastro, mas depois de feito isso, poderá fazer downloads necessários. Para usar o Genymotion, basta autenticar a inicialização do programa inserindo os dados de login recém-criados.
Após isso, o aplicativo exibe uma tela com a lista de imagens do Android disponíveis. Tem que selecionar a versão requerida e carregá-la. Após o término desse processo, para iniciar a emulação, é só clicar em 'Play' ou 'Start' em outras versões. Feito todos esses procedimentos, é só esperar o carregamento do sistema
O Projeto
Tendo o Android Studio instalado, será criado o projeto clicando no menu Quick Start, bastando clicar em “Start a new Android Studio project", como mostra a Figura 1.
Será apresentada a janela seguinte para configurar as seguintes sugestões:
- Nome: Listas;
- Domínio (obrigatório estar separado por pontos): listas.devmedia.br.listas
- Localização: D:\Listas.
Veja como fica na Figura 2.
Ao clicar em Next, será apresentada uma janela para escolher a plataforma do projeto. Vamos usar a Phone/Tablet, como mostra a Figura 3.
Escolha a opção Blank Activity para iniciarmos. Clicando em Next vai aparecer a janela para colocar o nome da Atividade, o nome do layout, título e o nome do recurso. Para o nosso projeto pode deixar por padrão o que foi gerado automaticamente. Finalize clicando em Finish.
Hierarquia das Partes no Android Studio
Após ter criado o projeto, será gerada uma hierarquia pronta para desenvolvimento, como mostra a Figura 4.
Os nossos arquivos principais são activity_main.xml (na pasta layout) e a Atividade Principal: MainActivity (no diretório listas.devmedia.br.listas).
Já na parte central da tela do Android Studio será apresentado a estrutura da Figura 5.
Na parte centralizada da figura vemos o dispositivo móvel pronto para receber os elementos. Na parte superior estão as configurações do smartphone e a versão do Android instalado. Na parte inferior temos as abas Design e Text (programação).
Tela 'Sobre'
Vamos criar uma nova atividade para tela Sobre da nossa aplicação. Para isso, basta clicar com o botão direito no diretório listas.devmedia.br.listas e ir em New → Activity → Blank Activity. Será aberta uma nova janela e configure de acordo com os dados a seguir:
- Nome: actSobre;
- Título: Sobre;
- Hierarchical Parent: clique no botão [...] e selecione automaticamente a tela ancestral que nesse caso é o MainActivity
Veja como fica na Figura 6.
Clique em Finish para confirmar as configurações. No arquivo menu_main.xml devemos inserir os códigos referentes a Listagem 1, responsável por nomear o diretório atual, tornar a página MainActivity como principal, criar um botão denominado Setting (configurações) e outro botão denominado Gravar, demonstrando que é possível criar botões dentro do menu principal.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity">
<item android:id="@+id/action_settings" android:title="@string/action_settings"
android:orderInCategory="100" app:showAsAction="never" />
<item android:id="@+id/action_gravar" android:title="Gravar"
android:orderInCategory="101" app:showAsAction="always" />
</menu>Listagem 1. Menu_main.xml
No arquivo menu_actSobre.xml será colocado o código referente a Listagem 2, responsável por manter o controle de navegação e identidade de esquemas com relação a tela Sobre, e permitir receber eventos.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" tools:context="br.unoeste.listas.ActSobre">
<item android:id="@+id/action_settings" android:title="@string/action_settings"
android:orderInCategory="100" app:showAsAction="never" />
</menu>Listagem 2. Menu_actSobre.xml
No arquivo activity_act_sobre.xml, localizado no caminho res/layout, acrescente o código da Listagem 3, responsável em definir as dimensões da altura e largura do layout, além de definir a orientação superior, inferior direita e esquerda da tela. Além disso, inserimos um componente TextView (texto), onde está configurado um texto para exibição, a largura, altura, tamanho, cor e posições com relação a tela
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context="listas.devmedia.br.listas.actSobre">
<TextView android:text="Tela de Sobre DEVMEDIA" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:textColor="#ff0e18ff"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout> Listagem 3. Activity_act_sobre.xml
No arquivo actSobre (localizado no diretório listas.devmedia.br.listas) será inserido o código referente a Listagem 4.
package listas.devmedia.br.listas;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
public class actSobre extends ActionBarActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_act_sobre);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_act_sobre, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}Listagem 4. Arquivo actSobre
Esse código é gerado automaticamente no momento da criação da Atividade Sobre e é responsável em manter um controle sobre as ações e interações do arquivo actSobre.
Tela Principal com Lista
No arquivo activity_main.xml na aba Text será colocado o código da Listagem 5.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/lvopcoes"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true" />
</RelativeLayout>Listagem 5. Arquivo activity_main.xml
Esse código é responsável por definir os controles sobre a tela e suas configurações. Além disso, é adicionado o componente ListView que contém suas especificações de altura, largura, id, dimensões e propriedades.
Implementação da Tela Principal
A tela principal será composta de uma lista onde cada item será responsável por um evento diferente. Dentro do arquivo MainActivity (localizado no diretório listas.devmedia.br.listas), coloque o seguinte código da Listagem 6.
package listas.devmedia.br.listas;
import android.content.Intent;
import android.net.Uri;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends ActionBarActivity {
List<String> opcoes;
ArrayAdapter<String> adaptador;
ListView lvOpcoes;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
lvOpcoes = (ListView) findViewById(R.id.lvopcoes);
opcoes = new ArrayList<String>();
opcoes.add("Navegar na Internet");
opcoes.add("Fazer uma ligação");
opcoes.add("Sobre");
opcoes.add("Sair");
adaptador = new ArrayAdapter<String>(MainActivity.this, android.R.layout.simple_list_item_1, opcoes);
lvOpcoes.setAdapter(adaptador);
lvOpcoes.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
switch (position){
case 0: navegarInternet();
break;
case 1: fazerLigacao();
break;
case 2: exibirSobre();
break;
case 3: finish();
break;
}
}
});
}
private void exibirSobre() {
Intent it = new Intent(MainActivity.this, actSobre.class);
startActivity(it);
}
private void fazerLigacao() {
Uri uri = Uri.parse("tel:0123456789012");
Intent itNavegar = new Intent(Intent.ACTION_DIAL,uri);
startActivity(itNavegar);
}
private void navegarInternet() {
Uri uri = Uri.parse("http://www.devmedia.com.br");
Intent itNavegar = new Intent(Intent.ACTION_VIEW,uri);
startActivity(itNavegar);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == R.id.action_settings) {
Toast.makeText(this,"Selecionou em configuração",Toast.LENGTH_SHORT).show();
return true;
}
if (item.getItemId() == R.id.action_gravar) {
Toast.makeText(this,"Selecionou em gravar",Toast.LENGTH_SHORT).show();
return true;
}
return super.onOptionsItemSelected(item);
}
}Listagem 6. MainActivity
Esse código é responsável por exibir uma lista de opções na tela.
Através de um List (denominado de opções) são armazenados os dados através de um ArrayList, que é um conjunto de menus.
O ArrayAdapter (com o nome de adaptador) é responsável por manter uma ligação entre os dados a serem inseridos na tela e o componente em si (localizado na parte layout).
O ListView (chamado de lvOpcoes) é o componente que recebe o adaptador e todos os seus eventos que passam a ser incrementados.
É criado um método onItemClick do tipo AdapterView que descrimina cada item da posição caso o usuário aperte em algum elemento da lista na tela. Assim, o método será chamado:
- A Posição 0 (ou seja o primeiro item da lista) chama o método navegarInternet();
- A Posição 1 (segundo item) chama o método fazerLigacao();
- A Posição 2 (terceiro item), chama o método exibirSobre();
- E caso o usuário selecione a Posição 3, então é chamado o método finish(), responsável por sair da aplicação.
O método exibirSobre() ilustra um dos objetivos desse artigo que é chamar a outra tela Sobre que contém instruções de navegações de tela.
O método fazerLigacao() é responsável por chamar uma outra tela e ao mesmo tempo passar por parâmetro o número para fazer uma ligação. O código Intent.ACTION_DIAL é o que realiza essa interação.
O método navegarInternet(), que contém o código Intent.ACTION_VIEW, é responsável por fazer uma transição de tela onde o navegador de Internet entra em ação, passando por parâmetro (uri) o endereço do site.
O método onOptionsItemSelected(MenuItem item) passa por parâmetro o item que o usuário selecionou. Esse menu se localiza na parte superior da tela, onde é criada uma condição (if) na qual se é selecionado o item action_settings então surge uma mensagem afirmando que selecionou a Configuração, se é selecionado o item action_gravar, então aparece na tela afirmando que selecionou Gravar.
Arquivo ANDROIDMANIFEST.XML
O AndroidManifest.xml é o arquivo principal do projeto e nele ficam todas as configurações. Obrigatoriamente ele tem que ficar na pasta raiz do projeto e conter todas as configurações necessárias para executar o projeto, como o nome do pacote que está sendo utilizado, os nomes das classes de cada atividade e várias outras configurações.
No interior da tag é preciso declarar o pacote principal do projeto: por conta disso é utilizada a tag .
Cada activity do projeto deve ser obrigatoriamente declarada no arquivo AndroidManifest.xml. Caso não esteja, então não é possível utilizar a atividade. Ao declarar a activity é utilizada a tag , recebendo o nome da classe, que é sempre relativa ao pacote principal.
Nesse arquivo serão anexados o seguinte código da Listagem 7.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="listas.devmedia.br.listas" >
<uses-permission android:name="INTERNET" />
<uses-permission android:name="android.permission.CALL_PHONE" />
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name=".actSobre"
android:label="@string/title_activity_act_sobre"
android:parentActivityName=".MainActivity" >
<meta-data
android:name="android.support.PARENT_ACTIVITY"
android:value="listas.devmedia.br.listas.MainActivity" />
</activity>
</application>
</manifest>Listagem 7. Arquivo AndroidManifest.xml
Para que o aplicativo utilize as permissões para Internet, então é implementado o código . Além disso, para que o aplicativo utilize as permissões de chamadas telefônicas, usamos o código .
O restante do arquivo foi gerado automaticamente desde a criação do projeto até a criação de novas atividades.
Para finalizar, basta iniciar o ambiente de virtualização Genymotion com o dispositivo virtual já instalado por fins de emulação. Execute o projeto indo no Android Studio e clicando em Run, localizado na parte superior do ambiente ou aperte as teclas de atalho Shift+F10.
A tela principal do aplicativo deve ficar idêntica a Figura 7.
Veja como é simples trabalhar com o Android Studio, pois boa parte da programação é gerada pelo mesmo, ajudando na produtividade do programador.
Aprenda mais sobre Android
Artigos relacionados
-
Artigo
-
Artigo
-
Vídeo
-
Artigo
-
DevCast