viernes, 29 de marzo de 2013

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 - recibir respuesta desde Activity

Siguiendo el tema que abrimos ayer, y trabajando sobre la misma aplicacion vamos a abrir una nueva ventana, pasandole unos datos, y que esta al cerrarse nos diga si todo a sido correcto, y nos devuelva otros datos; para ello vamos a ir a nuestra aplicacion y alli abreremos ventana2.java en donde para empezar creamos un boton en ventana2.xml, y le asignamos en la funcion onClick la funcion enviarConRespuesta que ahora declararemos declararemos; fuera del metodo OnCreate nuestros editText, para tenerlos accesibles desde toda la clase

public class ventana2 extends Activity{
    EditText textNombre;
    EditText textEdad;
    .....

una vez hagamos esto declararemos la siguiente funcion

    public void enviarConRespuesta(View view) {
        Intent intent= new Intent(this, abriendoPorCodigo.class);
        intent.putExtra("nombre", textNombre.getText().toString());
        intent.putExtra("edad", textEdad.getText().toString());
        startActivityForResult(intent, 0000);
    }


La cual lo unico que hace es declarar una neuva intencion, en la cual abriremos la vista que esta vinculada a abriendoPorCodigo.java; la pasamos 2 datos "extra", los cuales son los textos que tenemos escritos en los EditText, y el secreto viene en la ultima linea, en la que lanzamos la intencion, pero en modo espera de resultado, y le damos un codigo nuestro, para asi que cuando cierre sepamos que nosotros le habiamos mandado y esperamos datos, ya que desde android, cualquier aplicacion puede lanzar activity incluso de otras aplicaciones; despues sobre escibiremos el metodo onActivityResult el cual es el encargado de esperar la respuesta de la otra activity

    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        if (requestCode == 0000 && resultCode ==RESULT_OK){
            String resultado = data.getExtras().getString("resultado");
           
            Toast toast = Toast.makeText(getApplicationContext(), resultado, Toast.LENGTH_LONG);                    toast.show();
        }
    }

Borramos el codigo que nos mete por defecto eclipse que lo unico que hace es llamar al super(); y en su lugar escribimos un filtro, para que solo actue cuando le llegue el codigo que nosotros hemos definido antes, y que ademas el resultado sea Ok; en ese caso recogemos el "extra" del resultado, o respuesta que nos da la otra activity, y la mostramos en un mensaje emergente.

Por otro lado en abriendoPorCodigo.xml, le borramos el texto al textView que teniamos preparado y en abriendoPorCodigo.java escribimos el siguiente codigo dentro del metodo OnCreate:

        Bundle extras = getIntent().getExtras();
        String nombre = extras.getString("nombre");
        String edad = extras.getString("edad");
       
        TextView label = (TextView) findViewById(R.id.txtVMuestra);
        label.setText("Nombre: " + nombre + ", Edad: " + edad);
       
        String textResultado ="Recibido: " + label.getText();
       
        Intent intent = new Intent();
        intent.putExtra("resultado",textResultado);
        setResult(RESULT_OK, intent);
        //finish();

Donde declaramos un Bundle para rescatar los datos enviados por el activity anterior, y le asignamos al textView esos datos, con una pequeña etiqueta descriptiva delante de cada uno; tambien declaramos una variable a la que le asignamos el texto "recibido" y le añadimos el texto que tnemos en el TextView; para finalizar declaramos una intencion simple, en la que añadimos un extra llamado resultado, y le damos el valor declarado en la variable anterior, le asignamos el resultado en Ok, y lo mandamos junto con la intencion.
Opcionalmente podemos añadir la funcion finish(); que lo que hace es cerrar la activity una vez llega a esa linea, por lo que no llegariamos a verla, tan solo notariamos un pequeño parpadeo en pantalla desde que la intentamos abrir desde el activity anterior hasta que vuelve al mismo; prueba hacerlo funcionar con y sin esa linea ;)

Como de costumbre publico el codigo en GitHub aqui te dejo el enlace: http://adf.ly/LkOgw ;)

jueves, 28 de marzo de 2013

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

miércoles, 27 de marzo de 2013

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 ;)

martes, 26 de marzo de 2013

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

lunes, 25 de marzo de 2013

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

domingo, 24 de marzo de 2013

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

sábado, 23 de marzo de 2013

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 ;)