viernes, 26 de julio de 2013

Android 4.3 en Galaxy Nexus (Instalación Manual)

Algunos de ustedes ya sabrán que hace unos días se realizo el evento "Google Breakfast", así llamaron a la pequeña conferencia nada comparada con google I/O pero donde se anunciaron nuevos productos de Google. La nueva nexus 7 (la cual incluira el nuevo android), Google Chromecast, y por supuesto Android 4.3 aun llamado Jelly Bean. Esta nueva versión de Android es una actualización menor al sistema pero que trae interesantes nuevas características. La primera es OpenGL 3.0, luego mejor rendimiento en Bluetooth, y una nueva API para DRM la cual supuesta-mente permitirá mejor calidad en el vídeo. Se dijo que Netflix sera el primero en utilizar este nuevo código en su aplicación pero esperemos y otras apps como youtube o ulu lo hagan también.

Fue una conferencia interesante, si desean ver un resumen de lo que sucedió pueden visitar el siguiente link. Uno de los mejores anuncios fue que las actualizaciones Android 4.3 por OTA ya han comenzado y Galaxy Nexus es uno de los dispositivos que obtendrán esta actualización. Es bueno saber que Google no nos ha olvidado como usuarios, la desventaja es que en ocasiones esta actualización puede tardar hasta semanas enteras en llegar al dispositivo, dependiendo del carrier. Si son como yo, tal vez el tiempo se les haga eterno así que me di a la tarea de actualizar mi dispositivo manualmente y probar esta nueva actualización. Aqui abajo les dejo los pasos para hacerlo. Lo que necesitaran sera el Android SDK y los drivers para galaxy nexus en su computadora (si es que utilizan windows, si son linux users como yo no es necesario preocuparse por los drivers).
1. Descarguen el archivo de actualización y coloquen lo en la carpeta platform-tools dentro del sdk. Este es el link para descargarlo

2. Apaguen el teléfono e inicien en modo recovery con el dispositivo conectado a la pc.
Para iniciar en modo recovery es necesario presionar las dos teclas de volumen y el botón de encendido al mismo tiempo, una vez que inicie el menu con el android este listo pueden usar volumen arriba o abajo para seleccionar "Recovery Mode" y luego presionar la tecla de encendido.

3. Una vez que aparezca el Android con un símbolo de exclamasión es necesario acceder al menú de recovery, presionen las tecla volumen arriba y encendido varias veces hasta que el menú en azul aparezca. Una vez ahí seleccionen "apply update from adb" utilizando la tecla de endendido.

4. Una vez que el teléfono este esperando la actualización tenemos que ejecutar el siguiente comando en una consola:
adb sideload
Si quieren verificar que el teléfono este listo para recibir la actualización antes de ejecutarla pueden escribir el siguiente comando: 
adb devices
Y debe de mostrar el telefono en modo sideload. Algo parecido a esto:
List of devices attached 
01467D551201000E sideload 

5.0 Una vez que la actualización se haya completado solo seleccionamos "reboot" en el menú para que el teléfono se reinicie y poder utilizar la nueva versión de Android en nuestro Galaxy Nexus.

Por el momento no he notado una gran diferencia entre esta nueva versión y la anterior, en teoría el rendimiento debería ser mejor pero hasta el momento no he podido notar la diferencia. La única diferencia visible es la aplicación de la cámara de fotos, la cual ya cuenta con una nueva interfaz y con la opción de timer para tomar las fotografías, esta era una de las opciones que mas quería en la aplicación.

Una de mis sorpresas es que tenia un problema con mi entrada de audífonos y esta quedo arreglada. En la ultima semana el teléfono detectaba que los audífonos estaban conectados aun cuando no lo estaban y no era posible poder escuchar las llamadas por el auricular como normalmente lo hacia. Inclusive des arme el teléfono y reemplace la pieza por una nueva pero ni aun así ayudo en ese tiempo así que creo que era un problema con el software. Muy bien aquí abajo les dejo unas imágenes de como se ve el sistema y en los siguientes días comentare si encuentro diferencias grandes en cuanto al rendimiento o al sistema.

P.D. si desean realizar esta actualización manualmente o esperar por la actualización manual comenten sus ideas en la sección de abajo.

Update: Si tienen problemas con los drivers o el ejecutar comandos en la consola en teoría debe de ser posible aplicar el update desde la memoria interna del teléfono, yo no lo hice así pero esta es otra opción. Lo único que hay que hacer es colocar el archivo de actualización dentro del teléfono y seleccionar "apply update from sdcard" en el menú de recovery.


miércoles, 10 de julio de 2013

Ejemplo Con Action Drawer

Hoy vamos a realizar un pequeño ejemplo de una aplicación con ActionDrawer. La mayoría de las aplicaciones utilizan este componente en la actualidad para desplegar menús de opciones. En un inicio el menú de opciones por defecto fue reemplazado por el Action Bar al aparecer las Tablets y hoy Google recomienda migrar nuestras aplicaciones a utilizar este diseño para proveer una mejor experiencia al usuario; claro que esto no es estrictamente necesario, podemos desarrollar una app sin utilizar ActionDrawers y no habrá ningún problema.
Si aun no identifican que es ActionDrawer, es la barra deslizable que presenta opciones al usuario en alguno de las puntos finales de la pantalla (generalmente el extremo izquierdo). Google+ nos presenta esta barra con las opciones de fotos, comunidades, etc.

Muy bien manos a la obra, lo primero que aremos es crear un proyecto de Android por defecto. Esto nos debe de crear una actividad principal y un layout para nuestra actividad. Generalmente el nodo raíz de este layout es un LinearLayout o RelativeLayout (o lo que hayamos especificado por defecto), es aquí donde viene el primer cambio. El nodo raíz de  nuestro xml ahora sera un "android.support.v4.widget.DrawerLayout"; esta vista es dibujada de la siguiente manera. El primero nodo hijo sera el contenido que sera desplegado en la pantalla y el segundo nodo debe de ser de tipo "ListView" que sera el que desplegara la lista de opciones. En esta aplicacion de prueba nuestro main_layout.xml se vera de la siguiente manera:



Básicamente lo que este layout describe es DrawerLayout con id "main_act_drawer" como principal; este contiene un primer hijo de tipo FrameLayout con id "content_frame" y un segundo nodo de tipo ListView con id "left_drawer".  Ya habíamos dicho que el primer nodo dentro de DrawerLayout sera lo que se desplegara en pantalla, en este caso FrameLayout lo vamos a utilizar para desplegar un mensaje por defecto (TextView contenido dentro) y cuando el usuario seleccione algo del menú el contenido sera reemplazado por un fragmento definido.
Nota: Es importante resaltar que layout_height & layout_width de la mayoría de las vistas están definidas con constantes, esto bloquea a AndroidStudio de desplegar una vista previa de la pantalla pero al momento de ejecutar la aplicación esta corre sin ningún problema. 

El ListView (left_drawer) lo utilizaremos para desplegar las opciones en nuestro ActionDrawer y por lo tanto necesitamos crear un adaptador que contenga los valores para nuestras opciones. Por lo tanto agregaremos a nuestro archivo strings.xml los siguientes elementos:
El primero es la lista de opciones para nuestro menú el segundo es una lista de colores que definen el valor del color correspondiente en valor hexadecimal. AndroidStudio nos presenta el valor del color en un recuadro en la barra lateral; este es una opción no disponible anteriormente en eclipse ADT y que me parece es un poco cool. 

Ahora escribiremos un poco de código para iniciar correctamente nuestras opciones ya que si no el ActionDrawer no sera desplegado en nuestra aplicación por que no contiene ninguna opción. Así que escribimos el siguiente código en nuestra actividad principal.
En simples palabras una vez que establezcamos el layout de nuestra actividad, llamaremos el método prepareActionDrawer para efectivamente iniciar nuestro menú. Lo primero que hacemos es retraer las vistas de nuestro layout con findViewById. Luego creamos un ArrayAdapter utilizando el arreglo que definimos en strings.xml (main_act_drawer_opts) y lo establecemos a nuestra lista. Luego podemos ver que establecemos un nuevo OnItemClickListener en nuestra lista, esta clase sera la encargada de hacer el  cambio de fragmentos en nuestra vista contenedora así que revisaremos esta clase con mas detalle luego. Al final de nuestro método creamos un nuevo objeto ActionBarDrawerToggle que estará encargado de abrir y cerrar el action drawer cuando demos clic en el icono de nuestra app (parte superior izquierda). Es por esto que nuestra primera linea en el método es setDisplayHomeAsUpEnabled(true) para que este botón aparezca en nuestra barra.

El ultimo código que agregaremos en nuestra actividad principal sera sobrescribir el método onOptionsItemSelected para que nuestro objeto ActionBarDrawerToggle detecte si una de las opciones del menú ha sido seleccionada y el drawer se cierre. El código se ve de la siguiente manera.

La parte final sera crear la clase encargada de manejar el contenido de nuestra aplicación "DrawerClickListener", esta clase sera la encargada de actualizar el fragmento que desplegara el contenido por cada una de las opciones que el usuario seleccione. Para esto necesitamos fragmentos que serán colocados en nuestro "content_frame"; aquí vamos a hacer uso de una vieja clase PlainColorFragment del proyecto anterior view_pager_test (si no recuerdan este proyecto visiten los posts de Ejemplos con View Pager 1,2, 3 ). El codigo de esta clase se ve como se muestra aqui abajo:
En el constructor de la clase necesitamos 3 referencias, la primera a un FragmentManager que sera el encargado de cambiar los fragmentos en el contenido (proviene del fragment manager de la actividad principal). El segundo es la referencia a nuestro DrawerLayout el cual nos permitirá manipular el layout y el tercero nuestra lista de opciones en el Drawer para poder cerrarla.  Ademas de esto creamos la referencia a los valores de los colores que almacenamos en strings.xml utilizando getResources() desde una de nuestras vistas.
Luego de nuestro constructor tenemos el evento importante onItemClick, este es el evento que se ejecuta cada vez que una opción de nuestro ActionDrawer es seleccionada. Lo primero que hacemos es seleccionar el color de nuestro arreglo basado en el valor del indice que nos manda la selección. Luego mandamos cerrar la lista de nuestro drawer con el método closeDrawer de nuestro DrawerLayout para que el usuario vea el cambio en el contenido. Por ultimo utilizaremos nuestra clase PlainColorFragment para crear instancias del fragmento que se desplegara basándonos en el color que se ha seleccionado; iniciamos una nueva transacción en nuestro FragmentManager y reemplazamos el contenido de content_frame, con el fragmento que acabamos de crear y le ponemos el nombre del color que seleccionamos. Al final hacemos commit en la transacción para que sea aceptada.

En los screens que se muestran abajo les muestro como se ve la app ya terminada y como siempre el código esta disponible para el que así lo desee en mi perfil de github. Espero y este articulo les sea de utilidad ya que la mayoría de las aplicaciones ahora están desplegando Drawers como este.

Update: Si quieren descargar la aplicación funcionando desde play store pueden hacerlo con este link. Si lo hacen se los agradecería ya que ayudarían a que continué desarrollando para android. 
https://play.google.com/store/apps/details?id=org.blanco.android.actiondrawerexample

Saludos a todos

miércoles, 3 de julio de 2013

Ejemplo de Comerciales

Hola que tal, un saludo a todos los lectores. Una disculpa por estar ausente durante bastante tiempo, varias cosas han pasado que me han impedido dedicarle un espacio al blog. Una de ellas es que aun me estoy adaptando a Android Studio (el nuevo IDE para Android que esta basado en IntelliJ). En esta ocasión les quiero compartir un pequeño ejemplo de como monetizar una aplicación utilizando un framework llamado TapContext. En la actualidad existen varias alternativas de monetizar una aplicación para Android, ademas de AddMob el framework por defecto de Google, un developer puede añadir el la librería de su preferencia para desplegar comerciales y comenzar a ganar dinero (a eso me refiero con monetizar).

Escogí la librería de TapContext por que es muy sencillo de utilizar y configurar; aun cuando no te da mucha libertad en la configuración; es un buen punto de partida para comenzar a trabajar con comerciales. Lo primero que debemos de hacer es registrar una cuenta en https://www.tapcontext.com/ y descargar la librería del SDK. Una vez que tengamos la descarga lo único que debemos de hacer es colocar el jar en la carpeta lib de nuestro proyecto y el archivo tapcontext_notification_layout.xml bajo src/main/res/layout. Una vez que realicemos esto es necesario hacer los vínculos y configuraciones necesarias para llamar comerciales en nuestro código.

El primer vinculo es en realidad para que podamos comenzar a utilizar la librería sin que Android Studio nos muestre errores en el código; lo que tenemos que hacer es agregar la librería al classpath de gradle (recuerden que el nuevo sistema de compilación y construcción de Android esta basado en Gradle). Para esto editamos el archivo build.gradle dentro de nuestra carpeta del proyecto y agregamos la siguiente linea dentro del elemento dependencies "compile files('libs/TapContext_2.1.jar')". El resultado final de este elemento se debería de ver algo similar a:

dependencies {
    compile files('libs/android-support-v4.jar')
    compile files('libs/TapContext_2.1.jar')
}

Una vez que hemos corregido nuestras dependencias podemos empezar a configurar nuestro contexto para comerciales. Tenemos que agregar las siguientes lineas a nuestro archivo manifest (AndroidManifest.xml).

Dentro de el nodo Application agregamos:



Solo quiero aclarar que la parte que dice ***key*** tiene que ser reemplazada por la clave que obtuvieron cuando se registraron para el servicio. Esta clave estará disponible en su perfil. Lo que agregamos solo fue la actividad que sera lanzada cuando se desplieguen los comerciales y un servicio que estará escuchando para mantener los comerciales y las estadísticas.

Solo con estas configuraciones ya podemos iniciar a mostrar comerciales en nuestro código. Como las imágenes son un poco grandes yo opino que la mejor manera de mostrarlos es cuando nuestra aplicación inicie (o cuando algún evento importante termine), para eso agregamos el siguiente código en nuestra actividad.

@Override
    protected void onStart() {
        TapContextSDK adsContext = new TapContextSDK(getApplicationContext());
        adsContext.initialize();
        adsContext.showAd();
        super.onStart();
    }

Listo solo con este código podremos crear una aplicación que despliegue comerciales al iniciar. TapContext es solo uno de los muchos frameworks par desplegar comerciales que existen. En mi opinión no es el mejor pero si uno de los mas sencillos de usar, cuenta con un dashboard decente para revisar tus publicaciones, avance de ganancias, etc. Ademas de que su soporte a usuarios es bueno. Abajo les dejo pantallas de como se ven los comerciales dentro de la aplicación y como siempre el código fuente esta disponible en mi GitHub.

Saludos y gracias por leer.