artículo escrito por Luisinho
Luisinho
17-03-2013
PhoneGap IV: Añadiendo interactividad

Bueno, ya tenemos una aplicación que nos muestra un campo de texto y un botón, ahora vamos a hacer que al pinchar sobre el botón nos ejecute un método.

Para ello, deberemos editar el archivo main_activity.xml y añadir el atributo android:onClick al botón y darle el nombre del método que queremos que se ejecute en tal evento.


<Button

   
android:layout_width="wrap_content"
   
android:layout_height="wrap_content"
   
android:text="@string/button_send"
   
android:onClick="sendMessage"/>

Una vez realizado este pequeño campo, deberemos crear el método sendMessage, el cuál habrá que incluirlo dentro de scr/mainActivity.xml

/** Called when the user clicks the Send button */
public void sendMessage(View view){
   
// Do something in response to button
}

Dicho script invoca una clase que no está accesible ahora mismo y que la deberemos incluir en nuestro script.

import android.view.View;

No te preocupes por esto, ya que Eclipse te la incorpora automáticamente con la combinación de techas Ctrl + Shift + O, ésta y cualqier otra clase que sea necesaria en el código escrito, una gran ayuda, no¿?

Como puedes apreciar, el método deberá ser público, retornará un valor (void) y utilicará un parámetro, que será una vista.

Construir un Intent

Un Intent, representa el "intento de hacer algo" y proporciona un tiempo de ejecución entre dos componentes, como por ejemplo: dos actividades.

Dentro del método sendMessage() vamos a realizar un intento de iniciar una actividad que llamaremos DisplayMessageActivity.

Intent intent = new Intent(this,DisplayMessageActivity.class);

El constructor Intent necesita dos parámetros, el contecto donde se realiza y la acción que se va a realizar, en este caso llamar a la clase DisplayMessageActivity.

Puesto que estamos utilizando Eclipse, éste nos arrojará un error en la línea, porque todavía no hemos creado la vista DisplayMessageActivity, lo haremos en seguida.

Un Intent no sólo permite iniciar una actividad, si no que además nos deja llevar un paquete de datos a la actividad. De esta forma, usando findViewById() podremos recoger el contenido del campo de texto.

Intent intent = new Intent(this,DisplayMessageActivity.class);
EditText editText =(EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent
.putExtra(EXTRA_MESSAGE, message);

Necesitaremos importar android.content.Intent y android.widget.EditText, vuelve a realizar el atajo de teclas y listo ;)

Un Intent puede llevar valores del tipo key-value. El método putExtra() recoge el nombre de la variable del primer parámetro y el contenido del segundo.

Puesto que EXTRA_MESSAGE va a ser utilizado en la aplicación, deberemos declararla al principio de la clase MainActivity, debiendo ser una constante pública:

publicclassMainActivityextendsActivity{
   
publicfinalstaticString EXTRA_MESSAGE ="com.x3mdesign.miprimeraaplicacion.MESSAGE";
   
...
}

Es una buena práctica el usar el prefijo de nombre de tu aplicación para almacenar las variables extras y así no intectactuar con las otras de otras aplicaciones.

Ejecutar la segunda actividad

Para realizar esta operación, usaremos startActivity() y le pasaremos en Intent como parámetro.

/** Called when the user clicks the Send button */
publicvoid sendMessage(View view){
   
Intent intent =newIntent(this,DisplayMessageActivity.class);
   
EditText editText =(EditText) findViewById(R.id.edit_message);
   
String message = editText.getText().toString();
    intent
.putExtra(EXTRA_MESSAGE, message);
    startActivity
(intent);
}

Ahora ya podremos crear nuestra actividad DisplayMessageActivity()

Crear la segunda actividad

  1. Menú New
  2. En la ventana que nos aparecerá, abrimos la pestaña Android y seleccionamos Android Activity, siguiente...
  3. Seleccionamos BlankActivity, siguiente...
  4. Fill in the activity details:
    • Project: Mi primera aplicación
    • Activity Name: DisplayMessageActivity
    • Layout Name: activity_display_message
    • Title: Mi mensaje
    • Hierarchial Parent: com.x3mdesign.miprimeraaplicacion.MainActivity
    • Navigation Type: None
  5. Finish.

Abramos el archivo DisplayMessageActivity.java, y al crearlo con Eclipse, veremos lo siguiente:

  • que está implementado el evento onCreate()
  • también onCreateOptionsMenu(), en esta aplicación no lo vamos a necesitar y lo podemos borrar.
  • la implementación de onOptionsItemSelected() entrará en acción a la hora de seleccionar una opción de la barra de acción.

Puesto que la el API barra de acción está disponible a partir de la versión HoneyComb (API nivel 11), en dicho comportamiento habrá que preguntar en qué versión de Android está corriendo nuestra aplicación.

El archivo deberá ser como este:

publicclassDisplayMessageActivityextendsActivity{

   
@SuppressLint("NewApi")
   
@Override
   
protectedvoid onCreate(Bundle savedInstanceState){
       
super.onCreate(savedInstanceState);
        setContentView
(R.layout.activity_display_message);

       
// Make sure we're running on Honeycomb or higher to use ActionBar APIs
       
if(Build.VERSION.SDK_INT >=Build.VERSION_CODES.HONEYCOMB){
           
// Show the Up button in the action bar.
            getActionBar
().setDisplayHomeAsUpEnabled(true);
       
}
   
}

   
@Override
   
publicboolean onOptionsItemSelected(MenuItem item){
       
switch(item.getItemId()){
       
case android.R.id.home:
           
NavUtils.navigateUpFromSameTask(this);
           
returntrue;
       
}
       
returnsuper.onOptionsItemSelected(item);
   
}
}

Todas las subclases de Activity deberá tener el evento onCreate() que será invocado cada vez que se cree una instancia de dicha subclase. Este método será el que defina el layout de la actividad mediante el método setContentView() y es donde se debe definir la configuración inicial de los componentes de las actividades.

Al usar Eclipse, verás que se ha creado un string, para el título de la actividad, y que en el manifiesto (AndroidManifest.xml) de la aplicación también se ha añadido otra etiqueta con la declaración de la nueva actividad que acabamos de crear.

Ya podríamos probar nuestra aplicación , pero sólo veremos que al pinchar sobre el botón "Send" irá a la actiividad en cuestión y ésta mostrará "Hello world", veamos cómo recoger el Intent...

Recibir el Intent

Cada actividad es invocada por un Intent, sin importar cómo el usuario ha llegado hasta allí. Podremos obtener el Intent y recoger su contenido mediante getInten().

Para ello deberemos llamar a getIntent desde el método onCreate del propio DisplayMessageActivity.

Intent intent = getIntent();
String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);

Mostrar el mensaje

Para mostrar el mensaje, crearemos un widget TextView y mediante setText() establecremos su contenido. Después estableceremos el TextView como vista principal de nuestro layout mediente setContentView().

El método completo onCreate de nuestro DisplayMessageActivity, deberá ser así:

@Override
publicvoid onCreate(Bundle savedInstanceState){
   
super.onCreate(savedInstanceState);

   
// Get the message from the intent
   
Intent intent = getIntent();
   
String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);

   
// Create the text view
   
TextView textView =newTextView(this);
    textView
.setTextSize(40);
    textView
.setText(message);

   
// Set the text view as the activity layout
    setContentView
(textView);
}

Si ejecutamos la aplicación debería ser...

Ya hemos recogido el texto enviado desde la anterior actividad.

Una vez creada nuestra primera aplicación, veremos cuál es su ciclo de vida, la suya y la de sus actividades.

Identifícate en NoEsTanDificil

Área Privada

Anónimo
Regístrate como usuario

Destacados

Bote de bolas de padel / tenis gratis

Buscador

BlogRoll

Galería privada de fotos

Suscripciones

¿quieres recibir un aviso de actualizaciones?

Síguenos en...

Últimos comentarios

 rashp en Instalar apache+php+mysql en Windows y Ubuntu: En algunos casos hay que montar la particion de windows cuan...
 anónimo en Protege a los tuyos de internet: Muchas gracias por la información!!!
 Luisinho en Instalar apache+php+mysql en Windows y Ubuntu: he actualizado el post... parece ser qe ahora, desde la vers...
 ssnc en Curso de Internet para abuelos... NoEsTanDificil¡¡: :O se me hace interesante, quizas tbn nos podrias enseñar d...
 sushimaniberico en Probar buen sake en Palma: Hey! que grata sorpresa. Un millón de gracias por el post. ...
 ssnc en Vaya nevada!!!: u.u Como quisiera yo algo de nieve por aca. Con 30°c no se ...