Agora vou descrever o código situado no método onClick. Dentro do método eu crio uma variável chamada total que armazena o valor total da compra. Observe que eu tenho quatro estruturas if’s onde cada uma verifica se um determinado item foi marcado, se foi, incrementa o valor do item na variável total. No final é exibido o valor total das compras na tela.
Vamos roda nossa aplicação? O resultado você confere na figura seguinte:
Aplicação simples de compras em execução
121
5.3) Desenvolvendo uma aplicação de cálculo de salário
Agora vamos desenvolver uma nova aplicação que vai consistir em um sistema onde nós vamos digitar o salário de um funcionário permitindo escolher o seu percentual de aumento, que pode ser de 40% , 45% e 50%. Ao final de tudo, o sistema irá mostrar o salário reajustado com o novo aumento.
Para essa aplicação vamos utilizar os seguintes widgets : TextView, EditText, RadioButton e Button.
Bom, vamos lá! Crie um novo projeto Android com os seguintes dados abaixo:
Application Name: Calculo de Salario
Company Domain : app.usuario
Project location : (Fica a sua escolha)
Activity Name: SalarioActivity
Layout Name : activity_salario
Title : Cálculo de Salário
Resource Menu Name : menu_salario
Depois de carregado e criado o projeto modifique o componente TextView situado na tela, de acordo com a tabela abaixo:
TextView
Propriedade
Valor
text
Digite seu salário
Em seguida, adicione os seguintes componentes na sequência:
EditText (Number Decimal)
Propriedade
Valor
text
id
edsalario
layout:width
match_parent
122
TextView
Propriedade
Valor
text
Qual é o seu percentual ?
Seguindo os passos acima ate aqui, a aplicação deve estar de acordo com o dá figura abaixo:
Tela de layout da aplicação Cálculo de salário
Bom, agora vamos adicionar um componente, ou melhor, uma estrutura que será responsável por agrupar as RadioButtons dentro dela, que se chama RadioGroup (Para mais informações veja o Capítulo 4). Clique e arraste o componente abaixo do ultimo widget adicionado. O resultado você confere na figura abaixo:
123
Estrutura RadioGroup inserida
Com o RadioGroup selecionado, modifique as propriedades abaixo:
RadioGroup
Propriedade
Valor
layout:width
match_parent
id
rgopcoes
Observe que o RadioGroup ESTÁ VAZIO. Vamos arrastar para dentro dele três elementos, cada um deles do tipo RadioButton e identificados por um nome. Vamos arrastar o primeiro RadioButton para dentro do componente RadioGroup. Vejamos o resultado :
124
Agora vamos alterar as seguintes propriedades do RadioButton, conforme mostra a tabela :
RadioButton
Propriedade
Valor
text
40%
id
rb40
Agora vamos arrastar mais dois componentes do tipo RadioButton para dentro do RadioGroup, e em seguida modifique as suas propriedades conforme mostra a tabela :
RadioButton
Propriedade
Valor
text
45%
id
rb45
RadioButton
Propriedade
Valor
text
50%
id
rb50
Agora vamos selecionar novamente o componente RadioGroup para alterarmos a seguinte propriedade em seguida :
RadioGroup
Propriedade
Valor
layout:height
wrap_content
125
Vejamos o resultado:
Tela da aplicação em construção
Agora, vamos adicionar uma Button, simplesmente clicando e arrastando o componente na tela. Agora um detalhe, é para colocar esse componente na tela do dispositivo, mas, FORA da área do RadioGroup (e abaixo do mesmo).
Depois de colocar o Button, modifique as propriedades abaixo:
Propriedade
Valor
text
Calcular novo salário
id
btcalcular
layout:width
match_parent
Depois de inserir todos os componentes citados, o layout da aplicação deve ficar de acordo com a figura em seguida:
126
Layout da tela da aplicação
Vamos analisar agora parte de um trecho de código produzido. Como havia falado acima, as RadioButtons precisam ficar dentro de uma estrutura chamada RadioGroup certo ? Vamos ver como isso é estruturado dentro de um código XML, como você confere abaixo:
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/textView2"
android:layout_alignParentLeft="true"
android:id="@+id/rgopcoes">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="40%"
android:id="@+id/rb40" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="45%"
android:id="@+id/rb45" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="50%"
android:id="@+id/rb50" />
</RadioGroup>
127
Observe acima que logo após a definição da estrutura RadioGroup, existe dentro dela as RadioButtons, que serão utilizadas na aplicação.
Agora confira a estrutura XML da tela da aplicação em desenvolvimento:
<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=".SalarioActivity">
<TextView android:text="Digite seu salário"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:ems="10"
android:id="@+id/edsalario"
android:layout_below="@+id/textView"
android:layout_alignParentLeft="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Qual seu percentual ?"
android:id="@+id/textView2"
android:layout_below="@+id/edsalario"
android:layout_alignParentLeft="true" />
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/textView2"
android:layout_alignParentLeft="true"
android:id="@+id/rgopcoes">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="40%"
android:id="@+id/rb40" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="45%"
128
android:id="@+id/rb45" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="50%"
android:id="@+id/rb50" />
</RadioGroup>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Calcular novo salário"
android:id="@+id/btcalcular"
android:layout_below="@+id/rgopcoes"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
No arquivo “SalarioActivity.java” vamos colocar o seguinte código abaixo:
package usuario.app.calculodesalario;
import android.os.Bundle;
import android.app.Activity;
import android.widget.*;
import android.view.*;
import android.app.*;
public class SalarioActivity extends Activity {
RadioGroup rgopcoes;
Button btcalcular;
EditText edsalario;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_salario);
edsalario = (EditText) findViewById(R.id.edsalario);
rgopcoes = (RadioGroup) findViewById(R.id.rgopcoes);
btcalcular = (Button) findViewById(R.id.btcalcular);
btcalcular.setOnClickListener(new View.OnClickListener() {
129
@Override
public void onClick(View arg0) {
double salario = Double.parseDouble
(edsalario.getText().toString());
int op = rgopcoes.getCheckedRadioButtonId();
double novo_salario = 0;
if (op == R.id.rb40)
novo_salario = salario + (salario * 0.4);
else if (op == R.id.rb45)
novo_salario = salario + (salario * 0.45);
else
novo_salario = salario + (salario * 0.5);
AlertDialog.Builder dialogo = new
AlertDialog.Builder(SalarioActivity.this);
dialogo.setTitle("Novo salário");
dialogo.setMessage("Seu novo salário é : R$"
+ String.valueOf(novo_salario));
dialogo.setNeutralButton("OK", null);
dialogo.show();
}
});
}
}
Vamos à explicação de alguns códigos interessantes. Dentro do método onClick, eu realizo o cálculo do novo salário do funcionário. Os primeiros códigos do evento são similares de programas anteriores que já foram devidamente explicados. A linha:
int op = rgopcoes.getCheckedRadioButtonId();
Cria uma variável op e retorna para ela o Id da opção selecionada, ou seja, qual RadioButton foi selecionada.
Agora na condição:
if (op == R.id.rb40)
130
Verifico se a opção de 40% foi selecionada, se foi selecionada, realiza o cálculo do salário com o reajuste de 40%. A mesma explicação e válida para o cálculo dos outros reajustes. Agora vamos executar a nossa aplicação. O resultado você vê na figura seguinte:
Aplicação de cálculo de salário em execução
5.4) Desenvolvendo uma aplicação de lista de contatos
Agora vamos fazer uma nova aplicação em Android que consiste em uma aplicação de lista de contatos. Para essa aplicação iremos utilizar um componente chamado ListView , que seja bastante útil para esse tipo de situação (quando queremos exibir itens). Toda vez que clicarmos (ou melhor “tocarmos”) em um contato na lista, será exibida uma mensagem com o nome do contato selecionado.
Vamos criar agora um novo projeto no Android Studio, conforme os dados em seguida:
131
Application Name: Lista de Contatos
Company Domain : app.usuario
Project location : (Fica a sua escolha)
Activity Name: ListaContatosActivity
Layout Name : activity_lista_contatos
Title : Lista de Contatos
Resource Menu Name : menu_lista_contatos
Após o projeto ser carregado selecione o componente TextView, e em seguida dentro da sua propriedade “text” digite a seguinte frase : “Escolha um contato:”.
Em seguida vamos adicionar o componente ListView (que se encontra na seção “Containers”). Seguindo o que foi se pedido, a tela da aplicação ficará de acordo com a seguinte figura:
Layout da tela da aplicação em desenvolvimento
Agora vamos criar um objeto (String Array) que vai armazenar os contatos que serão exibidos no componente, que iremos chamado de “contatos” (criar no
132
arquivo “strings.xml”). Os contatos que estarão nessa lista são : "Aline","Lucas","Rafael","Gabriela" e "Silvana".
Depois de criar os contatos, selecione o objeto ListView que você adicionou e altere as seguintes propriedades.
ListView
Propriedade
Valor
id
lista_contatos
entries
@array/contatos
Agora vamos visualizar a estrutura XML do arquivo que forma a tela da aplicação acima:
<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=".ListaContatosActivity">
<TextView android:text="Escolha um contato:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/listView"
android:layout_below="@+id/textView"
android:layout_alignParentLeft="true"
android:entries="@array/contatos" />
</RelativeLayout>
Comentários
Postar um comentário