Android - Menu

Hoy vamos a ver como crear un menu; es decir que cuando apretemos la tecla de menu en nuestro terminal nos salga el ya famoso menu abajo con las distintas opciones que le demos, para hacer esto es muy sencillo con eclipse.
Vamos a crear una aplicacion de ejemplo para este proposito; la llamaremos MenuEjemplo, una vez la tengamos creada se nosabrira el activity_main.xml, lo dejaremos como esta, y abriremos la carpera res alli iremos hasta menu y sorpresa nos encontramos un main.xml, en este ejemplo vamos a aprobecharlo, aunque si queremos hacer uno de 0 deberiamos hacer click derecho añadir android xml y seleccionar que sea del tipo menu

si hacemos doble click sobre main.xml se nos abrira algo como lo que sigue

marcaremos el unico elemento que contiene este menu para eliminarlo y asi dejarlo de 0, dando al boton de Remove

Ahora le daremos a Add y en la ventana que se nos abre seleccionaremos Item

en el menu del item que nos sale al lado le daremos un Id, en este caso vamos a dejar que nos da por defecto @+id\item1 y en Title escribiremos el texto que queremos nos salga en pantalla en este caso Boton de Mernu 1

Y repetimos la misma operacion otra vez

Ahora nos iremos a nuestro mainActivity.java, en el podemos ver que tenemos sobreescrito un metodo onCreateOptionsMenu, es aqui donde debemos programar lo que desemos acerca del menu, con la linea en la que nos pone
getMenuInflater()inflate(R.menu.main, menu);

nos esta vinculando esta activity con el menu que acabamos de editar

ahora sobreescribiremos el siguiente metodo on OptionsItemSelected, borrando el codigo de super de su interior, y escribiendo lo siguiente

    @Override public boolean onOptionsItemSelected(MenuItem item) {

             switch (item.getItemId()) {

             case R.id.item1:

                    Toast toas= Toast.makeText(getApplicationContext(), "Boton de menu numero 1", Toast.LENGTH_LONG);

                    toas.show();

                    break;

             case R.id.item2:

                    Toast toas2= Toast.makeText(getApplicationContext(), "Boton de menu numero 2", Toast.LENGTH_LONG);

                    toas2.show();

                    break;

             }

             }

             return true; 

    }

En el que simplemente creamos un Switch y segun que boton pulsemos mostramos un mensaje emergente u otro.

el codigo esta disponible en : http://adf.ly/Ls07f 

Android - mostrar mensaje emergente

Esto suena a algo muy basico, y en realidad lo es, aunque como todo, hay que conocerlo; aqui os dejo hoy el codigo para mostrar un mensaje emergente en nuestras aplicaciones android, podemos ponerlo para que se ejecute al pulsar un boton, al ocurrir un error o cuando nosotros elijamos

Toast toast = Toast.makeText(getApplicationContext(), "texto del mensaje", Toast.LENGTH_LONG);            toast.show();

poco que decir aqui, simplemente lo declaramos, le pasamos el String con el texto y el tiempo de duraccion, para en la linea siguiente lanzarlo

Android - Pasar datos desde una Activity a otra

Apollandonos en el ejemplo de ayer hoy simplemente he copiado el proyecto, le he cambiado el nombre mediante refactor, solucionado algunos errores que daba por referencias al antiguo nombre y editado un pelin las vistas; si os parece mas sencillo podeis crearos un nuevo proyecto para probar esto, o nuevas vistas y usarlas como vamos a ver, yo queria dejar esto en un proyecto aparte para que os podais descargar el codigo desde Git como viene siendo habitual y no dependais del otro proyecto, ni tengais que andar buscando un fragmento de codigo por todo el proyecto.

Bueno manos a la obra, como os he dicho he editado las vistas, en el caso de activity_main.xml he dejado solamente un boton enorme.
En su clase MainActivity.java he eliminado todo lo que hicimos ayer, y en la funcion de lanzar2ventana he dejado el siguiente codigo

    public void lanzar2ventana(View v) {
        Intent inten = new Intent(this, ventana2.class);
        inten.putExtra("usuario", "Ramon");
        inten.putExtra("edad", 25);
        startActivity(inten);
    }

En donde tan solo nos llaman la atencion estas lineas
        inten.putExtra("usuario", "Ramon");
        inten.putExtra("edad", 25);
dentro de la funcion la primera linea como ya sabemos declara una intencion, y en estas lineas añadimos un par de "extra" a esa intencion, esto debe hacerse por parejas, es decir ("nombre o referencia por lo que lo vamos a buscar" , "dato")
como vemos arriba pasamos un String y tambien un int; despues lanzamos la intencion

Por otro lado en ventana2.xml he creado 2 label uno con un texto fijo que pone nombre y otro que pone edad, debajo de cada uno tengo 1 EditText para cada dato

En ventana2.java este codigo:
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.ventana2);
       
        Bundle extras = getIntent().getExtras();
        String nombre = extras.getString("usuario");
        int edad = extras.getInt("edad");
   
        EditText textNombre = (EditText) findViewById(R.id.TxtNombre);
        EditText textEdad = (EditText) findViewById(R.id.txtEdad);
       
        textNombre.setText(nombre);
        textEdad.setText(Integer.toString(edad));
    }

En el cual dentro de la funcion onCreate (fuera no funcionara) declaramos un Bundle al que le asignamos los valores de los extras que le hemos pasado desde el otro Activity, despues declaramos una variable del tipo String y mediante extras.getString("nombre del parametro que queremos recuperar") recuperamos el nombre del usuario; y hacemos lo propio con la edad, pero esta vez recuperandolo como un int.

Declaramos los 2 EditText (ya veis que funciona igual que con los botones)
y finalmente les asignamos los valores recuperados, a la edad le hacemos casting, ya que a un EditText no se le puede asignar un int debe ser un texto

En este punto ya podemos lanzar el proyecto y verlo funcionando ;)
Puedes descargarte todo el codigo o verlo desde aqui http://adf.ly/LkOgw

Java/Android - hacer cast a int

Es algo obvio pero en ocasiones se puede olvidar y hoy a sido mi caso.
Normalmente cuando programamos en Java, ya sea para Android, web, o aplicaciones de escritorio, estamos acostumbrados a hacer casting de la siguiente manera
(Tipo al que queremos converitr) variable o dato que queremos convertir; un ejemplo de esto seria

int numero= (int) "26";

El problema esta justo en el caso contrario, si queremos convertir un entero a un String por ejemplo para mostrarlo en un EditText, ya que (String) 26 pasara bastante de nosotros, y es que a los tipo primitivos como son char, int, creo que boolean y no se si me dejo alguno mas no se les puede hacer casting de esta manera, para el caso de un int debemos recurrir a Integer, y la conversion seria de la siguiente manera:

Integer.toString(26)

Pudiendo hacer con ello lo que queramos ya como String

Espero os sea util y os quite muchos quebraderos de cabeza ;)

Android - Lanzar ventanas por codigo

Hoy veremos como lanzar una Activity por codigo, si lo se es lo mismo que hicimos ayer, pero por codigo?? con lo sencillo rapido y facil que lo hicimos ayudandonos del diseño; esto tiene una razon de ser y es que en versiones anteriores a la 1.6 de Android no existe el evento onClick tal y como lo conocemos, que aunque no creo que desarrollemos muchas aplicaciones pensando en esa version , es bueno conocerlo por si acaso, ademas abra a quien se le halla pasado por la cabeza en lugar de usar el metodo onClick usar el onLongClick que es el que sucede cuando pulsamos durante mas de un segundo, si la memoria no me falla, para este evento y otros muchos no disponemos de interfac, aunque se puede hacer siempre igual y es aqui donde toma cabida esta entrada.

En primer lugar vamos a crear otra vista y otra activity para la nueva vista, la declararemos en el AndroidManifest.xml; todo esto como ya hemos visto en la entrada de ayer, a ver si os acordais ;)
abrir ventanas/activity aqui os dejo el enlace de apollo.

partiendo de que ya tenemos creada la vista, con un texto que distinga a las anteriores, la Activity de esa vista, con el metodo onCreate sobreescrito (override) y asignado a la vista todo ello declarado en el manifest, y un segundo boton en activity_mail.xml el cual ahora programaremos que cuando pulsemos nos lleve a la nueva vista, recordar que esto ya lo vimos ;)

DesdeMainActivity.java declararemos un boton, justo debajo de la declaracion de la clase, quedando algo asi:

public class Asteroides extends Activity {
private Button BtnTerceraVentana;

Esto funciona de manera similar a cualquier otra variable, ahora mismo no hace nada es solo un objeto de un boton pero sin nada asociado, sin funcionalidad alguna.
En el OnCreate le asignaremos el boton que nos interesa en cuestion
BtnTerceraVentana =(Button) findViewById(R.id.Button02);

BtnTerceraVentana.setOnClickListener(new OnClickListener() {

      public void onClick(View view) {

           lanzarVentanaPorCodigo(null);

      }

});

En la primera linea a nuestro boton le asignamos el boton de la vista
En la segunda le damos funcionalidad al evento OnClick, asignandole un "escuchador", esto nos genera la tercera linea, que tan solo es el evento Onclick (casi nada) dentro de los corchetes deberemos escribir lo que queramos que haga, en la entrada anterior vimos como lanzar un activity, te ves capaz de hacerlo solo??

Puedes declarar una funcion, la cual debe declarar un Intent, que llame a la nueva vista y lanzar su activity; o hacer esto mismo directamente en el evento onClick, para gustos los colores, ya ves que en el ejemplo yo llamo a una funcion
Todo el codigo en : http://adf.ly/Ld3kj

Android - abrir ventanas/Activity

En este pequeño tutorial intentare explicar como desde una ventana/ pantalla/ o como se les llama en android Activity, abrir otra.

Lo primero que debemos hacer es crearun proyecto en android, nos servira el de Hola mundo que habiamos creado en un tutorial pasado, si no lo as visto te recomuendo pasar por el tu primer proyecto en android despues meteremos un texto para saber en que ventana estamos y un boton que sera el encargado de enviarnos a la siguiente ventana; esto deberiamos poderlo hacer simplemente arrastrando los elementos desde la paleta a nuestro Activity, aunque tambien podemos hacerlo editando el XML; deberia queda algo como la imagen de abajo.

Despues deberemos dirigirnos a la carpeta res/layout de nuestro proyecto y hacer un click derecho para ir a new>Android XML File en caso de que no nos aparezca hay podemos ir a other y dentro de la carpeta Android seleccionarlo.

se nos abrira una ventana parecida a la de mas abajo en la que debemos escribir el nombre que tendra la nueva ventana, recuerda que debe empezar por una letra y no puede contener mayusculas despues de esto podemos configurar algun detalle en next o darle a Finish.

Editaremos la vista de esta nueva Activity añadiendo un texto que la diferencia de la anterior, como podemos ver en la imagen de abajo.

Bueno, parece que ya tenemos todo echo no?? pues queda lo mas importante decirle donde y como abrirlo, para ello debemos crear la actividad (activity) que va a ser la encargada de lanzar esta vista; para ello iremos a la carpeta src/(el directorio de carpetas que hallamos declarado al inicio) y alli hacer click derecho> new >Class se nos abrira una ventana en la que debemos dar el nombre de la actividad, lo suyo es que tenga el mismo nombre que la vista (me parece haber leido en algun sitio que si no da errores), asi que tendremos un archivo con el mismo nombre de nuestra vista terminado en .java con un contenido similar al que sigue:

package org.rogama.lanzar2ventana;

public class ventana2 {

}

Justo al lao del nombre de la clase (ventana2) debemos extender a Activity quedando algo como lo que sigue:

public class ventana2 extends Activity {

Recuerda que si utilizas la ayuda de eclipse, NetBeans o el IDE que mas te agrade este debe añadirete las librerias, si no te tocara a ti añadir las referencias a mano, en este caso debemos importar android.app.Activity
Una vez hecho esto iremos hasta Source>override/Implement Methods... (para los que no esten familiarizados con esto, lo que estamos haciendo es sobreescribir un fragmento de codigo que nuestra Activity ya tiene definido, o bien por erencia o por extensiones)

Marcaremos la casilla onCreate(Bundle)

Y esto nos habra creado un codigo similar al sigueinte:

@Override 
 public void onCreate(Bundle savedInstanceState) {
 //TODO Auto-generated

        super.onCreate(savedInstanceState);

    }

Debajo de super debemos escribir lo siguiente:
setContentView(R.layout.ventana2);

Ahora en nuestro MainActivity.java debemos crear el siguiente metodo
public void lanzar2Ventana(View view){

      Intent inten = new Intent(this, ventana2.class);

            startActivity(inten);

    }

El modo mas sencillo ahora es ir a activity_main.xml, y en las propiedades del boton asocial este metodo al evento onClick, como mostramos en la imagen inferior.

Para finalizar deberemos ir al fichero AndroidManifest.xml y ayudandonos de la interfac grafica que nos tiene preparado Eclipse señalaremos la pestaña de Application y alli en la parte inferior izquierda, donde pone Application Nodes le damos al boton Add.

Seleccionamos Activity en la ventana que se nos abre y damos al boton de Ok, justo a su derecha se nos habilitara un menu donde podemos ingresar algunos parametros, en Name escribiremos el nombre de la ventana precedido por un . en nuestro caso .ventana2 y en label una pequeña descripción

Ya podemos lanzarlo y probarlo
Puedes ver y descargar todo el codigo desde: http://adf.ly/Ld3kj

errores en eclipse

siempre que veamos alguna indicacion extraña en eclipse quiere decir que hay algun tipo de error, este ha sido mi caso hoy, que desde hace unos dias llevo viendo una marca rara en algunos de mis proyectos al abrir eclipse, lo habia asimilado a algun problema en GIT puesto que me habia dado un par de errores a la hora de compartir los proyectos, pero hoy al ejecutar uno de ellos no me dejaba por que habia error, la marca de la que os hablo es la siguiente:

Esa marquita de admiracion roja, al no dejarme ejecutarlo por que habia errores he abierto la consola de errores, para ver que me pedia, y este era el mensaje

Por lo que he ido al proyecto, click derecho sobre el y he llegado a properties, para ver la siguiente pantalla

Podemos ver claramente un aspa roha en Android Dependencies, aunque el android 4.2.2 que es la version para la que estoy desarrolando la aplicacion esta perfecta, por lo que Android no deberia tener mas dependencias, si la desplegamos veremos que es la libreria de la que nos dice el error que no encuentra

 

La marcamos como vemos en la imagen superior y le damos a Remove, es el 2 boton comenzando por abajo a la izquierda

 

Nos deberia quedar algo como la imagen superior, le damos a OK para cerrar y asunto solucionado

Ya hemos quitado el error en el proyecto solucionado, ahora deberiamos hacer lo mismo con los restantes que marquen error, esto me ha ocurrido al compartir mi proyecto en GIT, para hacer esto se copia a otra carpeta, imagino que para hacerlo portable Eclipse intenta copiar todas las dependencias que pueda tener, aunque parace ser que sin demasiado exito

Validación web Internet explorer

Seguramente todos los que alguna vez hemos programado algo para web nos hemos encontrado mil problemas al intentar hacerlo funcionar en todos los navegadores (si sabéis por donde voy, funciona en todos "safari, chrome, firefox..." pero en IE falla), pues bien dejando a un lado de momento las hojas de estilo css, voy a hablaros de un problema que me encontré este mismo viernes, al hacer una aplicación HTML5 con canvas y java Script.
La programo y pruebo en local, pruebo en todos los navegadores de verdad y funciona a la perfección  la pruebo en IE y sorpresa, ni carga, abro la consola de errores y me encuentro con que Internet Explorer 9 me dice que no reconoce addEventListener para los mas novatos en JS (yo me incluyo) Internet explorer hasta su versión 9 no incluía dicho método de JS, pero hacia lo mismo, o por lo menos a su modo con el método attachEvent sabemos lo especialito que es y lo que le gusta ponernos las cosas sencillas por lo que siempre teníamos que hacer un JS para IE y otro para el resto del mundo, o usar JQuery; pero parece que se están dando cuenta de que así no se va a ningún lado y lo están unificando por esta razón a partir de la versión 9 de IE lo han incluido; el caso, Internet explorer me decía que no lo reconocía  mi primera impresión fue, que bien... IE no soporta HTML5 y empece a googlear, había quien daba unos códigos JS que añadían funcionalidad a versiones antiguas de IE, pero que en la versión 9 y posteriores funcionaba HTML5, incluso leí que el W3C dice que IE9 es el que mejor soporta HTML5 con una tabla comparativa con el resto de navegadores.
Lo cual me dejo claro que mi aplicación debía correr en IE9 y empece abusar sobre ese error, aunque sin fortuna, pensé en cambiar el método por el de toda la vida de IE, pero lo usaba principalmente en una librería ajena, que aunque disponía del código abierto, era muy grande como para recorrermela entera y cambiarlo haciéndolo valido en todos los navegadores, pensé que si los fabricantes de la librería decían que eran validos para aplicaciones en HTML5 para todos los navegadores y tenían ejemplos sus ejemplos fallarían al igual que el mio, pero fue así  por lo que si sus aplicaciones funcionaban y la mía fallaba estaba claro que era un problema en mi código, me lo recorrí entero buscando errores, no vi nada del otro mundo, y menos que pudiera originar ese curioso error, ¿¿por que Internet explorer me decía que no reconocía un método que si debe reconocer?? Apunto de desistir pensando que seria algo de configuración de mi ordenador, le pedí a un compañero que lo probara, y os garantizo que no usa nunca el IE por lo que lo tenia por defecto, y también le fallaba a el, así que mi gozo en un pozo era fallo mio en la programación  seguí probando; en la consola de errores de IE (eso que los de Microsoft llaman herramientas de desarrollo, eso mismo que aparece al pulsar F12) vi que te dejan seleccionar distintos modos de compatibilidad, para emular distintos navegadores, probé todos los disponibles, IE9  IE8, IE7, vista de compatibilidad de IE9  pero con todos ellos el mismo error, al cabo de un rato de comerme la cabeza volví a comparar mi código con el de los ejemplos de los fabricantes de la librería, y me di cuenta que justo al lado de donde seleccionas el modo de navegador

en los ejemplos de los fabricantes salia como en la imagen superior, es decir, modo documentos estándares IE9, en mi aplicación, me salia NO ESTÁNDAR así que por fin encontré una diferencia!! el problema tenia que estar hay, cambie esa opción a estándares de IE9 y sorpresa!! mi aplicación empezó a correr, ahora solo tenia que encontrar el modo de que eso me saliera por defecto, algún tipo de configuración debía haber para decirle a IE que cumplía sus estándares  o por lo menos que intentaba cumplirlos, una vez mas revise el código de ejemplo de esta gente, y no encontré nada, al cabo de un rato en la misma herramienta para desarrolladores cerré todos los nodos del código de mi aplicación e hice lo propio con el de la aplicación de ejemplo, vi una pequeña diferencia, ellos tenían una linea mas encima de todo el código de la aplicación la cual yo no tenia la puse y premio!! todo funcionando.

--SOLUCIÓN--

Esa linea es ni mas ni menos que <!DOCTYPE html> al copiar el código de la estructura principal de la web o no se en que momento, debí de eliminarlo accidentalmente  pero gracias a ello se que si no lo pones IE hace cosas raras, mientras que el resto de navegadores se comporta como si si estuviera, creo que no se me volverá a olvidar copiarlo, espero que esto le sirva a alguien que se olvide de escribirlo, o cometa el error de eliminarlo accidentalmente

Dejar una capa siempre visible

En esta ocasión voy a explicar como dejar una capa o un div siempre visible en la web; es decir que al hacer scroll esa capa no se mueva esto puede hacerse para dejar siempre visible nuestro logo, o como en facebook, tuenti y muchas otras paginas, para dejar siempre visible el chat, en fin que los usos son tantos como limites tenga nuestra imaginación.

En la hoja de estilos tan solo deberemos escribir el siguiente código:

    position: fixed;
debiendo tanbién decirle donde queremos que aparezca claro esta, podemos teclear algo como lo siguiente

    left: 0px;
    top:0px;
para que aparezca en la esquina superior izquierda, podemos darle porcentajes, usar PT; al fin y al cabo es solo una etiqueta css mas.

Espero que os sea útil ;)

Ejecuta tu primer Programa Android

Una vez creado tu primer programa android deberemos ir al código,

y desde hay ir al menú Run>Run  allí nos preguntaran que en que plataforma queremos lanzarlo decimos Android aplication y nos saltara un aviso como el siguiente

Le diremos que si para dar paso a la siguiente ventana

seleccionaremos la 2 opción Launch a new Android Virtual Device de allí al botón Manager, y veremos lo siguiente:

Allí iremos a new

Rellenamos el nombre, sin espacios ni caracteres prohibidos, seleccionamos el dispositivo en Device, o cogemos uno genérico con la resolución y el tamaño de pantalla, en Target seleccionamos la versión de android, y es importante cambiar el Internal Storage, ya que el sistema creara un archivo vacío para reservar ese espacio y no quedara disponible en nuestro ordenador

Confirmaremos con Ok y cerraremos todo hasta llegar a

Donde daremos a Refresh para que nos aparezca nuestro terminal, lo seleccionaremos y daremos a Start

Le daremos a Launch, y paciencia, por que esto suele tardar bastante, esta primera vez tiene que crear la memoria del terminar, configurar todo para que el emulador funcione correctamente, compilar la aplicación, y montarla en el terminar, las sucesivas veces, seguirá tardando pero mucho menos

Este sera el resultado final

Tu primer Proyecto en Android

Hace algún tiempo publicamos un vídeo explicativo de nuestros amigos de DesarrolloWeb en el cual detallaban que hay que hacer para instalar todo lo necesario, por supuesto que es lo necesario, y como configurarlo.
Bien, esto sigue siendo valido a día de hoy, pero las cosas han cambiado, y estando detrás una compañía como google era de esperar que se hiciera todo mas fácil, cómodo y rápido, y es lo que os vengo a explicar

Desde http://developer.android.com/sdk/index.html podemos descargar todo lo necesario para trabajar con Android; es decir:

• Eclipse
• El plugin ADT para eclipse (Con esto emularemos un terminal en nuestro ordenador)
• Las librerías de java necesarias para programar

Una vez descargado (unos 400MB) tan solo deberemos descomprimir

Es recomendable antes de empezar ejecutar el SDK Manager.exe el cual se encargara de darnos a elegir que apis queremos descargar e instalar en nuestro eclipse

Yo os recomiendo descargar la ultima disponible, hoy día es la 4.1.2 y la 2.1 que es la mas distribuida en la actualidad, mas adelante veremos que ventajas y desventajas puede tener esto, aunque recordar que siempre podéis volverlo a ejecutar y desinstalar las que hayáis bajado o instalar nuevas, pero bajando solo estas 2 podremos hacer todo, y tardara relativamente poco en descargar e instalar y podremos empezar con nuestro primer android.

Cuando haya terminado, iremos a la carpeta de eclipse y ejecutaremos eclipse.exe empezara a cargar enseguida, recordemos que ejecutar eclipse.exe no te instala nada en tu equipo, eclipse no requiere instalación, así que si no quieres ir cada vez a la carpeta a ejecutarlo puedes crear un acceso directo al escritorio. A media carga nos saltara un dialogo, en el que se nos pide el WorkSpace simplemente es la carpeta en la que guardaremos nuestros proyectos, elegir la ruta que mas os guste, o dejar la que viene por defecto, eclipse creara la carpeta si no existe; después de esto terminara de cargar y tendremos una ventana parecida a esta

en la esquina superior izquierda tenemos el menú File de allí a New y Android Application Project

Se nos abrirá la selección de los detalles de proyecto

En donde deberemos rellenar:

• Applicatiob Name: El nombre de la  aplicación puede ser el que queramos.
• Project Name: Por defecto nos lo rellena con el mismo nombre de la aplicación sin espacios, tiene alguna restricción.
• Package Name: Debemos empezar siempre por com.(lo que sea). después de aquí no hay reglas, tan solo no tener puntos

Después deberemos dar a next para seguir seleccionando otras opciones, aquí vamos a dejar todo según viene por defecto, aunque ya iremos cambiando y jugueteando con distintas opciones; en este momento ya hemos creado nuestro primer proyecto android, y nuestro primer Activity, deberemos ver algo como esto

en caso de que no sea así, recuerda minimizar, o cerrar la ventana que tenias visible.

Por defecto tienes abierta la vista es decir el layout, para ver el codigo y empezar a programar deber ir a src>(paquete que hayas escogido)>MainActivity.Java

Y como supongo que estarás deseando ejecutarlo y verlo corriendo en Android, pásate por el siguiente articulo que explicamos como ejecutarlo y crear un dispositivo virtual ;)

Puedes descargarlo Funcionando desde http://adf.ly/KBRel