tibuurcio/androidtopics.md

Prólogo

Este material está em fase de desenvolvimento para os alunos do mini-curso de Android realizado em 2015.3 na Escola de Ciências e Tenologia.

Para instruções de instalação do Android Studio, siga o gist abaixo: Contribuição de Victor Matheus!

Tutorial Android Studio, instalação e Hello World!

Índice

Oficina 2

Intents
- Passando informações por intents
- Intents Comuns (Extra)
Drawables
ListView

Oficina 3

Oficina 4

O arquivo Strings.xml
Animações
Styles
Mais Layouts
Sensores

Oficina 5

Hello World

O hello world no android já vem pronto de fábrica. Basta iniciar o Android Studio e criar um novo aplicativo que tudo que você precisa para rodar o programa é clicar na seta verde (Run) que se encontra na barra de ícones. Isso irá iniciar o processo de execução do aplicativo.

Caso haja algum celular conectado, o Android Studio perguntará se você deseja utilizar o celular. Caso não, você pode utilizar o emulador.

Conceitos básicos

Estrutura de projetos

A estrutura de um projeto android se divide basicamente em 3 pastas:

manifests
- Descreve as características fundamentais do seu app e cada um dos seus componentes.
java
- Onde ficam as classes Java do seu projeto.
res
- Imagens, layouts, elementos do menu, componentes gráficos, ícones, recursos em geral.

Activity

Uma Activity é uma classe definida por você que herda da classe Activity, ou se alguma de suas sub-classes. E representa as telas da nossa aplicação. Dentro de uma Activity, os métodos mais comuns a ser utilizados são:

onCreate():
- método a ser chamado quando a Activity é inicializada. Configurações inicias devem ser colocadas nesse método.
onPause():
- método a ser chamado quando o usuário sai da sua Activity. Mudanças feitas pelo usuário devem ser salvas nesse método.

Dentro do método onCreate() é onde definimos o layout da activity, através de um método chamado setContentView(R.layout.nome_do_layout).

Basicamente todas as telas em uma aplicação Android são Activities. Por exemplo, as telas de Contato, Localizações, Imagens, Configurações, etc. Todas são Activities de suas respectivas aplicações.

Abaixo, o código base de uma Activity.

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_nova);
        
        //Código aqui será executado quando a activity for criada.
    }
}

Para que possamos observar a ocorrência dos métodos onCreate() e onPause() vamos introduzir um novo conceito muito utilizado na programação para Android que é o Toast.

Toasts

Toasts são formas simples de exibir informações na tela. Para criar um Toast, precisamos passar ao método makeText*() 3 parâmetros:

Contexto em que o toast será criado, geralmente this.
Texto que será exibido. Uma String.
Duração. Toast.LENGTH_SHORT ou Toast.LENGTH_LONG.

Para criar um Toast, deve ser utilizado o código abaixo:

Toast t = Toast.makeText(this, "Exiba esse texto na tela", Toast.LENGTH_SHORT);
t.show();

Utilizaremos os Toasts para testar nossas aplicações durante todo o curso.

Exemplo 1

Como exemplo inicial, iremos implementar os métodos onCreate() e onPause() dentro da nossa Activity e utilizar um Toast dentro de cada um dos métodos para verificar quando eles são chamados.

Dentro da nossa Activity, teremos:

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Toast.makeText(this, "Activity foi criada", Toast.LENGTH_SHORT).show();
    }

    @Override
    protected void onPause() {
        super.onPause();

        Toast.makeText(this, "Activity foi pausada", Toast.LENGTH_SHORT).show();
    }
}

Com isso, ao rodar o projeto, ao entrar e sair do aplicativo você verá ambas mensagens sendo exibidas na forma de Toasts.

Ciclo de vida de uma Activity

Ambos os métodos onCreate() e onPause() exemplificados acima fazem parte de algo bem maior denominado Activity Lifecycle, ou, Ciclo de vida de uma Activity. Dentro do ciclo de vida há diversos outros métodos fora os dois citados acima.

Não iremos abordar neste momento do curso o ciclo de vida de uma activity de modo aprofundado, entratanto, para fins de exemplificação, segue abaixo uma imagem representativa do ciclo completo da vida de uma Activity, bem como os métodos que são chamados em cada etapa:

Views

Views são objetos de interface com o usuário (UI), como botões e caixas de texto e componentes gráficos.

Todos as views herdam da classe pai View, portanto, para criar sua própria View personalizada, você deve herdar sua classe da classe View ou de uma de suas sub-classes.

As 3 principais Views que usaremos estão exemplificadas abaixo, bem como seus códigos XML para implementação.

TextView

TextView são elementos para exibição de texto.

No XML:

<TextView
      android:id="@+id/meuTextViewId"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="Texto" />

No código:

TextView texto = (TextView) findViewById(R.id.meuTextViewId);

//Pegar o texto
String t = texto.getText().toString();

//Modificar o texto
texto.setText("Novo Texto");

EditText

EditText são elementos para edição de texto

No XML:

<EditText
      android:id="@+id/meuEditTextId"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Digite aqui" />

No código:

EditText edit = (EditText) findViewById(R.id.meuTextViewId);

//Pegar o texto
String text = edit.getText().toString();

Button

Button são elementos de botões

No XML:

<Button
      android:id="@+id/meuButtonId"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="Faça algo"
      android:onClick="nomeDoMetodo" />

No código:

//Implementar o método definido no atributo onClick.
//Recebe como parâmetro a View que foi clicada, no caso, nosso botão.

public void nomeDoMetodo(View v) {
    //Fazer algo quando o botão for clicado.
}

Gerenciadores de Layout

Gerenciadores de layout são views cuja função é gerenciar a forma como outras views serão exibidas na tela. Gerenciadores de layout também são Views pois herdam de View, e os tipos mais comuns são o LinearLayout, RelativeLayout, ListView e GridView.

Segue um vídeo abaixo exemplificando outros tipos de Gerenciadores de Layout:

LinearLayout

LinearLayout dispõe as informações de forma linear, vertical ou horizontalmente.

Exemplo de LinearLayout vertical com 3 componentes:

<LinearLayout 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" 
    tools:context=".MainActivity"
    android:orientation="vertical">
    
    <EditText
        android:id="@+id/editT1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <TextView
        android:text="Digite um número: "
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <Button
        android:text="Somar"
        android:id="@+id/somar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="Somar"/>
    
</LinearLayout>

RelativeLayout

RelativeLayout dispõe as informações relativamente entre seus componentes.

Exemplo de RelativeLayout com 3 componentes:

<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" 
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/editT1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="43dp"
        android:layout_below="@+id/textView"
        android:layout_toStartOf="@+id/somar"
        android:layout_toLeftOf="@+id/somar"
        android:layout_alignRight="@+id/somar"
        android:layout_alignEnd="@+id/somar" />
    <TextView
        android:text="Digite um número: "
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="38dp" />
    <Button
        android:text="Somar"
        android:id="@+id/somar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="Somar"
        android:layout_below="@+id/editT1"
        android:layout_alignRight="@+id/textView"
        android:layout_alignEnd="@+id/textView" />

</RelativeLayout>

Atributos Comuns de Layouts

layout_width
- Largura do componente
layout_height
- Altura do componente
OBS: Altura e largura podem ser definidos em dp, exemplo: "120dp", ou em atributos pré-definidos:
- wrap_content: toma o espaço apenas do seu conteúdo, pode ser lido como `conteúdo em volta'.
- match_parent: toma todo o espaço disponível para si, pode ser lido como igualar ao parente.
id
- O id que será utilizado para recuperar a View no código através do método findViewById(R.id.meuId);
text
- O texto que aparecerá no componente

Exemplo 2

No exemplo 2 do nosso curso. Vamos fazer um simples aplicativo que exibe um Toast e muda o texto e a cor do texto no clique do botão.

Para tanto, ao criar o novo projeto, vamos definir nosso LinearLayout base:

<LinearLayout 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" 
    tools:context=".MainActivity"
    android:orientation="vertical">
    
    <Button
        android:text="Exibir mensagem"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    
</LinearLayout>

Com isso, temos nosso botão dentro do LinearLayout, entretanto, precisamos que algo aconteça quando o botão for clicado. Para isso, adicionamos ao nosso Button a propriedade android:onClick="nomeDeUmMetodo".

Portanto, nosso Button ficou assim:

<Button
    android:text="Exibir mensagem"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="exibirMensagem">

Com isso, agora em nosso código, podemos definir um método exibirMensagem() que será chamado quando esse botão for clicado.

Em nossa Activity:

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    
    public void exibirMensagem(View botao) {
    
    }
}

Note o parâmetro do tipo View que foi passado para o método. Esse parâmetro representa a View que chamou o método, portanto, dentro de botao temos a referência para o botão que foi clicado, e com isso podemos modificar todos os seus atributos, como o texto e a cor.

Dentro do método exibirMensagem(View botao) queremos exibir um Toast e modificar o texto e a cor do botão. Lembrando que, para modificarmos os atributos do botão, precisamos converter nossa View para um Button através do cast (Button) igual fizemos com o método findViewById(). Portanto, nosso método ficará assim: ficará assim:

public void exibirMensagem(View botao) {
        Toast t = Toast.makeText(this, "Botão foi clicado, mudando texto e cor", Toast.LENGTH_LONG);
        t.show();

        Button b = (Button) botao;
        int cor = Color.parseColor("#ff4400");
        
        b.setText("Botão mudou de cor");
        b.setTextColor(cor);
    }

Precisamos utilizar o método Color.parseColor(String) pois o argumento do método setTextColor() tem que ser do tipo int, que é o que o método parseColor retorna.

Com isso, ao testar o aplicativo você verá a mágica acontecer.

Projeto 1

Como primeiro projeto para nosso curso, vamos utilizar o que aprendemos para fazer uma calculadora de raiz quadrada. Para tanto, teremos três EditTexts onde o usuário irá digitar os valores de a, b e c. Um Button para o aplicativo resolver a equação e um TextView para exibir as raízes.

Link para o projeto da oficina 2

Link Google Drive

Intents

Intents são intenções de se fazer algo.

Abrir uma nova Activity no método chamado ao clique do botão:

    public void abrirNovaTela(View v) {
        Intent it = new Intent(this, novaActivity.class);
        startActivity(it);
    }

Passando informações por Intents

Para passar informações através de intents, criamos um pacote e colocamos as informações dentro

Criando o pacote e colocando informações dentro

      Bundle pacote = new Bundle();

      String msg = editText.getText().toString();
      pacote.putString("mensagem", msg);

      Intent it = new Intent(this, novaActivity.class);
      it.putExtras(pacote);
      startActivity(it);

Lendo informações do pacote na nova Activity

      Bundle pacote = getIntent().getExtras();

      String msg = pacote.getString("mensagem");

      TextView text = (TextView) findViewById(R.id.textView2);
      text.setText(msg);

Intents Comuns (Extra)

Fazer uma ligação ao clique do botão:

    public void ligarPara(View v) {
        Uri uri = Uri.parse("tel:99350325");
        Intent it = new Intent(Intent.ACTION_CALL, uri);
        startActivity(it);
    }

Criando um alarme:

Intent intent = new Intent(AlarmClock.ACTION_SET_ALARM);
intent.putExtra(AlarmClock.EXTRA_MESSAGE, "Meu Novo Alarme")
intent.putExtra(AlarmClock.EXTRA_HOUR, 7)
intent.putExtra(AlarmClock.EXTRA_MINUTES, 30);
startActivity(intent);

Inserindo um novo contato:

Intent intent = new Intent(Intent.ACTION_INSERT);
intent.setType(Contacts.CONTENT_TYPE);
intent.putExtra(Intents.Insert.NAME, "Gabriel");
intent.putExtra(Intents.Insert.EMAIL, "tibuurcio@gmail.com");
startActivity(intent);

Abrindo uma página da internet:

Uri webpage = Uri.parse("http://tibuurcio.com");
Intent intent = new Intent(Intent.ACTION_VIEW, webpage);
startActivity(intent);

Abrindo as configurações:

Intent intent = new Intent(Intent.ACTION_SETTINGS);
startActivity(intent);

Toast

Toast é uma classe para exibição de informações na tela.

Criando e exibindo um toast:

//Um toast recebe 3 parâmetros, o contexto, o texto a ser exibido, e a duração.
Toast t = Toast.makeText(this, "Exiba esse texto na tela", Toast.LENGTH_SHORT);
t.show();

Drawables

Drawables são elementos que podem ser desenhados, vamos utilizar imagens como drawables, mas também podemos utilizar Bitmaps ou até byte[].

Copiar uma imagem qualquer para a pasta res > Drawables.
Definir um ImageView no XML:

<ImageView
    android:contentDescription="Logo do Arduino Day"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:src="@drawable/nomeDaImagem" />

Ou um ImageButton, que pode ser clicado:

<ImageButton
    android:contentDescription="Logo do Arduino Day"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:src="@drawable/logoadg"
    android:onClick="metodo" />

ListView

ListViews são componentes de exibição de listas.

No XML:

<ListView
      android:id="@+id/meuListView"
      android:layout_width="match_parent"
      android:layout_height="wrap_content" />

Carregando um array de Strings na lista e fazendo a Activity implementar um Listener para exibir qual item foi clicado:

public class MainActivity extends Activity implements ListView.OnItemClickListener {

    ListView list;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        list = (ListView) findViewById(R.id.meuListView);

        //Criando o array e adicionando elementos
        ArrayList<String> meusElementos = new ArrayList<>();
        meusElementos.add("Item 1");
        meusElementos.add("Item 2");
        meusElementos.add("Item 3");

        //Criando o adapter que pega os elementos do array e coloca na lista
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_list_item_1, meusElementos);

        //Dizendo que a nossa lista tem como adapter o objeto criado acima
        list.setAdapter(adapter);
        
        //Aqui informamos que o Listener de clique para nossa lista é nossa própria activity,
        //assim, quando um elemento da lista for clicado, o método onItemClick será chamado
        list.setOnItemClickListener(this);
    }

    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
      
        //Pega o item da lista na posição que clicamos e converte para String
        String item = (String) list.getItemAtPosition(position);

        //Exibe em um Toast a posição e o texto do item clicado
        Toast t = Toast.makeText(this,
                "Position:" + position + " Item Clicado: " + item , Toast.LENGTH_LONG);
        t.show();
    }
}

Styles

Vamos aplicar um style aos botão

Primeiro devemos criar um arquivo xml onde as informações do novo estilo ficarão guardadas.
- Pasta Drawables (botão direito) > new > file > buttons.xml
- Definimos então os atributos para dois estados do botão. Quando ele está pressionado e quando não está.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#000" />
            <stroke android:width="2dp" android:color="#000" />
        </shape>
    </item>
    <item>
        <shape>
            <solid android:color="#FFF" />
            <stroke android:width="2dp" android:color="#000" />
        </shape>
    </item>
</selector>

Depois, basta aplicar o novo estilo ao botão:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Botão"
    android:onClick="doSomething"
    android:background="@drawable/buttons"/>

O arquivo `strings.xml`

No arquivo strings.xml ficam todos os elementos de texto da nossa aplicação, assim, se precisarmos traduzir nosso aplicativo para outras línguas, só precisamos mudar em um único lugar.

Abrir o arquivo dentro da pasta res > values > strings.xml e adicionar novos elementos de texto

<resources>
    <string name="app_name">Oficina1 Android</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    <string name="title_activity_nova">novaActivity</string>
    <string name="meuNovoTexto">Aqui vai o texto que vai aparecer</string>
</resources>

Nos layouts, usar os nomes das strings ao invés de strings hardcoded(no cru)

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/meuNovoTexto" />

tibuurcio/androidtopics.md

Select an option

No results found

Select an option

No results found

Prólogo

Índice

Oficina 1

Oficina 2

Oficina 3

Oficina 4

Oficina 5

Hello World

Conceitos básicos

Estrutura de projetos

Activity

Toasts

Exemplo 1

Ciclo de vida de uma Activity

Views

TextView

EditText

Button

Gerenciadores de Layout

LinearLayout

RelativeLayout

Atributos Comuns de Layouts

Exemplo 2

Projeto 1

Link para o projeto da oficina 2

Intents

Passando informações por Intents

Intents Comuns (Extra)

Toast

Drawables

ListView

Styles

O arquivo `strings.xml`

tibuurcio/androidtopics.md

Prólogo

Índice

Oficina 1

Oficina 2

Oficina 3

Oficina 4

Oficina 5

Hello World

Conceitos básicos

Estrutura de projetos

Activity

Toasts

Exemplo 1

Ciclo de vida de uma Activity

Views

TextView

EditText

Button

Gerenciadores de Layout

LinearLayout

RelativeLayout

Atributos Comuns de Layouts

Exemplo 2

Projeto 1

Link para o projeto da oficina 2

Intents

Passando informações por Intents

Intents Comuns (Extra)

Toast

Drawables

ListView

Styles

O arquivo strings.xml

O arquivo `strings.xml`