Hola hoy vamos a ver el nuevo IDE para desarrollar en Android que ha lanzado Google esta semana en su evento Google I/O 2013, su nombre es  Android Studio esta basado en un IDE para Java muy conocido llamado IntelliJ IDEA.
Este nuevo entorno nos proporciona herramientas para el desarrollo en android al igual que en Eclipse si utlizamos el plugin ADT.

Este nuevo entorno nos proporciona herramientas para el desarrollo en android al igual que en Eclipse si utlizamos el plugin ADT.
Segun la documentacion oficial tambien nos ofrece:

• Soporte para Gradle
• Refactorizacion especifica para Android y soluciones rapidas.
• Herramientas para medir el rendimiento, usabilidad, compatibilidad de versiones y otros problemas.
• ProGuard y capacidad para firmar apps
• Asistentes basados ??en plantillas para crear diseños y componentes en Android.
• Un editor rico en cuanto a diseño, que le permite realizar drag and drop a los componentes de la UI,
• vista previa de los layouts en múltiples configuraciones de pantalla en simultaneo(a mi opinion algo super util), y mucho más

Como siempre Google nos ofrece sus soluciones para diferentes plataformas, yo particularmente lo he probado solamente en Linux Ubuntu 12.04 64 bits .

La instalación es muy simple y no voy a explayarme sobre ya que para cada OS varia pero lo pueden descargarlo de aqui.

Creando un proyecto:

Una vez que lo abrimos podemos ver algunas cosas,muestra una ventana para crear un proyecto importarlo, etc.

Para crear un proyecto nuevo es de lo mas simple:

1- Seleccionamos New Project,

luego la ventana que veremos es muy parecida a la del Eclipse.

2- Podemos seleccionar el icono para la app y su tamaño:

 3-Seleccionar algun diseño ya predeterminado para la UI.

4- Por ultimo ingresamos el nombre de la Activity y Finish

Una vez q abre el e  podemos ver que tal vez su UI no sea del todo bonita si lo comparamos con el eclipse o algún otro  (lo compensa en rendimiento)

La estructura del proyecto es muy parecida a la de eclipse, a continuación muestro una comparativo con los ide e sombreado algunas areas con color para facilitar la comparación.

Al intentar lanzar el emulador tuve el siguiente problema:

Algunos de los emuladores que habia creado no tenian seleccionado una version en el campo Targe, esto se debe a que el ide trae por defecto la version 4.2.2 y en mi caso usaba 2.3, para corregir esto tuve que seleccionar para el proyecto la ubicacion del SDK que tenia instalado.

Deben hacer lo siguiente:

File->Project Structure

Luego clickera Edit como vemos en la img.

Luego en el campo Android SDK Home Path cambiarlo a donde uds tengan instalado su SDK.

Luego de esto deberan volver a la ventana con los emuladores dar click en el emulador que muestra fail, clickear edit y veran que en el campo target en su listado figuran todos las versiones que tenian instaladas.

Editor de UI:

Una de las caracteristicas mas interesantes que incluye es un poderoso de editor visual para poder crear arrastrando los componentes nuestras vistas.

También nos permite ver nuestra vista en diferente dispositivos.

Cambiar Theme:

Si son de los que les gusta usar el IDE en colores oscuros al estilo SublimeText2 pueden cambiar el color de la sig. forma
File->Settings->Appeareance->Theme
El actual es IDEA 4.5 deberan cambiarlo a “Darcula“, luego deberan reiniciar el ide.
Luego se vera de la siguiente forma;

Probar App en Telefono en vez de Emulador:

Pude observar que el IDE por defecto ejecuta la aplicación en el emulador y por mas que tengamos nuestro telefono conectado lo seguirá haciendo, para poder correrlas directamente en nuestro telefono debemos hacer lo siguiente:

Dar click al lado de la flecha verde de RUN en el campo de seleccion y clickear en “Edit Configuration” como muestra la imagen.

Luego nos abrira la siguiente ventana en el cual debemos buscar en la sección Target Device y marcar “Show chooser dialog” y luego  OK.

Una vez modificado esto al volver a correr nuestra App nos mostrara la ventana para seleccionar si correr en el emulador o en nuestro dispositivo Android.

Importar Proyecto de Eclipse:

 Documentacion oficial sobre esto aqui.

Debemos hacer lo sig.

Primer ver si el plugin ADT en eclipse esta al dia version 22 o superior
Si no recuerdan como actualizarlo miren este link

Luego en Eclipse, seleccionar File > Export.
En la ventana que aparece seleccionar Android and Generate Gradle build files.

Seleccionar el proyecto you want y click Finish.

Para importarlo en Android Studio:

En Android Studio, seleccionar File > Import Project.

Ubicar el proyecto y seleccionar ok

Seleccionar crear proyecto de una fuente existente, seguir el asistente como si estuviesemos creando un proyecto.

Android Studio nos ofrece mucho mas de lo que mostre en este post solamente comente algunas, con el tiempo iremos conociendo mas sobre este IDE.

Les dejo un video oficial de Google sobre este

Conclusion:

El ide promete mucho ya que esta diseñado especificamente para el desarrollo en Android, es mucho mas rapido y liviano que Eclipse, esto es un punto
muy importante a favor, tambien para lo que es el diseño de UI es mucho mejor.
Recuerden que al ser una version Preview de seguro debe haber muchos bugs que iran corrigiendo con el tiempo·
Los invito a que lo prueben y dejen algun comentario de que les parecio o si quieren compartir alguna funcionalidad que hallan encontrado y les parece importante.

Muchas Gracias, hasta el proximo Post.

Sebastian.

¿Te gustó este tutorial? ¡Compártelo!

]]> http://androideity.com/2013/05/18/review-sobre-android-studio/feed/ 11 http://androideity.com/2013/05/05/google-maps-android-api-v2/#utm_source=rss&utm_medium=rss&utm_campaign=google-maps-android-api-v2 http://androideity.com/2013/05/05/google-maps-android-api-v2/#comments Sun, 05 May 2013 23:41:05 +0000 htorrex http://androideity.com/?p=4334 INTRODUCCIÓN A finales del 2012 google mostraba la segunda versión Google Maps Android API v2 la cuál tiene novedades interesantes: Integración con los Servicios de Google Play (Google Play Services) Utilización a través de un nuevo tipo específico de fragment (MapFragment). … Sigue leyendo →]]> INTRODUCCIÓN

A finales del 2012 google mostraba la segunda versión Google Maps Android API v2 la cuál tiene novedades interesantes:

• Integración con los Servicios de Google Play (Google Play Services)
• Utilización a través de un nuevo tipo específico de fragment (MapFragment).
• Utilización de mapas vectoriales, lo que repercute en una mayor velocidad de carga y una mayor eficiencia en cuanto a uso de ancho de banda.
• Mejoras en el sistema de caché, lo que reducirá en gran medida las famosas áreas en blanco que tardan en cargar.
• Los mapas son ahora 3D, por lo cuál, podremos mover nuestro punto de vista de forma que lo veamos en perspectiva.

Un cambió importante es que ahora utilizaremos un nuevo tipo específico de fragment llamado MapFragment, esto nos permitirá entre otras cosas añadir uno o varios mapas a cualquier actividad, y por supuesto tener todas las ventajas del uso de fragments. Esto viene a sustituir al MapView de la versión 1 que además requería que su actividad contenedora fuera del tipo MapActivity.

Nota: Ya que el nuevo control de mapas se basa en fragments, si queremos mantener la compatibilidad con versiones de Android anteriores a la 3.0 tendremos que utilizar la librería de soporte android-support.

El objetivo de este post es detallar los pasos necesarios para hacer uso de la nueva versión de la API de mapas de Google en sus futuros proyectos.

1.- Primero que nada, ya que la API v2 se proporciona como parte del SDK de Google Play Services, es necesario incorporar previamente a nuestro entorno de desarrollo este paquete. Haremos esto accediendo desde Eclipse al Android SDK Manager y descargando del apartado de extras el paquete llamado “Google Play Services”.

el paquete quedará instalado en la ruta: <carpeta-sdk-android>/extras/google/google_play_services/.

2.- El siguiente paso será obtener una API Key para poder utilizar el servicio de mapas de Google en nuestra aplicación.

Nota: Como sabemos en la versión 1 del api también necesitábamos una key, en este caso dicha key quedará obsoleta ya que La API de Google Maps para Android V2 utiliza un nuevo sistema de gestión de claves. Se recomienda seguir con el proceso para generar una nueva.

Por lo tanto lo que haremos será acceder a la Consola de APIs de Google, en este caso tendremos que crear un nuevo proyecto desplegando el menú superior izquierdo y seleccionando la opción “Create..”

Nos mostrará una ventana en la que escribiremos el nombre del proyecto. Introducimos algún nombre descriptivo y damos aceptar.

Una vez creado el proyecto damos clic e a la opción “Services” del menú de la izquierda. Desde esta ventana podemos activar o desactivar cada uno de los servicios de Google que queremos utilizar. Para el ejemplo sólo activaremos el servicio llamado “Google Maps Android API v2″ pulsando sobre el botón ON/OFF.

Una vez hecho esto, damos clic en la opción “API Access” donde tendremos la posibilidad de obtener nuestra nueva API Key que nos permita utilizar el servicio de mapas desde nuestra aplicación. A continuación pulsaremos el botón “Create new Android key…”.

En concreto necesitaremos ingresar dos cosas:

• La huella digital (SHA1) del certificado con el que firmamos la aplicación y
• El nombre del paquete java utilizado en nuestra aplicación.

Toda aplicación Android debe ir firmada para poder ejecutarse en un dispositivo, este proceso de firma es uno de los pasos que tenemos que hacer siempre antes de distribuir públicamente una aplicación. De hecho durante el desarrollo para poder realizar pruebas y la depuración del código, estamos firmando la aplicación con un “certificado de pruebas”.

Podemos saber en qué carpeta de nuestro sistema está almacenado este certificado accediendo desde Eclipse al menú Eclipse/ Preferences / Android / Build.

En mi caso el certificado de pruebas está en la ruta “/Users/htorres/.android/debug.keystore”. Para obtener nuestra huella digital SHA1 deberemos acceder a dicha ruta desde la consola y ejecutar los siguientes comandos:

• cd /Users/htorres/.android/
• “/System/Library/Java/JavaVirtualMachines/1.6.0.jdk/Contents/Home/bin/keytool” -list -v -keystore debug.keystore -alias androiddebugkey -storepass android -keypass android

En mi caso la instalación de Java está en la ruta “/System/Library/Java/JavaVirtualMachines/1.6.0.jdk/”. Sólo debes sustituir por la ruta en tu computadora. Esto nos devolverá varios datos del certificado.

Este es el dato que nos interesa:
SHA1: 41:3C:38:4B:C6:6A:BE:71:2D:E2:31:7D:C6:52:32:E3:96:AF:43:B4

Lo añadimos a la ventana de obtención de la API Key donde nos habíamos quedado antes, y a continuación separado por un punto y coma añadimos el paquete java que vayamos a utilizar en nuestra aplicación, que en mi caso será “mx.androideity.mapav2″.

Pulsamos el botón Create y se genera el API Key, podremos verla en la pantalla siguiente dentro del apartado “Key for Android Apps (with certificates)”.

Con lo anterior concluimos las configuraciones necesarias para utilizar el servicio de mapas de Android en nuestras aplicaciones.

3.- Crearemos un nuevo proyecto de Android, para el ejemplo lo llamaremos “androideity-mapav2″.

Nota: Recordemos utilizar para el proyecto el mismo paquete java que hemos indicado durante la obtención de la API key.

3.1 Ahora tenemos que modificar el archivo AndroidManifest.xml para agregar la API Key que acabamos de generar, esto dentro de la etiqueta<application>, un nuevo elemento <meta-data> como se muestra a continuación:

En donde android:value  tendremos que poner nuestra API Key recien generada.

3.2 Otra modificación dentro del AndroidManifest es añadir permisos adicionales que nos permitan acceder a los servicios web de Google, a Internet, y al almacenamiento externo del dispositivo (esto para guardar la caché de los mapas), por último dado que la API v2 de Google Maps Android utiliza OpenGL ES versión 2, deberemos especificar también dicho requisito en nuestro AndroidManifest añadiendo un nuevo elemento <uses-feature>:

Una vez hemos configurado todo lo necesario en el AndroidManifest, y antes de escribir nuestro código, tenemos que seguir añadiendo elementos externos a nuestro proyecto.

4.- Agregar google play services al proyecto:

Debemos referenciar desde nuestro proyecto la librería con el SDK de Google Play Services. Desde eclipse podemos importar la librería mediante la opción de menú “File / Import… / Existing Android Code Into Workspace”.

Como lo comentamos anteriormente este paquete se localiza en la ruta: “<carpeta-sdk-android>/extras/google/google_play_services/libproject/google-play-services_lib”.

Acto seguido debemos asociar a nuestro proyecto la libreria que acabamos de importar dando clic derecho / Properties / Android. En dicha ventana podemos añadir una nueva librería en la sección inferior llamada “Library”. Cuando pulsamos el botón “Add..” nos aparecerá la librería recien importada y podremos seleccionarla directamente, añadiéndose a nuestra lista de librerías referenciadas por nuestro proyecto.

 5.- Añadir la librería android-support-v4.jar

Debemos asegurarnos de que nuestro proyecto incluye la librería android-support-v4.jar, que debería aparecer si desplegamos la carpeta “lib” de nuestro proyecto. Si es así pasa al paso 6, de lo contrario haz lo siguiente:

Puedes agregar la librería dando clic derecho en el proyecto en la opción “Android Tools / Add Support Library” se abrirá el SDK Manager y procederá a descargar e instalar la librería, para más detalles puedes revisar la documentación oficial aquí.

6.- Ahora editamos el archivo activity_main.xml que es el layout principal de la actividad, en el caso de la nueva API v2 se añadirá en forma defragment de un determinado tipo (com.google.android.gms.maps.SupportMapFragment), quedando por ejemplo de la siguiente forma:como se muestra:

7.- Dado que estamos utilizando fragments, la actividad principal también tendrá que extender a FragmentActivity (en vez de simplemente Activity). Usaremos también la versión de FragmentActivity incluida en la librería android-support para ser compatibles con la mayoría de las versiones Android actuales

Este es el código que ingresaremos en nuestra clase llamada MainActivity que como se observa se hereda de FragmentActivity de la libreria support.v4:

8.- Este es el resultado al ejecutar la aplicación en el dispositivo:

Espero que les sirva el post para poder agilizar la curva de aprendizaje en la migración de mapas en android con respecto a la versión 1.

En post siguientes hablaremos de las nuevas características e interacciones con el mapa.

Hola lectores  hoy les traigo la segunda parte del  tutorial  sobre el uso de SurfaceView en nuestras aplicaciones, antes de seguir si no leyeron la primera parte recomiendo que lo hagan:

http://androideity.com/2013/02/12/usando-surfaceview-en-android-parte-1/

Hoy avanzaremos un poco mas y veremos como detectar pulsaciones en la pantalla y poder interactuar con ellas.

La idea es que al finalizar el post podamos emular una especie de interfaz como la de un joystick como vemos en las imágenes siguientes:

Manos a la obra:

Como siempre el codigo estara disponible en el repositorio, veremos algunas cosas antes.

Para interactuar con la pulsacion de la pantalla tendremos que utilizar onTouchEvent() mas info
public boolean onTouchEvent(MotionEvent event)

Cuando tocamos  la pantalla lo estamos haciendo en ciertas coordenadas (X,Y) dentro de la misma:

int touched_x = (int) event.getX();

int touched_y = (int) event.getY();

Otra de las cosas que podemos hacer es tener un control de cuando o como realizamos la pulsacion sobre la pantalla, para esto utilizaremos la clase

MotionEvent recomiendo dar un vistazo a http://developer.android.com/reference/android/view/MotionEvent.html

 onTouchEvent(MotionEvent event) recibe como parametro un objeto Motion event, por lo que nosotros podemos leer la accion que esta ocurriendo mediante 

event.getAction();

por medio de un switch podemos controlar esa accion y saber cuando por ej:

MotionEvent.ACTION_DOWN   Cuando se toca la pantalla

MotionEvent.ACTION_MOVE Cuando se desplaza el dedo por la pantalla

MotionEvent.ACTION_UP   Cuando levantamos el dedo de la pantalla que estábamos tocando

Entoces por ejemplo si quisiera dibujar un circulo que se muestre en donde presiono la pantalla

deberia guardar las coordenadas x,y de la pulsacion de la pantalla y cuando esta se toca determiandolo en el onTouchEvent con MotionEvent.ACTION_DOWN

dentro del metodo onDraw() dibujar el circulo usando las coordenadas de la pulsacion como coordenadas de origen del circulo, luego

cuando se levante el dedo  con MotionEvent.ACTION_UP volver a pone la pantalla negra.

Tambien por ejemplo si quisiera implementar algun tipo de drag and drop podria utilizar el MotionEvent.ACTION_MOVE y combinarlo con los otros 2.

Ahora veremos la aplicación:

El código es el mismo que el del tutorial anterior con algunos complementos:

Los archivos MySurfaceThread ,MainActivity y el AndroidManifest.xml son los mismo que los del tutorial anterior.

En el sig. diagrama ayudara para entender el codigo.

En el archivo MySurfaceView he realizado las siguiente modificaciones, la explicación esta comentada en cada linea.

Basicamento lo que hace en el evento onDraw() es muy simple si toco la pantalla  determinandolo por la variable touched y donde toque esta dentro del circulo negro dibujamos el circulo rojo y al mover el dedo da la sensacion de estar moviendolo.

Luego para detectar cuando o no presiono el boton, lo que hago es como antes si touched es true y en donde estoy tocando en la pantalla es donde esta el boton

cambiamos la imagen que muestra  bitmap y al redibujarse la pantalla parece como si lo estuviese tocando ya que al sacar el dedo de encima cambia la imagen.

lineas 118 a  138  del codigo

Si todo funciona correctamente deberia verse como el video:

Como ven es muy simple y no tiene mayor complejidad, si entendieron todo esto pueden darle un vistazo a un ejemlo ya incluido en la carpetas Samples llamado LunarLander el cual utiliza todo lo que vimos hoy y les va a servir como complemento.

Como veran con todo esto que hemos visto podran realizar su propio juego o cualquier aplicacion que utilize la interaccion con las pulsaciones en la pantalla.

Código utilizado:

Como siempre comparto con uds el codigo utilizado en este ejemplo, podran descargarlo del repositorio:

Click en la imagen debajo para acceder al repositorio

Esto fue todo por hoy, espero que les halla gustado como siempre cualquier consulta o sugerencia pueden utilizar el

campo de comentario que encontraran mas abajo, hasta la proxima.!

Sebastian

¿Te gustó este tutorial? ¡Compártelo!

Hola lectores el dia de hoy les traigo un nuevo tutorial  en este caso  sobre como utilizar SurfaceView en nuestras aplicaciones.

En el blog ya hemos utilizado esto  en combinacion con algun otro tema en los sig. post: OpenGL para mí, para ti, para todos! – Parte I  y Hello Camera pero en esta ocasion lo veremos con un poco mas de profundidad.

¿Que  nos permite SurfaceView?

Según la documentacion oficial disponible  aqui  , Proporciona una superficie de dibujo dedicado incrustado dentro de una jerarquía de vistas.

Puedes controlar el formato de esta superficie y  si se quiere, su tamaño,  SurfaceView se encargara de colocar  la superficie en el lugar correcto en la pantalla.

La superficie esta ordenada respecto del eje Z de modo que se encuentra detrás de la ventana que contendrá al SurfaceView, esta crea un ‘agujero’ en la ventana para poder mostrar su superficie. La jerarquía de vistas se va a encargar de manejar la superficie con los demas componentes que hay en la ventana por lo que se puede combinar SurfaceView con cualquier otro elemento como botones en la parte superior de la superficie aunque esto puede afectar el rendimiento.
Basicamente se trata de una View que contiene una Surface que es un buffer crudo que es usado por el screen compositor que se encarga de renderizar todo en Android.

Algunas diferencias entre View y SurfaceView:

• Views todo es dibujado en el mismo hilo de la UI el cual tambien es usado para la interaccion con el usuario.
• SurfaceView puede ser dibujado por varios hilos diferentes al de la UI.
• Surfaceview No puede ser transparente solamente puede estar detras de otros elementos en la jerarquia de vistas.
• Para animaciones es mucho mas rapido que View.
• Surfaceview consume mas recursos que View

For more information (and a great usage example) refer to the LunarLander project in the SDK ‘s examples section

Manos a la obra:

Para acceder a la superficie subyacente es necesario hacerlo mediante la interfaz SurfaceHolder.Callback

Para poder empezar es necesario implenentar una clase  que extienda de SurfaceView e implemente SurfaceHolder.Callback para poder manejar los metodos relacionados con esta ( creación, modificación y destrucción,etc)

Esta contendra los metodos  surfaceCreated(), surfaceDestroyed(), surfaceChanged()

- Implementar un  Thread  para nuestro SurfaceView.

-En el constructor de SurfaceView agregar  SurfaceView a SurfaceHolder para poder utilicar callback y crear el hilo.
getHolder().addCallback(this);
thread = new MySurfaceThread(getHolder(), this);

-Modificar el metodo  run() del  Thread

Empezando con el codigo.

A la clase la he llamado MySurfaceView, el codigo sera de la siguiente forma:

Como pudimos ver en el constructor llamamos getHolder().addCallback(this); para acceder a la superficie y poder manejar los eventos de SufaceView desde esta clase. He agregado onDraw() y onTouchEvent() los cuales veremos luego.

En el activity principal vamos a decirle que en lugar de cargar la ui desde un archivo xml de /res/Layout utilize nuestra clase:

MainActivity.java

En  la linea 19 use setContentView(new MySurfaceView(this)) aqui le dijo que utilize nuestra clase en lugar del layout, tambien mas arriba defini que no se muestre el titulo de la app ni la barra de notificaciones.

Como les habia comentado al principio el SurfaceView puede utilizarse con otros elementos como botones,etc, por lo que para poder utilizarlo es necesario declararlo en el XML del layout, se podria hacer de la sig. forma.

Ejemplo:

Si ejecutamos la aplicación en este punto mostrara toda la pantalla negra ya que en ninguna parte le hemos dicho que pinte o cambie el color.

Ahora lo que vamos a hacer es implementar un hilo que sera el que se encargara de pintar, observen  que este hilo sera diferente al de la UI.

Prestar atencion a la explicacion en los comentarios en el codigo:

Es necesario agregar en el metodo onCreate de nuestro SurfaceView la llamada a nuestro hilo

Como veran creamis una instancia al hilo pasandole como parametros el la referencia al surfaceholder y el contexto.

luego establecemos el estado del hilo como corriendo -> true y lo iniciamos con start.

Tambien debemos modificar el SurfaceDestroyed()

Cada vez que la app pase a segundo plano el SurfaceView se va a destruir junto con todo su contenido ejecutandose SurfaceDestroyed(),

el hilo se va a detener y liberar el canvas, pueden probar esto pasando la app a segundo plano y dándole un vistazo al logcat

lo que implica que cuando la app vuelva a primer plano debera volver a dibujar todo nuevamente deberán tener en cuenta esto a la hora de utilizar esto.

Ahora necesitaríamos modificar el metodo onDraw() y especificar que realize alguna accion que podamos ver en la pantalla.

Solamente explicare como dibujar un circulo ya que el tutorial no es sobre canvas en si por lo que recomiendo leer la documentacion sobre Canvas.

Con simplemente colocar dentro:

Si ejecutan la app veran  la pantalla con fondo blanco y un circulo negro en la mitad de la pantalla:

Hasta aca damos   por finalizado la 1°  parte del tutorial.

En la segunda parte que publicare en lo que resta de la semana utilizaremos los conocimientos aprendidos hoy y explicare como detectar las pulsaciones en la pantalla,  les mostrare como realizar una interfaz  basica que “simule” el funcionamiento de un joystick como los del viejo Atari.

Para realizar este tutorial utilize informacion de las sigueientes fuentes:

http://developer.android.com/reference/android/view/Surface.html

http://developer.android.com/reference/android/view/SurfaceView.html

http://android-er.blogspot.com.ar/2010/05/android-surfaceview.html

http://epere4.blogspot.com.ar/2008/04/cmo-funciona-synchronized-en-java.html

http://blog.vidasconcurrentes.com/android/dibujando-figuras-en-un-canvas-de-android-parte-i/

http://stackoverflow.com/questions/13496598/surfaceview-colour-differences-between-surfaceview-and-view

http://stackoverflow.com/questions/1243433/android-difference-between-surfaceview-and-view

http://https417.blogspot.com.ar/2012/08/threading-surfaceview-in-android.html

Código utilizado:

Como siempre comparto con uds el codigo utilizado en este ejemplo, podran descargarlo del repositorio:

Click en la imagen debajo para acceder al repositorio

Esto fue todo por hoy, espero que les halla gustado, hasta la proxima.!

Sebastian

 ¿Te gustó este tutorial? ¡Compártelo!

Las herramientas con las que contamos los desarrolladores de aplicaciones en Android cada día crece como espuma y fortalece la plataforma del robot verde; así que el problema no es la falta de herramientas sino el conocerlas, por eso en este post muy sencillo traigo un “Hola Mundo” para una librería que me gustó mucho y que se llama PanoramaGL, con la cual podrás ver fotos panorámicas en tu aplicación, así que si te interesa agregar esta funcionalidad a tu aplicación sigue leyendo para ver de qué se trata.

Hace unas pocas semanas Google dio a conocer la última versión de sus sistema operativo Android, el cual ya va en 4.2 y que se sigue llamando Jelly Bean como su versión anterior 4.1. La versión 4.2 promete una mejoras importantes dentro de las cuales surgió una que me llamó mucho la atención: Photo Sphere; una
funcionalidad de la cámara con la cual podrás capturar y visualizar fotos de 360°. Genial ¿no?
En este video podrás recordar o ver (si no lo has hecho antes) de lo que se trata Photo Sphere:

Sin duda alguna esta nueva funcionalidad es bastante interesante, pero sería muchísimo más interesante si los desarrolladores de aplicaciones para Android pudiéramos aprovechar este recurso e incluirlo en aplicaciones que necesitan de un recurso más liviano que un video pero más interactivo que una foto plana.
Imagina que estás desarrollando una aplicación que necesita mostrar el interior de una casa que está a la venta, un almacén que estas promocionando, un sitio turístico que deseas dar a conocer, el interior de un automóvil que deseas mostrar a tus clientes, ¿no crees que una foto panorámica sería la solución perfecta? Si crees que sí, de seguro la librería que hoy te traigo será una solución muy buena para este tipo de necesidades.

PanoramaGL

PanoramaGL fue la primera librería para Android (también para iOS) Open Source que implementó la propiedad de visualizar fotos panorámicas tanto en el eje X como Y, para ser usadas en el desarrollo de aplicaciones móviles. En la página oficial PanoramaGL  podrás encontrar todo lo que necesitas saber sobre esta librería, como un HelloWorld, descargar el código fuente, recursos externos y características propias, aunque podemos destacar para nuestro interés que se puede usar en versiones de Android 2.0 en adelante, soporta OpenGL 1.0 en adelante, tiene zoom y movimiento sensorial, osea que puedes usar por ejemplo el Acelerómetro para hacer que se mueva la foto que estás visualizando. Algo muy interesante también es la facilidad de poder implementar el protocolo JSON para visualizar Fotos desde una URL.

Para que puedas ver de qué se trata esta librería te recomiendo que visites su página y te enteres de todas sus geniales características, pero si quieres ver ya de que se trata, te dejo el siguiente video (no tan claro) en donde se puede ver un ejemplo de lo que hace la librería.

Como lo dijimos al inicio del post, vamos a ver un “HolaMundo” del uso de esta librería para que pueda ser aprovechada en nuestros proyectos, así que empecemos:

1. En el primer paso vamos a descargar los archivos necesarios para utilizar PanoramaGL y como es lógico pensar necesitamos la librería .jar para ser usada en nuestro proyecto, así que la descargamos de la siguiente dirección:  http://panoramagl-android.googlecode.com/files/libglues.zip

La segunda descarga que vamos a hacer será de los archivos de compatibilidad, pero ¿qué son esos archivos? Son ficheros que nos ayudan para que podamos usar nuestro código en diferentes arquitecturas de hardware sin importar si el dispositivo Android tiene un procesador con arquitectura ARM, x86 o MIPS, así que debes descargarlos de la siguiente dirección:
http://panoramagl-android.googlecode.com/files/libglues.zip

Lo último y más bonito que debemos tener para hacer nuestro proyecto son las imágenes que vamos a mostrar. Es muy importante que estas imágenes tengan las siguientes características:

a. Que su tamaño NO exceda los 1024 x1024 pixeles de tamaño, ya que la librería no soporta más de este tamaño. Es cierto que es una limitante pero pues no todo puede ser color de rosa.

b. Lo segundo que debes tener presente (aunque sea obvio), es que las imágenes de que vayas a visualizar deben ser de tipo esféricas, que no sean planas, ya que la librea lo que hace es como una especie de “estiramiento” de la misma y las acomoda al formato panorama; estas imágenes esféricas se ven extrañas en un visualizador de imágenes común, pero cuando las visualizas correctamente se ven muy bonitas.  Pero si no eres fotógrafo, o no sabes cómo tomar una foto esférica (como es mi caso) pues muy sencillo bájate una de internet, en mi caso use la de la siguiente dirección:
http://www.pananoias.com/wp-content/gallery/equirectangulares/rocodromo.jpg y después de la descarga le cambie el tamaño a 1024×512 pixeles. Eso lo hace muy fácil el editor de imágenes de Windows, no sé cómo se haría en Mac
o Linux. De todas maneras al final del post te dejaré el código fuente del
proyecto.

2. Con los archivos necesarios para el proyecto, ya podremos empezar a codificar lo que necesitamos del proyecto, para esto creamos un proyecto a tu necesidad y con el nombre que le desees dar, la versión, y si tiene la última versión del ADT para Eclipse podrás elegir el Theme:

3. Con nuestro proyecto creado, lo siguiente será copiar los archivos que descargamos a nuestro proyecto, así que vamos a lugar en donde descargamos los archivos y aquel que se llama “libglues”, se descomprime y quedaría una carpeta llamada libs, la cual contiene las siguientes carpetas:

Estas carpetas que están dentro de la  llamada libs son las que debes copiar dentro de tu proyecto; también debes copiar dentro de tu carpeta libs la librería PanoramaGL_0.1.jar que también descargaste, así que tu proyecto debería ir quedando de la siguiente manera:

4. Con nuestros archivos ya dentro de las carpetas respectivas lo que debemos hacer es vincular la librería PanoramaGL_01.jar a nuestro proyecto; una forma de hacerlo es dando clic derecho sobre el proyecto, seleccionar la opción “Properties”, seguido seleccionas la opción “Java Build Path” y al costado derecho seleccionas la pestaña “Libraries”; seguido das clic en el botón “Add JARS..” y en la ventana que se abre debes elegir la librería PanoramaGL_0.1.jar y por último das clic en el botón “OK”. La imagen a continuación muestra cómo se debe ver antes de dar clic en “OK”, pero en el video que está al final de este post podrás ver los pasos de este punto con mayor detalle así como el resto de la construcción del proyecto.

5. Con los archivos necesarios dentro del proyecto, vamos a colocar a nuestras protagonistas, la fotos panorámicas o esféricas que queremos visualizar, como dije al inicio deben ser fotos esféricas, el enlace que les deje muestra la siguiente imagen:

Como pueden ver casi no se puede diferenciar claramente de qué se trata el lugar, pero cuando lo veamos implementados en nuestro proyecto van a ver lo bonito que queda; así que descargamos la imagen, le damos un tamaño máximo de 1024 pixeles y la guardamos en nuestra carpeta llamada “raw”, que si no la tienes creada la debes adicionar a tu proyecto dentro de la carpeta “res”, a mi imagen le di el nombre de rocodromo.jpeg, y así va quedando el proyecto:

6. Tenemos todos los archivos que necesitamos, ahora faltaría un poco de código para ver unas lindas imágenes panorámicas, así que abrimos nuestra clase que para nuestro caso la llamamos PanoramaGL.java y las cosas que debe tener son las siguientes:

a. Los import necesarios son los siguientes:

import com.panoramagl.PLImage;
import com.panoramagl.PLSphericalPanorama;
import com.panoramagl.PLView;
import com.panoramagl.utils.PLUtils;
import android.os.Bundle;

Aquellos que empiezan con “panoramagl” son aquellos que se refieren a la librería que previamente importamos, y que son necesarios para los objetos que crearemos a continuación.

b. Hacemos que nuestra clase extienda como PLView para heredar los elementos necesarios, así que nuestra clase seria PanoramaGL.java extends PLView.

c. Creamos un objeto de tipo PLSphericalPanorama el cual llamamos panorama.

d. Modificamos el objeto panorama para que tome la imagen que tenemos guardada en la carpeta “raw”:

panorama.setImage(this.getCurrentGL(),
PLImage.imageWithBitmap(PLUtils.getBitmap(this, R.raw.rocodromo)));

e. Por último escribimos la línea de código para que la “Activity” creada tome la imagen y la muestre.

Quedando el código de la siguiente manera:

Y así con este sencillo y corto código ya tenemos nuestra imagen cargada en nuestros proyecto, aquí una imagen que muestra cómo se inicia cuando el proyecto comienza:

Pero cómo lo bonito es verlo en vivo, a continuación te dejo un video en donde se muestra paso a paso la creación del proyecto y se puede ver cómo funciona en un dispositivo real:

Nota:  Si detectas algún error en el código, en la explicación, escrito o en el video, por favor escríbenos y con mucho gusto la corregimos. Agradecemos tu ayuda.
Nota 2: El proyecto queda alojado en GitHub , por lo tanto solo tendrás que descargar el proyecto y verificar si tienes alguna duda. Abajo te dejo el enlace directo para la descarga.

En repetidas ocasiones me han dicho que las TabActivity que explicamos en 2 artículos anteriores, Pestañas en Android usando Eclipse y Pestañas en Android usando Eclipse segunda Parte están obsoletas en las versiones 3.0 de Android en adelante, y tienen razón, pero si Android hace esto es porque quiere que las aplicaciones que desarrollemos sean cada vez más funcionales y estéticamente más agradables para los usuarios. Es por eso que hoy les traigo un tutorial en el cual podremos ver el Action Bar que nos ofrece Android para nuestros desarrollos.

Los desarrolladores de aplicaciones en Android cuentan con varios patrones de diseño que proporciona Google para que sus apps sean agradables, fácilmente entendibles y lo mayormente intuitivas posible, es por eso que los recursos con los que se contaban en versiones anteriores, van siendo obsoletas o no más soportadas, cosa que se agradece por parte de nosotros lo que desarrollamos apps en Android; pongámoslo asíi de fácil, imagina que tu eres fabricante de ropa, y sigues haciendo los mismos pantalones bota campana, camisas de solapas gigantes  y zapatos doble piso o suecos que fueron furor en los años 70, pues muy seguramente nadie te va a comprar la ropa a menos que vayan a comprar un disfraz para el dia de Halloween; así que pasemos a usar los recursos que nos recomiendan desde la casa de Android.

 Las aplicaciones no se pueden quedar como inicialmente fueron concebidas, como diseñador de apps debes estar muy pendiente de las nuevas tendencias en el diseño, “debes estar a la moda” en cuanto a funcionalidad y esteticidad se trata, así que hoy te traemos la tendencia en el diseño de las aplicaciones, en donde en la misma pantalla tienes diferentes botones que con su imagen nos dan una idea de lo que son y para lo que sirven, un ejemplo de estas aplicaciones son las de Youtube, Twitter, Instagram, Facebook y muchas mas:

Podemos ver que las apps más populares para Android usar ActionBar como herramienta de acceso a sus diferentes opciones de uso, así que hoy vamos a ver lo sencillo que es el uso de esta herramienta en nuestra aplicaciones, pero como siempre te decimos, el mejor sitio para que consultes sobre este y cualquier tema de desarrollo es la página oficial de desarrolladores de Android, y el enlace que habla sobre ActionBar es el siguiente: ActionBar Android al cual te remitimos para que lo estudies y encuentres toda la información que no te podemos hacer llegar, nosotros te damos un acercamiento y un ejemplo del recurso, pero si quieres profundizar más en este tema, ve directamente a la fuente.

Así que si nada más que hablar, vamos a empezar con el ejemplo de uso en el cual mostraremos como se usa el ActionBar, como crear un ítem dentro de la barra, como saber cuando fue pulsado el item respectivo y como acceder a nuestro boton de Home, no sin antes dejar claro que el proyecto funciona para versiones de Android 3.0 y superior, si deseas usar este recurso en versiones menores, debes importar la librería de compatibilidad, cosas que si es necesario lo explicaremos en otro tutorial, por ahora empecemos con el tutorial:

1. Creamos nuestro proyecto al cual llamaremos “TutorialActionBar” y en este caso usaremos la versión 4.0 y que soporte hasta la versión 3.1.

2. Ya creado nuestro proyecto, le damos un nombre a nuestra Activity principal y a nuestro layout, que en este caso le daremos el nombre de ActionBarActivity y al layout el nombre de main, como te muestro a continuación:

3. Cuando creamos nuestro proyecto, empezamos a codificar nuestra Activity, vamos a sobreescribir un método de esta clase llamado onCreateOptionsMenu que sirve para crear nuestro menú y que recibe como parámetro un objeto de tipo Menu, y dentro de este método llamamos a un método que llamamos CreaMenu y le pasamos el objeto menu, quedando el código de la siguiente manera:

4. El método que llamamos CreaMenu y el cual recibe un objeto de tipo Menu crea cada uno de los ítems que se mostrarán en nuestro ActionBar; en nuestro caso vamos a crear 5 ítems de los cuales los 3 primeros van a tener un icono que los identificará y los otros 2 solo tendrán texto. Para crear un ítem lo hacemos utilizando un objeto de tipo MenuItem y para agregarlo utilizamos el método add, que recibe tres parámetros: el Id, el orden, y el nombre que va a tener cada item.
Por último para cada item que creamos, llamamos al método setIcon para indicarle la imagen que utilizará el item. Además debemos llamar al método setShowAsAction con la constante SHOW_AS_ACTION_IF_ROOM para indicar que vamos a usar este ítem como un elemento interactivo el cual vamos a pulsar y usar para hacer alguna acción; así que el código de este método es el siguiente:

 Cuando llamamos al método setIcon, seleccionamos las imágenes que van a ir en cada uno de los ítems, para este caso elegí 3, los cuales se llaman calendar, lock y question y deben ir guardados en la carpeta res/drawable,como se ve en la siguiente imagen:

 5. Como ya creamos nuestros items, debemos crear un método para que cuando estos sean pulsados sepamos cual fue, para hacer esto debemos sobreescribir el método onOptionsItemSelected que recibe como parámetro un objeto de tipo MenuItem:

Dentro de este método vamos a llamar un método llamado MenuSelecciona y que recibe el objeto MenuItem, y que devuelve una variable de tipo boolean para saber si fue consumida la acción de cada item creado. Dentro de este método definiremos las líneas que nos ayudarán a mostrar una alerta de tipo Toast que indicará que fue pulsado ese ítem. Es aquí dónde deberás sustituir el código que te permita realizar las acciones que necesites que haga tu aplicación. El código quedaría de la siguiente manera:

 Hasta este paso ya podremos terminar con nuestro código, pero como mencioné en la introducción al tutorial, vamos a aprender cómo se utiliza el elemento Home del ActionBar. Pero, ¿qué es el botón Home? Pues es aquel que siempre está en la barra del título pero que no se le daba ningún uso, si has usado la app de Youtube en Android es aquel que se activa cuando pulsas sobre el logo de Youtube:

Para activarlo lo que vamos a hacer primero es crear un objeto de la clase ActionBar dentro del método onCreate de la Activity principal y llamamos al método setDisplayHomeAsUpEnabled y lo configuramos a true, para que se active este botón, quedando el código de la siguiente manera:

 También necesitaremos saber cuando el botón Home sea pulsado, así que dentro de nuestro método MenuSelecciona, adicionamos un nuevo case dentro del switch para saber cuando sea pulsado el Home, así que el método quedaría de la siguiente manera:

 Con esto quedaría listo todo el código que necesitamos para manejar nuestro ActionBar, si corremos el código y pulsamos sobre cada uno de nuestros items se vería cómo se ve en la siguiente imagen:

 Y si te preguntas, ¿en dónde rayos están los otros item que agregaste? Como podrás observar en tu ejemplo únicamente están visibles 2 de los 5 items y el item de Home (la lupita con la fecha). Pues la respuesta es que mires la siguiente imagen y obtengas la respuesta:

 Ah ok, entonces cuando la pantalla está en modo retrato solo muestra unos ítem y cuando está en modo paisaje muestra lo demás porque la pantalla tiene más espacio disponible, ¿pero en dónde está el quinto item que agregamos? ¿y si mi aplicación sólo estará configurada para mostrarse en modo retrato que pasa con los demás ítems? Ok, entonces te invito a que mires la siguiente imagen y saques la respuesta:

Lo que pasa es que como creamos objetos de tipo Menu, cuando no son mostrados están ocultos los item que no pueden ser mostrados, pero podrás ser activados con el botón Menu.

Bueno como siempre hago en mis tutoriales un video del paso a paso del proyecto, y cómo está vez no será la excepción, te dejo abajo el video que muestra cómo manejar el ActionBar en Android usando eclipse para aquellos que prefieren ver todos los detalles, y además como en Androideity se ha venido haciendo desde hace unos meses, todos los proyectos los dejamos en GitHub para que los descargues, y puedas revisar algún error que te haya salido a lo largo del seguimiento del tutorial. Con esto ya tienes todos los recursos para trabajar, así que dale.

Por ahora no es más pero tampoco menos, espero que te sirva este aporte a tus proyectos Android, y si tienes dudas con mucho gusto déjalas abajo en los comentarios que tan pronto como pueda las contestaré, aunque si puedes darme una manito y avisar por twitter que dejaste un comentario te lo agradezco.

Nota: Si detectas algún error en el código, en la explicación, escrito o en el video, por favor escríbenos y con mucho gusto la corregimos. Agradecemos tu ayuda.
Nota 2: A partir de esta entrega dejaremos todo el código de los proyectos en un repositorio alojado en GitHub , por lo tanto solo tendrás que descargar el proyecto y verificar si tienes alguna duda. Abajo te dejo el enlace directo para la descarga.

Descarga el proyecto:

Hola amigos de androideity el dia de hoy les mostrare como poder enviar un tweet desde tu propia aplicacion, seguramente habran visto o usado muchas aplicaciones que permiten realizar esto como la de nike+ running , endondomondo, etc. al final del tutorial tu podras hacer lo mismo.

Twitter posee una  API REST mediante la cual interactuaremos con el, también pone ofrece un listado de librerías para diversos lenguajes para poder utilizar el api de una manera sencilla, actualmente el api se encuentra en la version 1.1 la version 1.0 dejara de funcionar en marzo del 2013

Lo que nosotros vamos a realizar puede hacerse directamente desde el api sin utilizar ninguna librería pero esto implica tener un fuerte conocimiento sobre esta, para poder facilitar las cosas utilizaremos una librería orientada a java llamada Twitter4J también es compatible con Android y permite compatibilidad con OAuth, recomiendo que le den una lectura rapida a la documentacion de esta libreria.

Twitter utiliza OAuth para proveerle acceso al api a las aplicaciones externas, este mecanismo de autenticacion nos permite interactuar sin la necesidad de comprometer los datos del usuario como el usuario y clave.

mas info sobre  OAuth: http://es.wikipedia.org/wiki/OAuth

tambien ofrece algunos ejemplos sobre como acceder usando este protocolo. https://dev.twitter.com/docs/auth/using-oauth

Antes de empezar a ver el código necesitamos registrar nuestra aplicación para que pueda interactuar con el, podremos hacerlo desde aquí una vez ya logueados veremos una pantalla como esta:

Yo le puse de  nombre a mi aplicacion: sebas_tweet_test_android_app ustedes deben ingresar otro diferente.

El formulario es muy simple de completar pero hay 2 que pueden confundir.

Website: deberán colocar la dirección de la pagina web de la aplicación en donde el usuario podria descargarla, aunque si no tienen ninguna web pueden escribir lo que deseen no importa si existe o no.

Callback URL: Aqui pueden ingresar la direccion web a la cual nos retornara una vez de que la autenticacion con twitter alla sido exitosa. se puede dejar en blanco tambien.

una vez que halla completado el captcha y aceptado los termino clicken en “Create your Twitter application”.

Luego veran esta pantalla:

Como veran al comienzo muestra el nombre de la aplicación que registramos, la descripcion y la url que ingresamos en el campo website.

Deben ir a la solapa settings , veran que pueden moficar todos los datos que ingresaron antes, tambien pueden cambiar el icono de la aplicación deben dirigirse

a la sección Application Type y seleccionar Read and Write ya que la aplicación no sera de solo lectura, una vez actualizado los datos deben volver a la solapa details y tomar nota de los sig. valores que utilizaremos en la aplicacion, “Consumer key”,”Consumer secret”. Estas claves son las que usara nuestra aplicación de android para autenticarse con twitter. Luego terminaremos la registracion clickeando en “Create my access token”, con esto terminamos la parte del registro en twitter.

Ahora si manos a la obra.

Como siempre tendran el codigo disponible en el repositorio en github al final.

Ahora es el turno de descargar la librería Twitter4J que les comente al principio, al momento en que he escrito el tutorial la ultima version era la 2.2.6

para android pueden descargarla de aqui.(igual en el repositorio estara el proyecto de eclipse con la libreria ya incluida).

de lo que descargaron el archivo que deben buscar esta dentro de la carpeta lib llamado “twitter4j-core-android-2.2.6.jar”.

javadoc de la libreria aqui.

La version de android que he utlizado para hacer este tutorial es la 2.3.3.

he llamado al proyecto “Twitter_testapp”, si no van a usar el codigo del repositorio recuerden incluir la libreria antes de continuar

La estructura del proyecto es la siguiente, como veran luego de incluir la libreria deberia de quedar asi.

La aplicación sera muy simple, basicamente hara lo siguiente:

1- Al arrancar buscara en el shared preferences si existe el registro con las claves obtenidas de twitter, en caso de que NO abrira un webview que la primer vez que corramos la app nos pedira loguearnos en twitter para habilitar que la app pueda utilizar nuestra cuenta de twitter, luego descargara unas claves que guardara en el shared preferences para que la porxima vez que arraque pued ‘loguearse’ automaticamente.

2-Luego podremos escribir un tweet, al intentar enviarlo volvera a realizar la validacion previa, luego enviara el texto que hallamos escrito, en caso de sea exitoso el borde de la imagen del medio sera de color verde, si ocurrio algun fallo sera de color rojo.

3-Tambien hay un boton de Logoff que borrara los datos almacenados en el sharedpreferences.

Se vera de la siguiente forma:

Cuando el envio del tweet sea exitoso se vera de esta forma, podran observar que el borde la imagen del centro cambia de color.

En caso de error:

He creado dos clases auxiliares para facilitar el manejo del envio de tweets y el acceso al shared preferences ademas esta pueden ser reutilizadas para otros proyectos.

He creado una clase llamada “Constants_Settings”

Aquí he definido algunas constantes que usaremos en toda la app.

Deben modificar los siguientes valores por los obtenidos cuando registramos la aplicación en twitter.

OAUTH_CONSUMER_KEY =”Consumer key”

OAUTH_CONSUMER_KEY_SECRET=”Consumer key Secret”

En esta ocasion no hablare sobre los layouts y el archivo manifest ya que son muy simples, los pueden ver directamente en el repositorio.

Veremos primero la clase principal MainActivity.java leer comentarios en cada caso.

Les comentare basicamente lo que hacemosen esta clase:

En la linea 41 se crea una instancia a la clase TweetHelper a la cual le pasamos el context como parametro.

Luego en la 45 llamamos al metodo validar_login() que lo que hace es verificar si en el telefono estan almacenados los access token y acces token secret  en caso de que no llama al webview lineas 93 a 98

Intent i = new Intent(MainActivity.this, TwitterWebActivity.class);
i.putExtra(“URL”, tweet_hlp.get_AuthenticationURL());

en este pasa como parámetro la autenticationURL que seria la url callback que comente mas adelante , cuando el webview termina nos retorna el oauth_verifier del cual  en la linea 116 en onActivityResult 

tweet_hlp.Store_OAuth_verifier(oauthVerifier);

lo almacenamos en el telefono.

Luego tenemos el botón de envio de Tweets que volvera a llamar validar_login() descripto recien.

Tambien obtenemos el texto del campo de text

String texto = tweet_txt.getText().toString();

Luego hacemos uso del metodo Send_Tweet que retorna un boolean sobre si se envio o no el tweet

boolean twt_snd_status = tweet_hlp.Send_Tweet(texto);

Luego en base a la  respuesta mostramos un Toast y cambiamos la imagen mediante

tweet_imgstatus(1);

Luego esta el otro Boton LogOff que borra el contenido guardado en sharedpreferences.

Veamos rapidamente el webview  TwitterWebActivity.java

 Como veran no es nada del otro mundo recibe por parámetro URL y lo muestra. Luego retorna “oauth_verifier” como les comente mas arriba.

Ahora es el turno de la clase que he creado para facilitar el uso de twitter dentro del paquete com.cipolat.twitter_testapp.lib

TweetHelper.java

Lean los comentarios para cada caso: 

Como veran el constructor recibe por parametro el context que es necesario para la clase  Shar_Pref_Helper, tambien instanciamos esta clase y le pasamos como parametro el nombre con el que se almacenara el registro en el shared preferences y el contexto.

También al principio de la clase creamos unas variables que tomaran los datos de la clase Constants_Settings.

Luego en la linea 42 mpezamos a crear objeto para interactuar con twitter

twitter = new TwitterFactory().getInstance();

En la linea 46 le asignamos las claves para la autenticacion usando OAuth,estos estan en la clase mencionada previamente

twitter.setOAuthConsumer(OAUTH_CONSUMER_KEY, OAUTH_CONSUMER_SECRET);

Para poder enviar los tweets usamos la función Send_Tweet(String tweet_text) que recibe como parametro el text que queremos que envie, este retorna un valor booleano relacionado con el exito o no del emvio del tweet, esto es utilizado en la clase main para cambiar la imagen de estado.

Dentro Creamos el objeto configuracion necesario pasamos como parametros las claves consumer key and consumer Secret  y los accessToken y accessTokensecret para la autenticacion OAuth estos son extraidos del shared preferences por lo que antes de ejecutar esto es necesario realizar para verificar su existencia como hicimos anteriormente

Configuration conf = new ConfigurationBuilder()
.setOAuthConsumerKey(OAUTH_CONSUMER_KEY)
.setOAuthConsumerSecret(OAUTH_CONSUMER_SECRET)
.setOAuthAccessToken(accessToken)
.setOAuthAccessTokenSecret(accessTokenSecret).build();

Usamos lo seteado anteriormente para obtener una instancia para autenticacion OAuth.
Creamos nuevamente objeto para acceder a twitter, (podria haberse utilizado el creado anteriormente) al cual le asigamos el objeto configuracion con las claves para la autenticacion con twitter.
Twitter t = new TwitterFactory(conf).getInstance();

//Actualizamos estado, enviamos el twwet.
t.updateStatus(tweet_text);

Esto esta dentro de un bloque try cath para determinar si se envio el tweet ya que puede surgir la excepcion TwitterException.

Luego esta clase tiene otras funciones como Store_OAuth_verifier(String OAuth) que recibe como parámetro oauthVerifier del cual hablamos antes.

con el parametro recibido retorna un AccessToken

AccessToken at=twitter.getOAuthAccessToken(mRequestToken, OAuth);

del usaremos los metodo getToken y getTokenSecret para grabar estos datos dentro del telefono ya que seran necesario para el envio del tweet como vimos antes.

shrpref.Write_String(TW_ACCTOKEN, at.getToken());
shrpref.Write_String(TW_ACCTOKEN_SECRET, at.getTokenSecret());

Luego otro metodo  para comentar es verify_logindata() que retorna un valor booleano.

Basicamente accede al shared preferences y verifica si existen dentro del shared preferences los TW_ACCTOKEN_SECRET y TW_ACCTOKEN

(shrpref.isExist(TW_ACCTOKEN_SECRET en base al resultado devuelve el valor booleano.

 Consideraciones al momento de enviar tweets:

Como comente anteriormente a la hora de enviar un tweet o interactuar con twitter puede surgir la excepcion TwitterException recomiendo leer el api sobre esto.

Deben tener en cuenta de que no pueden enviar un tweet en blanco y que no pueden enviar un mismo mensaje repetidas veces sin un tiempo de espera son las mismas consideraciones que tienen en cuenta cuando usan twitter.

Los errores que muestra son de este tipo:

10-01 01:10:10.493: W/System.err(1630): 403:The request is understood, but it has been refused. An accompanying error message will explain why. This code is used when requests are being denied due to update limits (https://support.twitter.com/articles/15364-about-twitter-limits-update-api-dm-and-following).

Aclaro que no soy un experto en el uso de twitter con android, por lo que si alguno tiene mas conocimientos y considera que algo esta incorrecto sientase libre de usar el cuadro de comentarios como tambien si tienen alguna otra consulta o pregunta. 

Esto fue todo por hoy, espero que les halla gustado, hasta la proxima.!

Sebastian

¿Te gustó este tutorial? ¡Compártelo!

• Crear el socket servidor
• Aceptar un cliente
• Obtener los InputStream y/o OutputStream del cliente.
• Crear unos InputStream y/o OutputStream más adecuados a nuestras necesidades.
• Leer y escribir datos del y al cliente.
• Cerrar el socket.

En el servidor se crea un serversocket que tiene como parametro el numero de puerto este puede ser del 1 a 65535  del 1 a 1023 están reservados para servicios del sistema (SSH,SMTP, ftp, mail, www, telnet, etc…) Del 1024 en adelante podemos usarlos a nuestro gusto. Crear el socket servidor: El servidor crea un socket servidor que tiene como parámetro el puerto en el que a va estar escuchando las peticiones entrantes en mi caso he usado el 5555: ServerSocket skServidor = new ServerSocket(5555); Cada servidor debe usar un puerto diferente. Aceptar un cliente: Una vez creado el servidor, este espera conexiones de los cliente para eso llamamos al método accept(). Este método se queda bloqueado hasta que algún cliente se conecta. Nos devuelve un Socket, que es la conexión con dicho cliente. Socket skCliente = skServidor.accept();Un servidor puede manejar multiples conexion con cliente pero en este caso solamente manejara una.

Obtener el InputStream y/o OutputStream

Una vez que el cliente ya esta conectado, debemos  obtener de él el OuputStream o InputStream con los métodosgetOutputStream() o getInputStream(). La clase OutpuStream nos sirve para enviar datos.  InputStream nos sirve para leer los datos recibidos. InputStream input = skCliente.getIntputStream(); OutputStream output = skCliente.getOutputStream(); Estos metodos únicamente envían bytes. Si vamos a utilizar tipos de datos normales (enteros, String) podemos utilizar las clases DataInputStream y DataOutputStream. Estas clases tienen un constructor que admite unInputStream y un OutputStream respectivamente. DataInputStream inputdata = new DataInputStream (input); DataOuputStream outputdata = new DataOutputStream (output); Estas clases tienen sus propios metodos para escribir o leer. como writeInt(),writeFloat(), readInt(), etc. Para strings usaremos los métodos writeUTF() y readUTF(), que envían/leen las cadenas en formato UTF.

Lado Cliente: Para poder crear el socket usamos la clase ‘Socket’ ademas deberemos usar la Direccion IP del server y el puerto que empleara para la comunicacion Socket skCliente = new Socket (IP,PUERTO); IP debe ser u String y PUERTO un entero. Podemos ver todo esto en el sig. diagrama.

Tendrá unos campos al comienzo en donde deberemos ingresar la direccion ip del server y el puerto,unos leds que cambiaran de color segun el estado de la conexion y un texto en el medio que informara cuando halla un error, luego mas abajo hay un campo en el que le podemos enviar un texto al servidor y luego de bajo cuatro botones de acción a los cuales desde el servidor podremos asignarle que cada vez que se los pulse realizar en el server una accion diferente como ejecutar un script, abrir una aplicacion etc, con esto podriamos usar nuestro movil como un control remoto para la pc. Veremos primero el codigo de la aplicacion servidor. He utilizado Eclipse para escribir el codigo en el repositorio encontraran el codigo. El proyecto del servidor se llama SimpleServer-Socket He  creado una clase que se llama Mensaje_data por lo que los ‘mensajes’ que se enviaran seran de este tipo, esta clase estara presente en las 2 aplicaciones     Este tiene los siguiente atributos.

• Action :

llamare  mensaje de accion al mensaje que debe  tener en este atributo un valor difernte al -1 y estar comprendido entre 1 y 4. Cada valor tendra una accion especifica diferente, estos se definira mas abajo. last_msg debe ser false

• Texto:

Llamare mensaje de texto al mensaje que tenga de valor action -1 y en texto debera tener lo que se desea enviar al server. last_msg debe ser false.

• Ultimo mensaje:

Sera el mensaje que se envira para avisarle al servidor que debe cortar la conexion, se enviara al presionar desconectar. action=-1 texto=” ” last_msg=true Server.java Algunas aclaraciones, En el metodo Exec  podremos hacer varias cosas ejucar un script abrir un pdf, un HTML, recomiendo visitar los siguientes link1 , link2  para mayor comprension. En este caso al presionar el boton de accion 1 abrira VLC,  en el numero 2 Chrome y en el 3 una terminal esto lo he hecho usando linux, en este punto dependera del sistema operativo que esten utilizando, si no ponemos el path del ejecutable, el directorio en el que se encuentra debe estar en la variable de entorno PATH, si no, no sabrá dónde econtrar el ejecutable.   Ahora es el turno de la aplicacion para android, recomiendo leer el comentario en cada caso: Proyecto: Al  AndroidManifest.xml y al layout en  layout/main no los voy a mostrar pueden verlos directamente desde el repositorio. Sockettest.java Explicare el funcionamiento paso a paso comentando en cada lineas. Como habran  visto el funcionamiento es muy simple y no hay nada de mayor complejidad. para poder ejecutar el codigo java sin utilizar el eclipse deberan ejecutar desde su interprete de comandos segun el os que usen javac server.java y luego java server despues deberian ejecutar la app de android. Pueden ver un video sobre el funcionamiento de la aplicacion: Pueden descargar el codigo de este tutorial desde nuestro repositorio haciendo click en la imagen debajo. El proyecto de la aplicacion servidor se llama “SimpleServer-Socket” La aplicacion cliente “Socket-Client”

Con estos nuevos conocimiento se pueden hacer todo tipo de aplicaciones de diversos uso, hasta incluso si tienen conocimientos en electronica podria llegar a servirles para manipular circuitos desde su  telefono o hasta quien sabe incluso manejar un robot. En proximos tutoriales incluiremos una comunicacion bidireccional por lo que implementaremos en la app de android threads para manejar estos. Respecto de sockets en Java hay mucha informacion en internet, para armar este tutorial he utilizado los siguiente recursos, recomiendo que les hechen un  vistazo que son muy utiles: http://codigoprogramacion.com/java/103-sockets-en-java-con-cliente-y-servidor.html http://docs.oracle.com/javase/tutorial/networking/sockets/index.html http://casidiablo.net/java-socket-chat-basico/ http://www.chuidiang.com/java/sockets/socket.php http://mundogeek.net/archivos/2006/03/20/sockets-en-java/ http://www.helloandroid.com/tutorials/simple-connection-example-part-ii-tcp-communication http://docs.oracle.com/javase/tutorial/networking/sockets/readingWriting.html http://android-er.blogspot.com.ar/2011/01/simple-communication-using.html http://android-er.blogspot.com.ar/2011/01/implement-simple-socket-server-in.html http://adblogcat.com/ssl-sockets-android-and-server-using-a-certificate/Si alguno tiene experiencia en este tema y considera que en el tutorila hay algo incorrecto o no se entiende bien sientanse libre de usar el cuadro de comentarios de bajo al igual si tienen alguna consulta o sugerencia. Hasta el proximo tutorial! Sebastian.

¿Te gustó este tutorial? ¡Compártelo!

Hola de nuevo amigos de Androideity..!!
En mi post anterior les platique como permitir a una aplicación android relacionarse con facebook mediante single sign on, este post lo dedicare a mostrar como podemos agregar más permisos que facebook nos puede brindar a nuestra aplicación.

Cuando un usuario se autentifica en una aplicación de facebook, por default podemos acceder a la información básica del usuario, en caso de que deseemos acceder a más información o queramos publicar información en facebook, como publicaciones en nuestro muro o en el muro de alguien más, es necesario incluir permisos adicionales.

Un listado detallado de los permisos que la SDK de Facebook nos ofrece se puede ver en el siguiente link: http://developers.facebook.com/docs/authentication/permissions/

Solicitar estos permisos desde nuestra aplicación android es sencillo, la clase de Facebook, la cual se encuentra en su sdk, tiene el método de “authorize” en el cual le podemos enviar en un array de string los permisos que deseemos usar de facebook.

authorize(Activity activity, String[] permissions, final DialogListener listener)

Si no sabes como integrar la SDK de Facebook y/o relacionarla con tu aplicacion de Facebook, dale un vistazo a mi post anterior, el cual ya contiene un ejemplo de como hacerlo.

Como ejemplo, agregaré algunos permisos en el método de authorize:

Como podemos ver en el código, he agregado permisos para publicar, obtener la dirección de email, información sobre sus relaciones e información a saber si el usuario se encuentra online u offline.

Como resultado verán que cuando el usuario llegue a autorizar la aplicación, preguntara si acepta también que la aplicación acceda a los siguientes permisos.

Y así es como podemos jugar con los permisos de la SDK de Facebook en android.

Saludos.

Hola amigos de androideity, este post tiene la finalidad de explicar como implementar en Android un Single-Sing-On (SSO) con una aplicación de facebook, SSO es una manera de loggearse dentro de una aplicación por medio de la API de Facebook, sin tener que pedir el nombre de usuario y contraseña de una cuenta de facebook. Esto es posible en android si en el dispositivo se cuenta con la aplicación oficial de facebook, y esta tiene guardada una sesión de facebook, de lo contrario la API de facebook pedirá los datos de la sesión al usuario.

Comenzaremos creando una aplicación en facebook, lo cual podemos hacer en este link https://developers.facebook.com/apps

Les quedará algo así:

Para este ejemplo solo necesitamos asignarle nombre a nuestra aplicación, y fijarnos en la APPID que se muestra, ya que la utilizaremos en nuestro proyecto android, también podemos ver el check de NAtive Android App, el cual habilitaremos más adelante para lograr implementar SSO en android.

A continuación, descargamos la SDK oficial de Facebook para android, la cual esta en github: https://github.com/facebook/facebook-android-sdk

Una vez que tenemos la SDK de facebook, creamos nuestro proyecto android, en el cual incluiremos las clases del SDK de facebook, dejando la estructura como la siguiente manera:

Ahora pasaremos con nuestra clase main, en mi caso, le he cambiado el nombre a “FBConnectTestActivity”.

En esta creamos una nueva instancia de la clase Facebook, y en el constructor le pasaremos el ID de nuestra aplicación, y en el onCreate() de nuestra actividad, le daremos el authorize() a la instancia de Facebook para loggear al obtener un token de acceso a la aplicación de Facebook.

El metodo de authorize() nos regresa un DialogListener, en el cual cachamos si se obtuvieron los datos correctamente, si existieron errores o si se cancela la petición por medio de onComplete(), onFacebookError(), onError() y onCancel().

Adicionalmente, debemos de sobrecargar el metodo de onActivityResult() del Activity para cachar el callback de la clase de facebook.

Nuestra clase que de la siguiente manera:

Ahora debemos de habilitar en nuestra aplicación de Facebook el SSO, regresemos a nuestro aplicación en facebook, y habilitaremos la opción de Aplicación Android Nativa, y activemos el configurado para android SSO, y en el campo de Tecla de cuadrado Android agregaremos la firma de nuestra aplicación android, esta se obtiene por medio de la keytool de android en consola, si solo estamos haciendo pruebas, debemos hacer uso de la llave por default de android, la cual es la “debug.keystore”, si exportamos nuestro proyecto debemos de hacer uso del código generado por la llave con la que se firmo la apk. Más información de como obtener la firma de llaves de aplicaciones android en este link: http://developer.android.com/tools/publishing/app-signing.html

Una vez que tenemos nuestro codigo en la aplicación, guardamos los cambios.

Ahora podemos ejecutar nuestro proyecto android y ver como se muestra un Dialog el cual pide al usuario dar permisos de que esta aplicación acceda a su información de facebook.

El código completo del ejemplo lo puedes ver en: https://github.com/ChelixPreciado/androidsso

Saludos..