Criando uma aplicação básica para Android

Esse tutorial assume que você tem um conhecimento decente de Java e já possui instalado o SDK do Android e o Plugin para o Eclipse. Visite o tutorial “Instalando e atualizando o plugin ADT no Eclipse” para saber como instalar esses dois componentes essenciais. A aplicação criada nesse artigo demonstrará como executar várias tarefas no Android que lhe auxiliarão na criação de aplicações verdadeiramente produtivas.

Criando um novo projeto Android

Abra o  Eclipse e vá para New Project > Android Project. Entre com as seguintes informações para criar um novo projeto:

O projeto base criado para o Android é uma implementação estilo Hello World.

Configurando os Recursos da aplicação

O Google fez um excelente trabalho criando um layout de projeto que permite que você facilmente separe os dados do código. O diretório res/do projeto armazena layouts, imagens, e dados da aplicação. Dados de localização também são armazenados nesse diretório,  mas isso está além do escopo desse tutorial.

Strings

Agora abra res/value/strings.xml. Como a aplicação irá demonstrar como usar diferentes recursos, mude o valor da string “hello” para instruir o usuário a pressionar alguns dos botões. Em seguida adicione um string chamada button_dialog_text clicando em “add”, selecione string  e clique em OK. Uma nova string aparecerá na lista e os campos de texto a direita devem estar em branco. Entre “button_dialog_text” no nome e “Show Dialog Box” no campo “value” ambas sem as aspas e clique no recurso String a esquerda. Faça o mesmo para button_sound_text com o valor “Play Sound”.

Na parte inferior do painel existem 2 abas, recursos e strings.xml. Clique em strings.xml para ver o XML bruto do arquivo. Manualmente adicione uma nova string com o nome button_relative_text e o valor “Show Relative Layout”. A tag XML deve se parecer com “Show Relative Layout”. Antes de seguirmos adiante para configurar os layouts adicione as seguintes strings ao arquivo XML. Nós a usaremos em breve.

<string name="button_update_text">Update</string>
<string name="dialog_title">Dialog Box Title</string>
<string name="dialog_text">Click OK or Cancel to close</string>
<string name="dialog_ok">OK</string>
<string name="dialog_cancel">Cancel</string>
<string name="sound_file">/sdcard/moonbeam.ogg</string>

Layouts do Android

O Android monta a exibição dos componentes a parte dos views. Os views são criados a partir de arquivos XML que dizem ao Android como montar a exibição. Esses layouts são armazenados em res/layout. Abra o arquivo res/layout/main.xml. O Eclipse inclui uma ferramenta de layout visual que deve aparecer. De forma análoga ao arquivo strings.xml editado anteriormente existe outra aba na parte de baixo do painel para exibir o arquivo XML bruto, mas iremos explorar o editor visual primeiro. Lembre que o editor visual não substitui a checagem de como a aplicação é exibida no simulador ou em um dispositivo físico.

Primeiro mude a orientação para retrato com o menu dropdown na parte de cima do painel. Clique no botão a esquerda e arraste-o para o view  logo abaixo da string. Observe que o painel na parte inferior muda as propriedades exibidas e agora mostra as propriedades do botão. Encontre o campo “text” que deve ter o valor de @id/Button01. Mude o valor para @string/button_dialog_text. Usando as strings armazenadas e não codificando os valores diretamente será de grande importância se você tentar localizar sua aplicação para diferentes regiões e linguagens.

Agora adicione um segundo botão e altere o valor de “text” para @string/button_sound_text. Em seguida clique sobre main.xml na aba na parte inferior para explorar o XML. Como outros arquivos XML esse abre com as tags XML padrão.

LinearLayout

Em seguida a tag LinearLayout é aberta para declarar o estilo do layout. O LinearLayout é um layout simples onde cada componente é colocado diretamente depois do elemento anterior. O primeiro elemento dentro do layout linear é nosso objeto “hello” que foi criado com o projeto. Em seguida os dois botões que nós criamos.

Agora vamos adicionar o botão “Show Relative Layout” manualmente. Usualmente você irá querer fornecer a seus botões e outros objetos uma tag ID descritiva, mas para simplificar vamos dar a esse botão a ID Button03. Copie e cole Button02 e altere o valor de android:id para “@+id/Button03” e android:text para “@string/button_relative_text”. Em seguida clique na aba layout e o novo botão deve estar a vista.

Agora iremos precisar criar o layout relativo.

RelativeLayout

O Layout Relative é um outro layout simples do Android. Ele permite que você posicione os objetos em posições relativas a outros objetos da página. Dê um clique com o botão direito em res/layout e selecione New > Android XML file. Na caixa de diálogo informe relative.xml para o arquivo. O tipo do recursos será layout e na parte inferior selecione RelativeLayout como elementos raiz. Clique em finish para criar e abrir o arquivo.. Novamente mude a configuração para retrato para consistência. A visão Relativa irá exibir diferentes componentes que podem ser colocados no view.

Primeiro, adicione um EditText localizado junto aos views a esquerda e arraste-o para o layout. Em seguida clique na aba relative.xml na parte inferior do painel. A partir daqui iremos ajustar o layout a mão. Observe que a tag raiz para esse arquivo é RelativeLayout comparado ao LinearLayout do arquivo main.xml. Layouts relativos permitem que você coloque os elementos em posições relativas ao elementos anteriormente declarados no layout com simples palavras chave.

Mude o valor de android:layout_width para o EditText de wrap_content para fill_parent. Isso irá expandir a caixa de texto para preencher a tela. Agora adicione um botão ao layout através da criação de uma nova tag abaixo de EditText.

<Button android:id="@+id/button_update"
         android:text="@string/button_update_text"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_below="@id/EditText01"
         android:layout_alignParentRight="true"
         />

A tag Button simplesmente cria um botão. Nós associamos a ID button_update e o texto de button_update_text de res/values/strings.xml. Os campos android:layout_width e layout_height são necessários para os elementos que serão exibidos. Eles podem ser ajustados como wrap_content ou fill_parent. para posicionar o elemento os atributos android:layout_below e android:layout_alignParentRight são usados. Isso configura o botão para ficar abaixo do elementos EditTExt01 com o atributo android:layout_below. O atributo booleano android:layout_alignParentRight sendo ajustado para true alinha o elementos a direita do elemento pai.

Em seguida vamos adicionar um elemento Spinner ao layout. Esse elemento é similar a um menu dropdown  em uma página web. Eles são usados para exibir uma lista. Esse tutorial não irá elaborar o uso desse elementos, apenas exibirá um.

<Spinner android:id="@+id/spinner_names"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:layout_below="@id/button_update"
         />

Elementos Spinner são declarados com a tag Spinner. Dê ao spinner a id “@+id/spinner_names”. Observe que para o android:layout_width que nós expandimos para preencher a janela com fill_parent. Simplesmente posicione o Spinner abaixo do botão de atualização.

Trabalhando com o arquivo AndroidManifest.xml

Agora que adicionamos um novo view precisamos criar uma atividade associada. Atividades precisam ser registradas no arquivo AndroidManifest.xml. Quando o projeto foi criado definimos uma atividade chamada TestApp. Ela foi configurada como a atividade da aplicação no arquivo AndroidManifest.xml quando o projeto foi criado. Traga o XML para frente clicando na aba na parte inferior do painel principal.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.higherpass.testapp"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".TestApp"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
</application>
<uses-sdk android:minSdkVersion="5" />
</manifest>

 

Observe que o manifesto começa com a tag padrão do xml. Em seguida existe uma tag que liga o manifesto ao esquema e define os atributos package, versionCode e versionName. Dentro da tag manifest fica a tag application. Essa tag possui os atributos android:icon e android:label que definem o ícone e o nome da aplicação. A tag application contém os nós da atividade que definem as atividades acessíveis da aplicação.

Quando o projeto foi criado a primeira atividade  para TestApp foi inserida no arquivo. Observe que o valor de android:name começa com um “.” que é a classe que é anexada ao nome do pacote. O texto para a atividade é configurada como a string app_name do arquivo strings.xml.

A tag intent-filter é usada para declarar os intents da atividade. Um intent é simplesmente uma tag que define os atributos da atividade. A tag de ação com o nome “android.intent.action.MAIN” declara a atividade inicial. A tag de categoria com o nome “android.intent.category.LAUNCHER” permite que a atividade seja a atividade inicial e listará ela  como carregadora da aplicação Android.

Nós precisamos declarar uma segunda atividade. Clique na aba Application na parte inferior do painel. Role para  a parte de baixo da página para expôr todos os Nós da Aplicação para seções da atividade. Clique em Add em Aplication Nodes. Na caixa de diálogo selecione Activity e clique em Ok. Agora selecione a nova atividade e atualize a seção em Attributes. Primeiro configure o nome para Relative e depois o label para @string/app_name. Clique na atividade e salve o arquivo.

O Eclipse acusará um erro no arquivo até que tenhamos criado a classe da atividade Relative. Antes de cria-la, explore o arquivo XML criado após a adição da nova atividade. Clique na aba AndroidManifest.xml na parte inferior do painel. Você deve ver uma nova tag Activity que deve parecer com o seguinte.

<activity android:name="Relative"
           android:label="@string/app_name">
 </activity>

A tag activity simplesmente fornecerá a atividade um nome e declarará um titulo para a janela.

Compilando o código Android

Agora que a fundação da aplicação foi criada vamos começar a criar o código Java. Primeiro crie a classe Relative para limpar o erro. Dê um clique com o botão direito sobre com.higherpass.testapp no painel a esquerda e selecione New > Class. Informe Relative para o nome e android.app.Activity para Superclass.

Iremos deixar a classe Relative para mais tarde, mas enquanto essa classe existir o erro no arquivo AndroidManifest.xml deixará de aparecer. Agora abra o arquivo TestApp.java em src/com.higherpass.testapp no package explorer. Essa é a tividade padrão de nossa aplicação e a que é executada quando o programa é carregado. Essa classe é preenchida com um código mínimo para carregar qualquer instância em execução e montar o layout a partir do main.xml. A variável R é um objeto especial que é criado pelo SDK no código auto-gerado. O método setContentView exibe o view.

package com.higherpass.testapp;

import android.app.Activity;
import android.os.Bundle;

public class TestApp extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
}

 

Nesse ponto, a aplicação será carregada e exibirá os botões que criamos no main.xml. A próxima coisa que precisamos fazer é cria nossa caixa de diálogo.

final Builder dialog = new AlertDialog.Builder(this);
dialog.setTitle(R.string.dialog_title);
dialog.setMessage(R.string.dialog_text);
dialog.setPositiveButton(R.string.dialog_ok, null);
dialog.setNegativeButton(R.string.dialog_cancel, null);

 

Coloque esse código na função onCreate de TestApp.java abaixo da sentença setContentView. O código em primeiro lugar cria um builder que irá carregar a caixa de diálogo. Em seguida configure o titulo e  o corpo da caixa de diálogo com os métodos setTitle e setMessage respectivamente. Os botões Ok/Cancel são criados com as funções setPositiveButton e setNegativeButton. Observe que usamos a variável R para passar o valor inteiro do ID dos valores strings do arquivo strings.xml.

Agora precisamos anexar funções que processarão os comandos passados para os botões.

Button btnDialog = (Button) findViewById(R.id.Button01);
btnDialog.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View v) {
        dialog.show();
    }
});

 

Para cria essas funções a primeira coisa a fazer é criar um objeto Button que representa o botão do layout. Use o método findViewById para recuperar o ID do botão. Como botões são associados ao TextView que se associam a classe View, é fácil usar findViewById para achar o objeto Button. Muitos componentes são criados a partir da classe View que permite facilmente retornar o tipo com findViewById. A próxima chamada é a setOnClickListener, que recebe uma nova instância anônima de OnClickListener(). Finalmente, configure a ação ao método onClick para dialog.show() para que a caixa de diálogo seja visível com o foco.

Em seguida crie uma função associada ao botão “Play sound”. Aqui temos o mesmo procedimento de antes exceto que ao invés de inicializar uma caixa de diálogo nós iniciaremos o tocador de música. Sons de notificações são normalmente armazenados em /system/media/audio/notifications,  mas infelizmente o simulador não possui esses sons instalados, de modo que você precisará de uma cópia de um arquivo de áudio no cartão SD virtual.

$ adb push /local/path/to/sound/file /sdcard/file

O comando adb push é usado para enviar arquivos para o dispositivo (físico ou virtual) conectado ao adb. O primeiro argumento é o caminho para o arquivo no disco e o segundo argumento é o caminho no dispositivo para armazenar  o arquivo. /sdcard é normalmente o caminho para o cartão SD (físico ou virtual). Agora vamos para o código para usar o tocador de música embutido. O caminho  para o arquivo foi configurado anteriormente no arquivo strings.xml.

Button btnSound = (Button) findViewById(R.id.Button02);
btnSound.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View v) {
        MediaPlayer player = new MediaPlayer();
        try {
            player.setDataSource(getString(R.string.sound_file));
            player.prepare();
            player.start();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
});

 

Adicione uma função de escuta ao Button02 que carrega o tocador de música. Inicialize o objeto MediaPlayer como tocador. Abra um bloco try/catch para capturar exceções geradas pelo objeto MediaPlayer. Depois configure o arquivo a ser tocado a partir do valor da string sound_file no arquivo strings.xml. Use a sentença prepare para deixar o MediaPlayer pronto para uso. Depois use o método start para tocar o arquivo. Finalmente, se uma exceção ocorrer, imprima a mensagem de erro.

Carregando o RelativeLayout

O terceiro botão carrega um novo view. Isso é feito com o mesmo função usada anteriormente, mas dessa vez nós iremos carregar um novo view.

Button btnRelative = (Button) findViewById(R.id.Button03);
btnRelative.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View v) {
        Intent i = new Intent(TestApp.this, Relative.class);
        startActivity(i);
        finish();
    }
});

 

Assim com nos botões anteriores, precisamos obter o ID do botão e criar um objeto com o ID. Depois criamos um OnClickListener. Dessa vez a função inicia um novo intent passando Class.this seguida pela atividade a ser carregada. Nesse caso Relative.class é o parâmetro. Depois chame startActivity passando o novo intent para carregar a atividade. Finalmente chame finish para completar a atividade.

Agora vamos passar para o arquivo Relative.java que contém a nova atividade. Essa atividade simplesmente exibe o novo formulário relative.xml. Essa atividade faz basicamente sobrecarregar a função onCreate. Tudo que temos que fazer é chamar setContentView para o layout relativo passando o ID dele armazenado na variável auto-gerada R.

package com.higherpass.testapp;

import android.app.Activity;
import android.os.Bundle;

public class Relative extends Activity {
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.relative);
    }
}

 

Isso cobre toda a criação de uma aplicação Android básica e deve permitir que você desenvolva as suas próprias aplicações.

Traduzido de