<TextView android:text="@string/orcamento" />
<EditText
75
3.3. TableLayout
Casa do Código
android:id="@+id/orcamento"
android:inputType="numberDecimal" />
<TableRow>
<TextView
android:layout_width="wrap_content"
android:text="@string/quantidade_de_pessoas"
/>
<EditText
android:id="@+id/quantidadePessoas"
android:inputType="number" />
</TableRow>
<Button
android:onClick="salvarViagem"
android:text="@string/salvar" />
Com o layout pronto, crie uma nova atividade chamada ViagemActivity
e para abri-la precisamos adicionar a implementação correta do método
selecionarOpcao da
DashboardActivity.
O código deste método será
assim:
1 public void selecionarOpcao(View view) {
2
switch (view.getId()) {
3
case R.id.nova_viagem:
4
startActivity(new Intent(this, ViagemActivity.class));
5
break;
6
}
7 }
Quando um item for selecionado, este método será chamado recebendo como
parâmetro a View que foi clicada. Utilizando o id da View saberemos qual item foi selecionado e então executaremos a ação desejada. Ao executar a aplicação novamente e selecionar o item Nova Viagem teremos como resultado uma tela semelhante à seguinte:
76
Casa do Código
Capítulo 3. Domine os principais elementos de Interface Gráfica
Figura 3.5: Tela de cadastro de uma nova viagem
3.4
DatePicker
O DatePicker é um widget projetado para a seleção de datas que pode ser utilizado tanto de maneira direta, incluindo-o diretamente no layout, como indireta, através de uma caixa de diálogo ( DatePickerDialog) apresentada para o usuário.
Apesar de ser mais simples, a utilização direta do DatePicker não é comum,
uma vez que o widget tem proporções exageradas, ocupando um espaço considerável na tela. Sua forma de uso mais comum é através do DatePickerDialog.
Para exemplificar o seu uso e também dar prosseguimento à implementação da
nossa aplicação, vamos desenvolver o layout e a atividade referentes ao registro de um novo gasto, de acordo com o protótipo da tela de cadastro dos gastos, como na figura 3.6.
77
3.4. DatePicker
Casa do Código
Figura 3.6: Telas de cadastro de viagem e de gasto
O arquivo XML de layout será o gasto.xml e a classe da atividade será a
GastoActivity. O layout desta tela utiliza elementos que já conhecemos e é formado por um LinearLayout e um TableLayout, inseridos dentro de uma
ScrollView, que vamos implementar aos poucos.
Primeiro podemos fazer a parte superior da tela, com um banner escrito Novo Gasto e o nome do destino, para representar seu título. Para isto utilizaremos um LinearLayout aplicando uma cor diferente, com o atributo background, e incluiremos dois TextViews para as informações textuais:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
78
Casa do Código
Capítulo 3. Domine os principais elementos de Interface Gráfica
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#015488"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/novo_gasto"
android:textAppearance=
"?android:attr/textAppearanceLarge"
android:textStyle="bold" />
<TextView
android:id="@+id/destino"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAppearance=
"?android:attr/textAppearanceLarge"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</ScrollView>
Em seguida, vamos fazer um TableLayout com duas linhas e duas colunas.
Em cada coluna ficará um campo, no caso, na esquerda ficará o valor, e na direita, a data. Na linha de cima ficará a descrição e na linha inferior ficará o próprio campo.
O campo para a data conterá apenas um botão, que ao ser clicado, irá disparar o método selecionarData da atividade que abre a caixa
de diálogo para a seleção da data de realização do gasto.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView ...>
79
3.4. DatePicker
Casa do Código
<LinearLayout ...>
<!-- Parte superior da tela -->
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="0,1">
<TableRow>
<TextView android:text="@string/valor" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/data" />
</TableRow>
<TableRow>
<EditText
android:id="@+id/valor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="numberDecimal" />
<Button
android:id="@+id/data"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:onClick="selecionarData"