Primera aplicación en Android, Hola Mundo!

Crear una aplicación sencilla en Android a manera de introducción con Eclipse.

La Aplicación se llama HelloWorld  que convencionalmente es usada para iniciar el aprendizaje de un lenguaje de programación,  en este caso consistirá en que el usuario introduzca su nombre y el programa le responda después de hacer clic Hola nombre!

Creamos un nuevo Proyecto en Eclipse en la barra de herramientas:  File->New->Other Project despues seleccionamos Android Application Project  como se ve en la siguiente Figura.

A continuación escribimos el nombre de la aplicación que puede ser diferente a la del proyecto, aquí un punto importante es donde definimos la versión del  SDK para la cual vamos a programar - suponiendo que las tienes descargadas-, en este caso he seleccionado Android 2.3.3 y el requerimiento mínimo de Android 2.2

Después configuramos el icono de la aplicación que podemos dejarla por defecto..

y a continuación escribimos el Nombre la Actividad principal ¿Pero y qué es una actividad? Las aplicaciones de Android funcionan principalmente por actividades que es interfaz gráfica de interacción con el usuario y la aplicación, y su respectiva clase en Java.

Después de crear el proyecto se forma la estructura, con las siguientes carpetas:

Carpetas

• src/ Contiene los archivos de código java del proyecto, como de las actividades, y clases auxiliares.
• gen/ Contiene los r.java archivos que son las compilaciones generadas referenciadas a todo el proyecto, no tendrían que ser modificadas.
• Android 2.3.3/ Libreria de Android
• assets/ Contiene todos los recursos usados por la aplicación como HTML, archivos txt, bases de datos, etc 
• bin/ Contiene los archivos construidos por el ADT, archivos como el *.apk (Android Package) que son los binarios de la Aplicacion Android que contiene todas las cosas indispensable para ejecutare en el entorno.
• res/ Contiene todos los ficheros de recursos necesarios para el proyecto: imágenes, vídeos, cadenas de texto, etc

Programando..

Se diseña la actividad principal que es la primera pantalla  de nuestra aplicación, consiste en añadir los controles necesarios en este caso un TextView, Button y EditText todo esto en haciendo clic en Graphical Layout para el diseñador visual.

Se arrastran los controles al formulario.

El código XML que es el diseño reflejado en xml donde se especifican  los atributos de los controles como vemos a continuación:

Nota en este caso no cambiare los ID de los controles como convencionalmente - solo por variar XD- 

Cada etiqueta hace referencia a un elemento en este caso control del  la actividad, dentro los atributos destacamos:

 android:id ID del control  que lo identifica por lo general tiene un prefijo @+id/  que es útil al momento de obtener la referencia en la lógica de programación (*.java), el control TextView por ejemplo el atributo android:text="TextView" contiene el valor de texto que se va mostrar en el control.

Podemos ver atributos comunes como layout que definen las posición y  otros como las dimensiones del control, se puede experimentar en el diseñador visual cambiando sus valores y los efectos que tienen.
En esta parte del diseño no cambie ninguna de sus características ni nombres de los controles, los deje por defecto.

La aplicación estará formara por dos actividades la primera donde introduciremos nuestro nombre y al hacer clic  no muestre la segunda actividad  con TextView que se lea  HOLA Nombre.

Para añadir un asegunda actividad en la barra de herramientas File/New/Other  y en Android seleccionamos  Android Activity 

Verificamos que se añada en el proyecto HelloWorld  y Escribimos el nombre de la Actividad que en este caso es Mensaje, se puede verificar que dentro de la estructura del proyecto se han añadido tanto al actividad y su respectivo archivo en java.

Entrando ya la parte de la  programación,  al crear el proyecto por defecto se crea un archivo java que corresponde  a la actividad principal en este caso se llama 
MainActivity.java  

que inicialmente se muestra asi

package com.example.helloworld;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MenuItem;
import android.support.v4.app.NavUtils;

public class MainActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
    //codigo aosciado al evento OnCreate  
        
        
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }

    
}

Se tiene dos eventos:

 OncreateOptionsMenu: que especifica las opciones del menú en una actividad, en este método puede agregar menú definido en XML pero no sera útil por ahora, así que lo eliminaremos del código.

OnCreate: Se ejecuta cuando se crea la actividad principal este método servirá para escribir el código.

El Método Oncreate con el código que explicaremos paso a paso. -solo se muestra el recorte del método-

@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);   // referencia a la actividad 
        
        //Localizar los controles
      //Obtenemos referencia del EditText en la Actividad        
       final EditText txtNombre = (EditText)findViewById(R.id.editText1);
        
        
        //Obtenemos referencia del Button en la Actividad y declaramos su evento Onclick 
        
        final Button btnHola = (Button)findViewById(R.id.button1);
        btnHola.setOnClickListener(new OnClickListener() {
       
                 
         public void onClick(View v) {
                
            //Creamos el Intent para asociar las clases de las Actividades
              Intent intent = new Intent(MainActivity.this, Mensaje.class);
              
              //Creamos el Bundle para mapear el texto que aloja el control
              Bundle b = new Bundle(); 
              b.putString("NOMBRE", txtNombre.getText().toString());
              
              //Insertamos el Bundle al intent para que este disponible la Activida Mensaje
              intent.putExtras(b);
              
              //Iniciamos la Actividad Mensaje por medio del Intent
                 startActivity(intent);
             }
         });

En el  código anterior, no creo que haya problema para entender  la obtención de los controles de la vista findViewById

En la declaración del evento del button1 OnClick donde se ejecutara la acción principal pero primero debemos entender que es:

Intent: que permite la enlazar  los componentes de la aplicación en este caso entre las actividades.
Bundle: Mapea a cadenas  diferentes tipos en este caso,  del control EditText.

Añadimos el Bundle al Intent esto para que este disponible en la Actividad Mensaje, y se arranca la segunda Actividad.
El diseño de visual de la segunda actividad solo debe añadirse un TextView para que se pueda mostrar el mensaje.

El código java  de la segunda Actividad Mensaje

package com.example.helloworld;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MenuItem;
import android.support.v4.app.NavUtils;
import android.widget.TextView;

public class Mensaje extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_mensaje);
    
    
        // referencia al control de la vista 
        TextView txtMensaje = (TextView)findViewById(R.id.textView1);  
        
       // Mapeo de la cadena por medio del Intent
        Bundle bundle = getIntent().getExtras(); 

        // Establece  la cadena en el control
        txtMensaje.setText("Hola " + bundle.getString("NOMBRE")); 
    
    
    }

   
    
}

Se observa que el código se declara en el evento Oncreate  obtenemos la referencia al TextView de la vista  obtenemos el Bunble por medio del Intent, y seteamos el valor en el textView, esto permitirá que al mostrarse la segunda actividad se lea Hola Nombre 

ok ejecutamos la aplicación haciendo click en Runde la barra de herramientas

a continuación se ejecuta el emulador  y se  espera hasta que se ejecute la aplicación y tendremos una pantalla como esta donde escribimos un nombre en este caso escribí android

después de hacer clic en el Button nos muestra la segunda actividad Mensaje como vemos a continuación:

Mas adelante veremos otros ejemplos.