Ejemplos de programación Android

90
GUÍA DE LABORATORIO 2 “Diseño de interfaces de usuario”

description

Ejemplos para android studio.

Transcript of Ejemplos de programación Android

PROGRAMACION WEB CON PHP

GUA DE LABORATORIO 2Diseo de interfaces de usuario

LABORATORIO

Objetivos:

Identificar los componentes que nos proporciona el SDK de Android.

Disear aplicaciones utilizando los controles adecuadamenteEquipos, Materiales, Programas y Recursos:

PC con Sistema Operativo Windows o Linux

Eclipse IDE Android Development Tool para Eclipse

Android SDK

Introduccin:

En la presente sesin se detalla los fundamentos para el diseo de interfaces en Android.Seguridad:

Ubicar maletines y/o mochilas en el gabinete al final de aula de laboratorio.

No ingresar con lquidos ni comida al aula de laboratorio.

Al culminar la sesin de laboratorio, apagar correctamente la computadora y el monitor.

Preparacin:

Durante el desarrollo de los temas de clase se tendrn ejercicios explicativos en cada uno de los puntos, ello le dar a la sesin una interaccin de la teora y la parte prctica, ya que en todo el momento el alumno podr comprobar en su propia PC, todos los tems del manual.

Procedimiento y Resultados:

TextViewRevisar el video: Lab2_TextView

En el paquete del proyecto, creamos un nuevo Activity en blanco:TextViewActivity.java

package cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;public class TextViewActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_text_view);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.text_view, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_text_view.xml

Button

En el paquete del proyecto, creamos un nuevo Activity en blanco:

ButtonActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.widget.Toast;import android.widget.ToggleButton;public class ButtonActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_button);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.button, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

public void grabar(View view){

Toast.makeText(this, "Botn Grabar", 4000).show();

}

public void cambiarEstado(View view){

ToggleButton tb = (ToggleButton)this.findViewById(R.id.toggleButton1);

String seleccionado = tb.getText().toString();

Toast.makeText(this, "Estado: " + seleccionado, 4000).show();

}

public void procesar(View view){

Toast.makeText(this, "Botn Procesar", 4000).show();

}}Modificamos el layout asociado al Activity:

activity_button.xml

ImageView y ScrollViewRevisar el video: Lab2_ImageView_ScrollView

Nota: Agregar una imagen llamada marcaperu.png en la carpeta /drawable/.

En el paquete del proyecto, creamos un nuevo Activity en blanco:ImageActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;public class ImageActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_image);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.image, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_image.xml

EditText

En el paquete del proyecto, creamos un nuevo Activity en blanco:EditTextActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;public class EditTextActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_edit_text);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.edit_text, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}

Modificamos el layout asociado al Activity:

activity_edit_text.xml

AutoCompleteTextViewRevisar el video: Lab2_AutoCompleteTextView

En el paquete del proyecto, creamos un nuevo Activity en blanco:

AutoCompletarActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.text.Editable;import android.text.TextWatcher;import android.util.Log;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.widget.ArrayAdapter;import android.widget.AutoCompleteTextView;public class AutoCompletarActivity extends Activity implements TextWatcher {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_auto_completar);

String zonas[] = { "Parque Nro 1", "Parque Nro 2", "Av. Huarochiri", "Av. Separadora" };

AutoCompleteTextView myAutoComplete = (AutoCompleteTextView) findViewById(R.id.autoCompleteTextView1);

myAutoComplete.addTextChangedListener(this);

myAutoComplete.setAdapter(new ArrayAdapter(this, android.R.layout.simple_dropdown_item_1line, zonas));

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.auto_completar, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

@Override

public void afterTextChanged(Editable arg0) {

// TODO Auto-generated method stub

}

@Override

public void beforeTextChanged(CharSequence s, int start, int count,

int after) {

// TODO Auto-generated method stub

}

@Override

public void onTextChanged(CharSequence s, int start, int before, int count) {

// TODO Auto-generated method stub

}

public void enviar(View v) {

AutoCompleteTextView t = (AutoCompleteTextView) findViewById(R.id.autoCompleteTextView1);

Log.i("==>", t.getText().toString());

}}Modificamos el layout asociado al Activity:

activity_auto_completar.xml

CheckBox y RadioButton

En el paquete del proyecto, creamos un nuevo Activity en blanco:

CheckBoxRadioGroupActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.widget.CheckBox;import android.widget.RadioButton;import android.widget.Toast;public class CheckBoxRadioGroupActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_check_box_radio_group);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.check_box_radio_group, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

public void enviar(View view) {

CheckBox cb1 = (CheckBox) this.findViewById(R.id.checkBox1);

CheckBox cb2 = (CheckBox) this.findViewById(R.id.checkBox2);

CheckBox cb3 = (CheckBox) this.findViewById(R.id.checkBox3);

StringBuffer resultado = new StringBuffer();

if (cb1.isChecked()) {

resultado.append("Ir al teatro \n");

}

if (cb2.isChecked()) {

resultado.append("Ir al cine \n");

}

if (cb3.isChecked()) {

resultado.append("Ir a cenar \n");

}

RadioButton rb1 = (RadioButton) this.findViewById(R.id.radio0);

RadioButton rb2 = (RadioButton) this.findViewById(R.id.radio1);

if (rb1.isChecked()) {

resultado.append("Masculino \n");

} else if (rb2.isChecked()) {

resultado.append("Femenino \n");

}

Toast.makeText(this, resultado.toString(), 5000).show();

}}Modificamos el layout asociado al Activity:

activity_check_box_radio_group.xml

ProgressBar

En el paquete del proyecto, creamos un nuevo Activity en blanco:

ProgressDialogActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.app.ProgressDialog;import android.os.Bundle;import android.os.Handler;import android.view.Menu;import android.view.MenuItem;import android.view.View;public class ProgressDialogActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_progress_dialog);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.progress_dialog, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

ProgressDialog progressBar;

private int progressBarStatus = 0;

private Handler progressBarHandler = new Handler();

public void lanzar1(View view) {

progressBar = new ProgressDialog(view.getContext()); progressBar.setCancelable(true); progressBar.setMessage("Tarea larga..."); progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL); progressBar.setProgress(0); progressBar.setMax(100); progressBar.show();

new Thread(new Runnable() {

public void run() {

while (progressBarStatus < 100) {

progressBarStatus += 10;

// Dormir 1 segundo para mostrar el progreso

try {

Thread.sleep(1000);

} catch (InterruptedException e) {

e.printStackTrace();

}

// Actualizar el progress bar

progressBarHandler.post(new Runnable() {

public void run() {

progressBar.setProgress(progressBarStatus);

}

});

}

// Cuando lleg a 100%

if (progressBarStatus >= 100) {

// Cerrar el progress bar

progressBar.dismiss();

}

}

}).start();

}

public void lanzar2(View view) {

final ProgressDialog ringProgressDialog = ProgressDialog.show(this, "Espere","Descargando archivo...", true);

ringProgressDialog.setCancelable(true);

new Thread(new Runnable() {

@Override

public void run() {

try {

// Escribir aqu la operacin a realizar

Thread.sleep(3000);

} catch (Exception e) {

}

ringProgressDialog.dismiss();

}

}).start();

}}Modificamos el layout asociado al Activity:

activity_progress_dialog.xml

SeekBar

En el paquete del proyecto, creamos un nuevo Activity en blanco:

SeekBarActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.widget.EditText;import android.widget.SeekBar;public class SeekBarActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_seek_bar);

SeekBar sb = (SeekBar) findViewById(R.id.seekBar1);

final EditText et = (EditText) findViewById(R.id.editText1);

sb.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {

@Override

public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {

int valor = progress;

et.setText(valor + " entradas");

}

@Override

public void onStartTrackingTouch(SeekBar seekBar) {

}

@Override

public void onStopTrackingTouch(SeekBar seekBar) {

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.seek_bar, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:activity_seek_bar.xml

ArrayAdapter (I) - SpinnerRevisar el video: Lab2_ArrayAdapter_Spinner

En el paquete del proyecto, creamos un nuevo Activity en blanco:

ArrayAdapterActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.util.Log;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.widget.AdapterView;import android.widget.ArrayAdapter;import android.widget.Spinner;import android.widget.Toast;public class ArrayAdapterActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_array_adapter);

final String[] cursos = new String[] { "Sistemas distribuidos","Gerencia de proyectos", "Simulacin de sistemas" };

ArrayAdapter adaptador = new ArrayAdapter(this,android.R.layout.simple_spinner_item, cursos);

adaptador.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

Spinner combo = (Spinner) findViewById(R.id.desplegable_cursos);

combo.setAdapter(adaptador);

combo.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {

public void onItemSelected(AdapterView parent, android.view.View v, int position, long id) {

Toast.makeText(ArrayAdapterActivity.this, "Seleccionado: " + cursos[position], Toast.LENGTH_LONG).show();

}

public void onNothingSelected(AdapterView parent) {

Toast.makeText(ArrayAdapterActivity.this, "No ha seleccionado",Toast.LENGTH_LONG).show();

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.array_adapter, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

public void enviar (View v){

Spinner s = (Spinner)findViewById(R.id.desplegable_cursos);

Log.i("==>", s.getSelectedItem().toString());

}}Modificamos el layout asociado al Activity:

activity_array_adapter.xml

ArrayAdapter (II) - GridView

ArrayAdapter2Activity.javapackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.widget.AdapterView;import android.widget.ArrayAdapter;import android.widget.GridView;import android.widget.Toast;public class ArrayAdapter2Activity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_array_adapter2);

final String[] datos = new String[9];

datos[0] = "X";

datos[1] = "O";

datos[2] = "O";

datos[3] = "O";

datos[4] = "X";

datos[5] = "X";

datos[6] = "O";

datos[7] = "O";

datos[8] = "X";

ArrayAdapter adaptador = new ArrayAdapter(this, android.R.layout.simple_list_item_1, datos);

GridView grdOpciones = (GridView) findViewById(R.id.grilla_opciones);

grdOpciones.setAdapter(adaptador);

grdOpciones.setOnItemClickListener(

new AdapterView.OnItemClickListener() {

public void onItemClick(AdapterView parent, android.view.View v, int position, long id) {

Toast.makeText(ArrayAdapter2Activity.this, "Seleccionado: "+datos[position], Toast.LENGTH_SHORT).show();

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.array_adapter2, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}activity_array_adapter2.xml

SimpleAdapter ListViewRevisar el video: Lab2_SimpleAdapter_ListView

En el paquete del proyecto, creamos un nuevo Activity en blanco:

SimpleAdapterActivity.javapackage cursoandroid.lab02;import java.util.ArrayList;import java.util.HashMap;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.widget.ListView;import android.widget.SimpleAdapter;public class SimpleAdapterActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_simple_adapter);

String[] from = new String[] { "Time", "Name", "Desc" };

int[] to = new int[] { R.id.hora, R.id.nombre, R.id.desc1 };

ArrayList lista = new ArrayList();

String[] evento1 = { "11:30", "Reunin de coordinacin", "Lugar: Auditorio", "1" };

String[] evento2 = { "12:00", "Almuerzo", "Lugar: Comedor central", "2" };

String[] evento3 = { "14:00", "Tiro al dardo", "Lugar: Oficina", "3" };

lista.add(evento1);

lista.add(evento2);

lista.add(evento3);

ArrayList eventos = new ArrayList();

for (String[] evento : lista) {

HashMap datosEvento = new HashMap();

datosEvento.put("Time", evento[0]);

datosEvento.put("Name", evento[1]);

datosEvento.put("Desc", evento[2]);

datosEvento.put("id", evento[3]);

eventos.add(datosEvento);

}

SimpleAdapter listadoAdapter = new SimpleAdapter(this, eventos, R.layout.simple_adapter_fila, from, to);

ListView lv = (ListView) findViewById(R.id.lista1);

lv.setAdapter(listadoAdapter);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.simple_adapter, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_simple_array.xml

Nota: Agregar un nuevo File llamado simple_adapter_fila.xml en la carpeta /res/layout/.simple_adapter_fila.xml

SimpleCursorAdapter - ListView

En el paquete del proyecto, creamos un nuevo Activity en blanco:SimpleCursorAdapterActivity.javapackage cursoandroid.lab02;import android.app.Activity;import android.database.Cursor;import android.database.MatrixCursor;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.widget.ListView;import android.widget.SimpleCursorAdapter;public class SimpleCursorAdapterActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_simple_cursor_adapter);

// De

String[] columnas = new String[] { "Cdigo", "Nombre", "Continente", "Regin" };

// Hacia

int[] hacia = new int[] { R.id.codigo, R.id.nombre, R.id.continente, R.id.region };

Cursor cursor = traerPaises();

SimpleCursorAdapter dataAdapter = new SimpleCursorAdapter(this,R.layout.simple_cursor_adapter_fila, cursor, columnas, hacia, 0);

ListView listView = (ListView) findViewById(R.id.lista_simple_cursor);

listView.setAdapter(dataAdapter);

}

private Cursor traerPaises() {

MatrixCursor mCursor = new MatrixCursor(new String[] { "_id", "Cdigo", "Nombre", "Continente", "Regin" });

mCursor.addRow(new String[] { "1", "51", "Per", "Amrica", "Sur" });

mCursor.addRow(new String[] { "2", "01", "Estados Unidos", "Amrica", "Norte" });

if (mCursor != null) {

mCursor.moveToFirst();

}

return mCursor;

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.simple_cursor_adapter, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_simple_cursor_adapter.xml

Nota: Agregar un nuevo File llamado simple_cursor_adapter_fila.xml en la carpeta /res/layout/.

simple_cursor_adapter_fila.xml

Adaptador Personalizado

En el paquete del proyecto, creamos un nuevo Activity en blanco:AdaptadorPersonalizadoActivity.xmlpackage cursoandroid.lab02;import android.app.Activity;import android.os.Bundle;import android.util.SparseArray;import android.view.Menu;import android.view.MenuItem;import android.widget.ExpandableListView;public class AdaptadorPersonalizadoActivity extends Activity {

SparseArray grupos = new SparseArray();

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_adaptador_personalizado);

cargarDatos();

ExpandableListView ampliableVista = (ExpandableListView) findViewById(R.id.listaAmpliable);

AmpliableAdapter adapter = new AmpliableAdapter(this, grupos);

ampliableVista.setAdapter(adapter);

}

public void cargarDatos() {

for (int j = 0; j < 5; j++) {

AmpliableGrupo grupo = new AmpliableGrupo("Categora " + j);

for (int i = 0; i < 3; i++) {

grupo.children.add("Sub Categora " + i);

}

grupos.append(j, grupo);

}

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.adaptador_personalizado, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_adaptador_personalizado.xml

Nota: Agregar un nuevo File llamado ampliable_grupo.xml en la carpeta /res/layout/.

ampliable_grupo.xml

Nota: Agregar un nuevo File llamado ampliable_fila.xml en la carpeta /res/layout/.

ampliable_fila.xml

Nota: Agregar una nueva Clase Java llamada AmpliableGrupo.java en el paquete de clases.

AmpliableGrupo.javapackage cursoandroid.lab02;import java.util.ArrayList;import java.util.List;public class AmpliableGrupo {

public String titulo;

public final List children = new ArrayList();

public AmpliableGrupo(String titulo) {

this.titulo = titulo;

}}Nota: Agregar una nueva Clase Java llamada AmpliableAdapter.java en el paquete de clases.

AmpliableAdapter.javapackage cursoandroid.lab02;import android.app.Activity;import android.util.SparseArray;import android.view.LayoutInflater;import android.view.View;import android.view.View.OnClickListener;import android.view.ViewGroup;import android.widget.BaseExpandableListAdapter;import android.widget.CheckedTextView;import android.widget.TextView;import android.widget.Toast;public class AmpliableAdapter extends BaseExpandableListAdapter {

private final SparseArray grupos;

public LayoutInflater inflater;

public Activity activity;

public AmpliableAdapter(Activity act, SparseArray grupos) {

activity = act;

this.grupos = grupos;

inflater = act.getLayoutInflater();

}

@Override

public Object getChild(int groupPosition, int childPosition) {

return grupos.get(groupPosition).children.get(childPosition);

}

@Override

public long getChildId(int groupPosition, int childPosition) {

return 0;

}

@Override

public View getChildView(int groupPosition, final int childPosition,

boolean isLastChild, View convertView, ViewGroup parent) {

final String children = (String) getChild(groupPosition, childPosition);

TextView text = null;

if (convertView == null) {

convertView = inflater.inflate(R.layout.ampliable_grupo, null);

}

text = (TextView) convertView.findViewById(R.id.textView1);

text.setText(children);

convertView.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

Toast.makeText(activity, children, Toast.LENGTH_SHORT).show();

}

});

return convertView;

}

@Override

public int getChildrenCount(int groupPosition) {

return grupos.get(groupPosition).children.size();

}

@Override

public Object getGroup(int groupPosition) {

return grupos.get(groupPosition);

}

@Override

public int getGroupCount() {

return grupos.size();

}

@Override

public void onGroupCollapsed(int groupPosition) {

super.onGroupCollapsed(groupPosition);

}

@Override

public void onGroupExpanded(int groupPosition) {

super.onGroupExpanded(groupPosition);

}

@Override

public long getGroupId(int groupPosition) {

return 0;

}

@Override

public View getGroupView(int groupPosition, boolean isExpanded,

View convertView, ViewGroup parent) {

if (convertView == null) {

convertView = inflater.inflate(R.layout.ampliable_grupo, null);

}

AmpliableGrupo grupo = (AmpliableGrupo) getGroup(groupPosition);

((CheckedTextView) convertView).setText(grupo.titulo);

((CheckedTextView) convertView).setChecked(isExpanded);

return convertView;

}

@Override

public boolean hasStableIds() {

return false;

}

@Override

public boolean isChildSelectable(int groupPosition, int childPosition) {

return false;

}}Ejercicios PropuestosDisear las siguientes pantallas en Android:

Pestaas

En el paquete del proyecto, creamos un nuevo Activity en blanco:TabsActivity.javapackage cursoandroid.lab2;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;import android.widget.TabHost;public class TabsActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_tabs);

TabHost tabs=(TabHost) findViewById(android.R.id.tabhost);

tabs.setup();

TabHost.TabSpec spec=tabs.newTabSpec("pes1");

spec.setContent(R.id.pestania1);

spec.setIndicator("Inicio");

tabs.addTab(spec);

spec=tabs.newTabSpec("pes2");

spec.setContent(R.id.pestania2);

spec.setIndicator("Servicios");

tabs.addTab(spec);

spec=tabs.newTabSpec("pes3");

spec.setContent(R.id.pestania3);

spec.setIndicator("Contacto");

tabs.addTab(spec);

tabs.setCurrentTab(0);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.tabs, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_tabs.xml

ActionBar y EstilosRevisar el video: Lab2_ActionBar_Estilos

En el paquete del proyecto, creamos un nuevo Activity en blanco:

MenuPrincipalActivity.javapackage cursoandroid.lab02;

import android.support.v7.app.ActionBarActivity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.Toast;

public class MenuPrincipalActivity extends ActionBarActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_menu_principal);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.menu_menu_principal, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case android.R.id.home:

Toast.makeText(this, "Seleccionado el cono ", Toast.LENGTH_SHORT).show();

return true;

case R.id.MnuOpc1:

Toast.makeText(this, "Seleccionado la opcin 1: ", Toast.LENGTH_SHORT).show();

return true;

case R.id.MnuOpc2:

Toast.makeText(this, "Seleccionado la opcin 2: ", Toast.LENGTH_SHORT).show();

return true;

case R.id.MnuOpc3:

Toast.makeText(this, "Seleccionado la opcin 3: ", Toast.LENGTH_SHORT).show();

return true;

default:

return super.onOptionsItemSelected(item);

} }

}Modificamos el layout asociado al Activity:activity_menu_principal.xml

Nota: Modificar el archivo /res/menu/menu_menu_principal.xml:Necesitar agregar los archivos de imagen menu1.png, menu2.png y menu3.png. Descargarlos de la pgina www.iconfinder.com.

menu_menu_principal.xml

Nota: Modificar el archivo /res/values/styles.xml:

styles.xml

@style/EstiloActionBar

@style/EstiloActionBar

@color/fondoActionBar

@color/fondoActionBar

Nota: Crear el archivo, si no existe, /res/values/colors.xml con el siguiente contenido:

#ffafc8ff

Men Contextual

En el paquete del proyecto, creamos un nuevo Activity en blanco:

MenuContextualActivity.javapackage cursoandroid.lab2;import android.app.Activity;import android.os.Bundle;import android.view.ContextMenu;import android.view.ContextMenu.ContextMenuInfo;import android.view.Menu;import android.view.MenuInflater;import android.view.MenuItem;import android.view.View;import android.widget.TextView;public class MenuContextualActivity extends Activity {

static TextView lblMensaje;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_menu_contextual);

// Obtenemos las referencias a los controles

lblMensaje = (TextView) findViewById(R.id.LblMensaje);

// Asociamos los mens contextuales a los controles

registerForContextMenu(lblMensaje);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.menu_contextual, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

@Override

public void onCreateContextMenu(ContextMenu menu, View v, ContextMenuInfo menuInfo) {

super.onCreateContextMenu(menu, v, menuInfo);

MenuInflater inflater = getMenuInflater();

inflater.inflate(R.menu.menu_context_item, menu);

}

@Override

public boolean onContextItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.CtxLblOpc1:

lblMensaje.setText("Etiqueta: Opcion 1 pulsada!");

return true;

case R.id.CtxLblOpc2:

lblMensaje.setText("Etiqueta: Opcion 2 pulsada!");

return true;

default:

return super.onContextItemSelected(item);

}

}}Modificamos el layout asociado al Activity:activity_menu_contextual.xml

Nota: Crear el archivo en /res/menu/menu_context_item.xml:menu_context_item.xml

Men Contextual con Lista

En el paquete del proyecto, creamos un nuevo Activity en blanco:

ListaMenuContextualActivity.javapackage cursoandroid.lab2;import android.app.Activity;import android.os.Bundle;import android.view.ContextMenu;import android.view.ContextMenu.ContextMenuInfo;import android.view.Menu;import android.view.MenuInflater;import android.view.MenuItem;import android.view.View;import android.widget.AdapterView;import android.widget.ArrayAdapter;import android.widget.ListView;import android.widget.Toast;public class ListaMenuContextualActivity extends Activity {

static ListView lstLista;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_lista_menu_contextual);

lstLista = (ListView) findViewById(R.id.LstLista);

String[] datos = new String[] { "Elem1", "Elem2", "Elem3", "Elem4","Elem5" };

ArrayAdapter adaptador = new ArrayAdapter(this, android.R.layout.simple_list_item_1, datos);

lstLista.setAdapter(adaptador);

registerForContextMenu(lstLista);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.lista_menu_contextual, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

switch (item.getItemId()) {

case R.id.CtxLstOpc1:

Toast.makeText(this, "Etiqueta: Opcion 1 pulsada!", Toast.LENGTH_LONG).show();

return true;

case R.id.CtxLstOpc2:

Toast.makeText(this, "Etiqueta: Opcion 2 pulsada!", Toast.LENGTH_LONG).show();

return true;

default:

return super.onContextItemSelected(item);

}

}

@Override

public void onCreateContextMenu(ContextMenu menu, View v, ContextMenuInfo menuInfo) {

super.onCreateContextMenu(menu, v, menuInfo);

MenuInflater inflater = getMenuInflater(); AdapterView.AdapterContextMenuInfo info = (AdapterView.AdapterContextMenuInfo)menuInfo; menu.setHeaderTitle(lstLista.getAdapter().getItem(info.position).toString()); inflater.inflate(R.menu.menu_context_lista, menu);

}}Modificamos el layout asociado al Activity:

activity_lista_menu_contextual.xml

Nota: Crear el archivo en /res/menu/menu_context_lista.xml:menu_context_lista.xml

Tabs Action Bar

En el paquete del proyecto, creamos un nuevo Activity en blanco:

TabsActionBarActivity.javapackage cursoandroid.lab2;import android.app.ActionBar;import android.app.Activity;import android.app.Fragment;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;public class TabsActionBarActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_tabs_action_bar);

ActionBar abar = getActionBar();

// Se configura la navegacin a travs de Tabs

abar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

// Ocultar el ttulo del Activity

abar.setDisplayShowTitleEnabled(false);

// Creacin de tabs

ActionBar.Tab tab1 = abar.newTab().setText("Pestaa 1");

ActionBar.Tab tab2 = abar.newTab().setText("Pestaa 2");

//Creamos los fragmentos de cada tab Fragment tab1frag = new Tab1Fragmento(); Fragment tab2frag = new Tab2Fragmento(); //Asociamos los listener a los tabs tab1.setTabListener(new MiTabListener(tab1frag)); tab2.setTabListener(new MiTabListener(tab2frag)); // Agregar los tabs al ActionBar abar.addTab(tab1); abar.addTab(tab2);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.tabs_action_bar, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}}Modificamos el layout asociado al Activity:

activity_tabs_action_bar.xml

Nota: Crear la clase Java en el paquete mod1.lab3:MiTabListener.javapackage cursoandroid.lab2;import android.app.ActionBar.Tab;import android.app.ActionBar.TabListener;import android.app.Fragment;import android.app.FragmentTransaction;import android.util.Log;public class MiTabListener implements TabListener { private Fragment fragment; public MiTabListener(Fragment fg) { this.fragment = fg; } @Override public void onTabReselected(Tab tab, FragmentTransaction ft) { Log.i("ActionBar", tab.getText() + " reseleccionada."); } @Override public void onTabSelected(Tab tab, FragmentTransaction ft) { Log.i("ActionBar", tab.getText() + " seleccionada."); ft.replace(R.id.tabs_contenedor, fragment); } @Override public void onTabUnselected(Tab tab, FragmentTransaction ft) { Log.i("ActionBar", tab.getText() + " deseleccionada."); ft.remove(fragment); }}Nota: Crear la clase Java en el paquete mod1.lab3:Tab1Fragmento.javapackage cursoandroid.lab2;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class Tab1Fragmento extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.tabs_fragmento1, container, false); }}Nota: Crear la clase Java en el paquete mod1.lab3:Tab2Fragmento.javapackage cursoandroid.lab2;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class Tab2Fragmento extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.tabs_fragmento2, container, false); }} Nota: Crear el archivo en /res/layout/tabs_fragmento1.xml:tabs_fragmento1.xml

Nota: Crear el archivo en /res/layout/tabs_fragmento2.xml:tabs_fragmento2.xml

Nota: Modificar el archivo /res/values/styles.xml:styles.xml

@style/EstiloActionBar @style/EstiloTitleText @style/EstiloTabTitleText

#ffffff #00ff00 #0000ff 18sp

Services (Tareas en Background)

Nota: Crear la clase Java en el paquete mod1.lab3:

MostrarHoraService.javapackage cursoandroid.lab2;import java.util.Calendar;import java.util.GregorianCalendar;import java.util.Timer;import java.util.TimerTask;import android.app.Service;import android.content.Intent;import android.os.Handler;import android.os.IBinder;import android.widget.Toast;public class MostrarHoraService extends Service {

private Timer mTimer = new Timer();

public static final long INTERVALO_SEGUNDOS = 4 * 1000;

// Handler es una clase que crea otro hilo de ejecucin para evitar

// el error can't create handler inside thread that has not called

// looper.prepare()

private Handler mHandler;

public MostrarHoraService() {

mHandler = new Handler();

}

@Override

public IBinder onBind(Intent arg0) {

return null;

}

@Override

public int onStartCommand(Intent intent, int flags, int startId) {

mTimer.scheduleAtFixedRate(new TimeDisplayTimerTask(), 0, INTERVALO_SEGUNDOS);

return START_STICKY;

}

// Inicio de Timer

class TimeDisplayTimerTask extends TimerTask {

@Override

public void run() {

// Crear otro hilo

mHandler.post(new Runnable() {

@Override

public void run() {

GregorianCalendar gc = new GregorianCalendar();

String hora = gc.get(Calendar.HOUR) + ":" + gc.get(Calendar.MINUTE) + ":" + gc.get(Calendar.SECOND);

Toast.makeText(getBaseContext(), hora, Toast.LENGTH_SHORT).show();

}

});

}

}

@Override

public void onDestroy() {

super.onDestroy();

Toast.makeText(this, "Service Destroyed", Toast.LENGTH_LONG).show();

}}Nota: Agregar al AndroidManifest.xml, dentro de la etiqueta :

...

...

Nota: Agregar al Activity que tiene el Launcher, en el mtodo onCreate()...

startService(new Intent(getBaseContext(), MostrarHoraService.class));

...Widget

Revisar el video: Lab2_Widget

Nota: Crear una clase Java en el paquete del proyecto:SaludoWidget.javapackage cursoandroid.lab02;

import android.appwidget.AppWidgetManager;

import android.appwidget.AppWidgetProvider;

import android.content.ComponentName;

import android.content.Context;

import android.util.Log;

import android.widget.RemoteViews;

public class SaludoWidget extends AppWidgetProvider {

@Override

public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {

Log.i("====>", "En onUpdate()");

ComponentName thisWidget = new ComponentName(context, SaludoWidget.class);

int[] widgetId = appWidgetManager.getAppWidgetIds(thisWidget);

RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_saludo);

remoteViews.setTextViewText(R.id.txtMensaje, "Bienvenido jugador");

appWidgetManager.updateAppWidget(widgetId, remoteViews);

}

}

Nota: Crear el archivo en /res/layout/widget_saludo. Tambin, buscar y descargar un archivo de imagen y guardarlo en /res/drawable/jugador.png.

widget_saludo.xml

Nota: Crear el archivo en la carpeta /res/xml/:

menu_widget_saludo.xml

Nota: Agregar al AndroidManifest.xml, dentro de la etiqueta :

Conclusiones:

En la presente sesin, se detall el diseo de interfaces en Android junto con sus componentes ms importantes de la tecnologa.