Aula 06 - Exerccio - modo paisagem

Prévia do material em texto

Exercício 
Crie um conversor de unidades conforme sugestões de layouts abaixo. Você deverá pesquisar as imagens na Internet para criar a tela inicial (ou utilizar as 
fornecidas), para criar botões com o texto e a figura. Cada botão deverá abrir uma tela específica para fazer a conversão, veja os modelos de telas e opções 
abaixo. Cada tela terá um campo de texto para entrar com o valor e um combo com as opções de entrada para conversão posterior. 
Tela Inicial 
Button com o atributo android:drawableTop 
para inserir a imagem no topo. 
Ex: android:drawableTop="@drawable/jar" 
As imagens devem ficar na pasta drawable 
Tela de conversão (tempo) Tela de conversão (Volume) Tela de conversão (Peso) 
Spinner 
Tela de conversão (Área) Tela de conversão (Comprimento) Tela de conversão (Temperatura) 
Os elementos do tipo Spinner devem conter as opções presentes na tabela de cada conversão. O usuário digita o valor a converter, 
escolhe qual a unidade que irá utilizar e seu código deverá fazer as conversões para todas as unidades presentes na tabela e mostrará 
os resultados após os elementos de form (em vários TextView). 
Exemplo de uso do Spinner (spinner é um componente visual de tipo listbox, uma lista de itens) 
 
No arquivo strings.xml insira as opções necessárias para cada tela (o menu de opçoes de cada Spinner). 
 
<resources> 
 <string name="app_name">ExerConversor</string> 
 
 <string-array name="itenstempo"> 
 <item>ms</item> 
 <item>seg</item> 
 <item>min</item> 
 <item>hora</item> 
 <item>dia</item> 
 </string-array> 
 
 <string-array name="itensvolume"> 
 ... 
 </string-array> 
 
 <string-array name="itenspeso"> 
 ... 
 </string-array> 
 ... 
</resources> 
 
Cada tela deverá ter seu próprio array. Então, no arquivo strings.xml tenha cuidado para nomear as listas com atributos name diferentes. 
Na sequência, você deverá criar o Spinner na tela de cada tipo de conversão, associando o array correto com o respectivo spinner. Por exemplo, no layout no 
arquivo .xml da tela do conversor de tempo, o Spinner poderia ser: 
 
<Spinner 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:id="@+id/spinner1" 
 android:layout_alignParentTop="true" 
 android:layout_centerHorizontal="true" 
 android:spinnerMode="dropdown" 
 android:entries="@array/itenstempo" 
/> 
 
Complete o visual de cada tela colocando os TextView e componentes necessários para mostrar as diferentes conversões quando for selecionado um item da 
lista (do Spinner). 
Para utilizar o Spinner, em qualquer uma das telas, no código você deverá capturar a seleção do item da lista e implementar o método 
ItemSelected: 
 
 
// atributos da classe (ou final dentro do método onCreate) 
private Spinner sp; 
private EditText txt; 
 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
 super.onCreate(savedInstanceState); 
 setContentView(R.layout.activity_tempo); 
 sp = (Spinner)findViewById(R.id.spinner); //ou: final Spinner sp = ... 
 sp.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { 
 @Override 
 public void onItemSelected(AdapterView<?> parent, 
 View view, int position, long id) { 
 calcular(sp.getSelectedItem().toString()); 
 //ou: calcular(parent.getItemAtPosition(position).toString()); 
 } 
 @Override 
 public void onNothingSelected(AdapterView<?> parent) { 
 } 
 }); 
 //Se queremos calcular também quando o usuário digite algum caractere (evento de teclado): 
 txt = (EditText)findViewById(R.id.valor); 
 txt.setOnKeyListener(new View.OnKeyListener() { 
 @Override 
 public boolean onKey(View v, int keyCode, KeyEvent event) { 
 calcular(sp.getSelectedItem().toString()); 
 return false; 
 } 
 }); 
} //fim do onCreate 
 
 
Devemos fazer o método calcular as conversões necessárias: avalie o valor passado pelo spinner para realizar a conversão. Por exemplo, o 
método calcular para a tela do conversor de tempo poderia ser: 
public void calcular(String opc){ // método da classe da tela 
 //Toast.makeText(getApplicationContext(), opc,Toast.LENGTH_LONG).show(); 
 float v = 0.0f; 
 try { 
 v = Float.parseFloat( 
 ((EditText)findViewById(R.id.valor)).getText().toString() ); 
 } catch(Exception ex){} 
 float ms = 0.0f, seg = 0.0f, min = 0.0f, hora = 0.0f, dia = 0.0f ; 
 if(opc.equals("ms")) { 
 ms = v; seg = ms/1000; min = seg/60; hora = min/60; dia = hora/24; 
 } 
 if(opc.equals("seg")) { 
 seg = v; ms = seg*1000; min = seg/60; hora = min/60; dia = hora/24; 
 } 
 if(opc.equals("min")) { 
 min = v; seg = min*60; ms = seg*1000; hora = min/60; dia = hora/24; 
 } 
 if(opc.equals("hora")) { 
 hora = v; min = hora*60; seg = min*60; ms = seg*1000; dia = hora/24; 
 } 
 if(opc.equals("dia")) { 
 dia = v; hora = dia*24; min = hora*60; seg = min*60; ms = seg*1000; 
 } 
 TextView tx1 = (TextView)findViewById(R.id.txt1); 
 TextView tx2 = (TextView)findViewById(R.id.txt2); 
 TextView tx3 = (TextView)findViewById(R.id.txt3); 
 TextView tx4 = (TextView)findViewById(R.id.txt4); 
 TextView tx5 = (TextView)findViewById(R.id.txt5); 
 tx1.setText("" + ms); 
 tx2.setText("" + seg); 
 tx3.setText("" + min); 
 tx4.setText("" + hora); 
 tx5.setText("" + dia); 
} 
 
Os métodos onCreate e calcular das outras cinco telas são parecidos, mas, obviamente, podem ter menos ou mais conversões no método calcular e os 
cálculos e resultados apresentados serão diferentes. 
Para criar a tabela da tela inicial com as figuras, você poderá utilizar um TableLayout ou basicamente fazer com um grupo de LinearLayout. Mas poderá usar 
qualquer layout, como ConstraintLayout etc. A seguir uma implementação com LinearLayout. Por exemplo: 
 
<?xml version="1.0" encoding="utf-8"?> 
 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:tools="http://schemas.android.com/tools" 
 android:id="@+id/activity_main" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent" ... 
 android:orientation="vertical"> 
 
 /* esta é a primeira fileira com dois botões */ 
 <LinearLayout 
 android:layout_width="match_parent" 
 android:layout_height="0dp" 
 android:layout_weight="1" 
 android:orientation="horizontal"> 
/* Quando "height" ou "width" tem valor "0dp", é usado normalmente junto com "weight". Por exemplo, se você quiser 
utilizar todo o espaço para a altura: 
android:layout_height = "0dp" 
android:layout_weight = "1" */ 
 <Button 
 android:id="@+id/button1" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_gravity="center_vertical" 
 android:layout_weight="1" 
 android:drawableTop="@drawable/tempo" 
 android:text="Tempo" /> 
 <Button 
 android:id="@+id/button2" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_gravity="center_vertical" 
 android:layout_weight="1" 
 android:drawableTop="@drawable/volume" 
 android:text="Volume" /> 
 </LinearLayout> 
/* Repita o bloco acima para cada linha ou fileira do visual, alterando as informações para apresentar 
os seis botões com figuras da tela inicial.*/ 
</ LinearLayout> 
Outra forma de implementar uma lista de itens com AlertDialog 
Este exemplo se encontra no projeto ListaDeItens. 
 
 
 
No arquivo borders2fundoclarolaranja.xml 
 
<?xml version="1.0" encoding="utf-8"?> 
 <shape xmlns:android="http://schemas.android.com/apk/res/android"> 
 <gradient android:startColor="#DDFFFFFF"android:endColor="#66FFDD96" 
 android:angle="0"/> 
 <stroke android:width="2dp" android:color="#F89D31" /> 
 <corners android:radius="8dp" /> 
 <padding android:left="10dp" android:top="5dp" 
 android:right="10dp" android:bottom="5dp" /> 
</shape> 
 
 
 
No arquivo activity_main.xml 
 
<Button 
 android:id="@+id/btnSelePais" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_marginLeft="60dp" 
 android:layout_marginTop="64dp" 
 android:background="@drawable/borders2fundoclarolaranja" 
 android:onClick="umClick" 
 android:text="Selecione o país " 
 android:textSize="14sp" 
 app:layout_constraintStart_toStartOf="parent" 
 app:layout_constraintTop_toTopOf="parent" /> 
No arquivo AcivityMain.java 
No click do botão dos países podemos colocar esta lógica: 
public void umClick (View v){ 
 final CharSequence[] items = { 
 "Angola", 
 "Argentina", 
 "Brasil", 
 "Canadá", 
 "Chile", 
 "Equador", 
 "Espanha", 
 "Holanda", 
 "Itália", 
 "Rússia", 
 "Venezuela" 
 }; 
 AlertDialog.Builder builder = new AlertDialog.Builder(this); 
 builder.setTitle("Selecione o país..."); 
 builder.setItems(items, new DialogInterface.OnClickListener() { 
 public void onClick(DialogInterface dialog, int item) { 
 //ao clicar em um país, mostramos o país selecionado no botão e também no TextView: 
 ((Button)findViewById(R.id.btnSelePais)).setText("" + items[item] + " »"); 
 ((TextView)findViewById(R.id.lblpais)).setText("" + items[item] + ""); 
 } 
 }); 
 AlertDialog alert = builder.create(); 
 alert.show(); 
}