SlidingMenu And ViewPager en Android.

Hace algún tiempo que me rondaba en la cabeza juntar dos de los elementos más destacables en cuanto a interacción con el usuario se refiere, estos son el ViewPager y el menú lateral o SlidingMenu.

Todos hemos visto y usado (supongo que si habréis llegado hasta aquí es por algo) estos dos elementos. Por ejemplo, el SlidingMenu se puede encontrar en apps tan conocidas como Youtube, Google+, Facebook o Evernote. Aquí un ejemplo:

Y también supongo que todos que todos habremos o al menos visto alguna vez el ViewPager, que podemos encontrar en múltiples apps como TweekDeck, o incluso las de Androjuegos y Androtalk ( ).

La pregunta que me hice era tan simple como:

¿Por qué no hay ninguna app que implemente tanto el ViewPager como el SlidingMenu?

Lo primero que pensé fue que no habría ninguna librería buena para implementar el SlidingMenu (hace algunos meses, cuando lo vi por primera vez, estuve investigando y no encontré ninguna buena) pero obviamente, y como era de esperar, no es así, pues Googleando un poco te encontrarás con un genial proyecto en GitHub que nos ofrece una implementación que funciona a las mil maravillas y que podemos encontrar en apps como Plume o Falcon Pro.

Así que hace un par de semanas, en una tarde libre, me puse a idear una demo que implementase tanto el ViewPager como el SlidingMenu. Para ello tomé como base el ejemplo que puedes encontrar en la web de desarrolladores Android de Google, de nombre EffectiveNavigation y que personalmente recomiendo porque nos ofrece un ejemplo sencillo de como funciona el ViewPager, y el proyecto de ejemplo que viene junto a la librería de SlidingMenu.

Además, ya que me puse, lo hice compatible para Android 2.2 o superior. Supongo que funcionará en versiones anteriores sin ningún problema, pero la cuota de mercado de 2.1 o menor es tan mínima que no pensé que fuese necesario. Pese a ello, si quieres probarlo, únicamente tienes que cambiar en el Manifest la versión mínima del SDK.

Finalmente, el resultado fue el proyecto que subí a GitHub, de nombre SlidingMenuAndViewPager. Para que todo funcione correctamente, tienes que importar ActionbarSherlock y SlidingMenu. Además, en SlidingMenu deberás cambiar algunas clases, haciendo que éstas extiendan de Sherlock____Activity (SherlockActivity, SherlockFragmentActivity…) en lugar de ___Activity.

Hecho esto, el proyecto no debería dar ningún error, y tendréis un ejemplo de como usar ambas cosas en vuestras aplicaciones.

Si queréis ver un vídeo con la funcionalidad, aquí está disponible.

Sé que no he escrito nada de código en esta entrada, he considerado que no era necesario, pero pese a ello, si alguien tiene alguna duda, o no le funciona algo, que no dude en comentar y estaré encantado de ayudar.

 

 

 

Mis dos primeras aplicaciones en Google Play

Sé que tengo un poco (bastante) abandonado el blog, pero tampoco he encontrado nada de lo que escribir (aunque tengo en mente un par de entradas, a ver si saco algo de tiempo).

Lo que hoy os traigo no es un nuevo artículo sobre como usar alguna librería para Android, y, pese a que escribo esto con algo de retraso, ya se encuentran mis dos primeras aplicaciones en Google Play, estando disponibles desde principios de septiembre.

Estas aplicaciones son para dos blogs con los cuales colaboro, escribiendo alguna que otra entrada de vez en cuando (aunque también tengo algo abandonados esos…), y son Androjuegos y Androtalk.

Tampoco me voy a entretener mucho explicando en que consiste la aplicación, prefiero que la descarguéis y la probéis por vosotros mismos.

Pero la finalidad de esta entrada no es presentar las aplicaciones, ahora entráis en juego vosotros, y si queréis que explique como funciona alguna de las partes de la aplicación (Lista lateral, ViewPager, ActionBar Sherlock… ) haré un artículo sobre ello.

Espero vuestros comentarios, ¡¡y descargad las aplicaciones!!

Androtalk

 

 

 

Androjuegos

 

Pull to refresh en Android. Cargar los datos en un ListView nunca será igual después de esto.

Siguiendo los pasos de otros artículos, hoy os presento una funcionalidad que cuanto menos, es vistosa a la hora de recargar datos en un ListView. Sí, hablo del pull to refresh. 

Pull to refresh, tal y como su nombre indica, nos permite tirar para refrescar, o lo que es lo mismo, tirar hacia abajo la parte superior de un ListView para recargar su contenido. Esta funcionalidad es utilizada por aplicaciones como Twitter.

Pero bueno, vamos al lío, que es para lo que estamos.

¡¡DAME CÓDIGO!!

1. Importando la librería

Lo primero que tenemos que hacer es descargarnos la librería desde el repositorio de GitHub del autor. Una vez hecho esto, importamos la carpeta libraryproject en nuestro Workspace como si de un proyecto normal se tratase, para ello, situamos el cursor en la zona del Package Explorer, pulsamos el botón derecho > Import > Existing Projects into Workspace y en la opciónSelect Root directory ponemos la ruta de la carpeta que contiene la librería, en este caso libraryproject .

NOTA: Es aconsejable poner la carpeta libraryproject en nuestro Workspace, ya que así la tendremos localizada.

2. Usando la librería en nuestro proyecto

El segundo paso es añadirla a nuestro proyecto, para lo cual debemos pulsar el botón secundario sobre la carpeta de nuestro proyecto en Eclipse > Properties , se nos abrirá una ventana con unas opciones en el lateral derecho, debemos seleccionar Android, bajar hasta el final, y en Library > Add > libraryproject > Ok.

Ya habremos añadido la librería a nuestro proyecto, así que es el momento de empezar a usarla.

3. ¡Dame más, dame más!

Ahora que lo tenemos todo preparado, podemos ponernos manos a la obra. Para ello, lo primero que tenemos que hacer es crear nuestro layout para asignarlo en nuestra activity con el ListView. Pero no tenemos que usar un ListView normal, nuestro ListView quedaría así:

<eu.erikw.PullToRefreshListView
        android:id="@+id/listView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

Ahora en nuesto Activity tendremos que declarar el ListView, pero tampoco lo podemos hacer como si fuese un ListView por defecto:

PullToRefreshListView lView = (PullToRefreshListView) findViewById(R.id.listView);

Y ya podremos usar nuestro ListView normalmente, y asignarles los datos que deseemos tal y como se hace en los ListView por defecto.

4. Actualizando los datos

Para actualizar los datos simplemente tenemos que implementar el siguiente método.

listView.setOnRefreshListener(new OnRefreshListener() {

    @Override
    public void onRefresh() {
        // Tu código para recargar los datos

        // ...

        // Asegurate de llamar a listView.onRefreshComplete()

        listView.onRefreshComplete();
    }
});

Y ya está, ya tendremos el pull to refresh implementado en nuestra aplicación.

Si tienes alguna duda, pregunta

 

La importancia del Software Libre.

Recuerdo que hace tiempo leí una frase que decía algo así como:

Si los arquitectos pueden ir a un edificio y observar cómo está construido, fijarse en los detalles, y aprender; un desarrollador debería poder mirar el código de los demás desarrolladores para mejorar sus habilidades y conocimientos, al igual que lo hace el arquitecto.

Bueno, no sé si la frase era exactamente así, pero sí la idea que se intenta transmitir.

El Software Libre (para quien no sepa lo que es, no os voy a aburrir y mejor os pongo el enlace a Wikipedia) proporciona a los desarrolladores un modo de aprender nuevas maneras de hacer las cosas, o simplemente maneras de hacer las cosas.

Este post viene a raíz de que, recientemente, un proyecto Open Source me ha ayudado. ¿Qué cómo? Sigue leyendo…

Como más de uno sabrá, estoy aprendiendo a programar, para Android principalmente, y en una aplicación necesitaba el uso de las bases de datos. Android utiliza para las bases de datos SQLite, y tras ver varios tutoriales de cómo hacer una base de datos, con sus tablitas y todo, solo una cosa me quedó clara, y es que era un coñazo era algo extraño para alguien que nunca ha estado en contacto con SQL y sus bases de datos.

Buscando alternativas me recomendaron usar una librería llamada Android DataFramework que facilita el trabajo con las bases de datos.

A resumidas cuentas, Android DataFramework te permite hacer las tablas de tu base en XML, y la creación, borrado y modificación de registros se puede hacer de una manera sencilla.

Pero, ¿qué tiene todo esto que ver con el Software Libre y conmigo? Muy sencillo, el creador de esta librería (@JavieLinux) la usa en sus aplicaciones, y algunas de ellas (no sé si todas, no me he parado a mirarlo) están en GitHub, disponibles para todo aquel que quiera mirar el código. Entre líneas y lineas que no he logrado entender, tras navegar por casi todas las clases de AndAndo, y con el uso de Ctrl + F  para encontrar la instancia de la clase que estaba buscando y lo relacionado con ella, por fin he logrado entender un poco mejor como funciona Android DataFramework, y lo más importante, hacer que funcione en mi aplicación. (Bueno, he conseguido que funcione una cosa muy sencilla, qué soy un poco malo programando )

Esta es la verdadera importancia del Software Libre, el conseguir que gente con ganas e ilusión pueda aprender y mejorar su código.

¿Qué no se consigue nada a cambio? Bueno, depende de como lo mires, puede que no se consiga nada material, pero ahora mismo, para mí, JavieLinux es un ejemplo a seguir dentro del mundo del desarrollo, porque él, aunque sin saberlo, me ha ayudado.

 

Nueva aventura. Omicrono

Tal y como dice el título del post, hoy he comenzado una nueva aventura, por llamarlo de alguna manera. A partir de hoy soy colaborador en Omicrono.

Omicrono es un blog de temática variada, en el que se tratan las temas científicos y tecnológicos (más centrado en la tecnología).

Puede que a alguno de vosotros no os suene este blog, pero si os digo que es el blog hermano de El Androide Libre, ¿os suena un poco más?

Si seguís perdidos, este último que os he nombrado ganó el premio bitácoras en 2010.

Obviamente, Omicrono no llega a ser tan grande como El Androide Libre, pero también es un blog muy visitado, y, quien sabe, a lo mejor dentro de un tiempo me veis escribiendo también en El Androide Libre .

Así que ya sabéis, ahora mismo todos a visitar Omicrono y Androtalk, y a leer todos mis artículos, ¡vamos!

 

Personalizando un poco Eclipse, o cómo sentirte bien mientras picas código.

Imagino que a estas alturas de la película, todos conoceremos Eclipse, uno de los mejores IDEs de programación que existen, y el oficial a la hora de desarrollara para Android.

También imagino, que, si sois programadores o estáis aprendiendo, os pasaréis mucho tiempo delante de la pantalla del ordenador, así que, al menos yo, intento estar lo más cómodo posible con las herramientas que utilizo durante ese tiempo.

Cambiar el tema por defecto de Eclipse

Una de las cosas que siempre he querido cambiar, ha sido el tema por defecto que trae Eclipse, ya que, aunque es cómodo y bonito a la hora de visualizar el código, no terminaba de convencerme, así que investigué un poco y me encontré con la web de eclipsecolorthemes, la cual nos proporciona un plugin para Eclipse que nos permite cambiar fácilmente entre los temas que tengamos.

Para su instalación, desde Eclipse, vamos a Help > Install new software… e instalamos el plugin desde http://eclipse-color-theme.github.com/update

Tras hacer esto, yendo a Window > Preferences > General > Appereance >Color Theme podremos ver los temas disponibles y elegir el que más nos guste. Pero aquí no acaba la cosa, si os sigue ocurriendo como a mí, que ningún tema se adapta a vuestras necesidades, siempre podéis volver a la página de eclipsecolorthemes y descargar más temas.

A primera vista, este es uno de los temas que más me han gustado. http://www.eclipsecolorthemes.org/?view=theme&id=1882

Para ello, nos descargamos el archivo .xml, y desde Window > Preferences > General > Appereance >Color Theme presionamos sobre Import a theme… y le indicamos el archivo que acabamos de descargar. Fácil, ¿no?

Eclispe a pantalla completa

En otros IDEs como Netbeans, la opción de usar toda la pantalla está disponible, pero en Eclipse no es así. Aunque claro, para ello hay una gran comunidad detrás que nos aporta todas estas mejoras.

Para activar el modo de pantalla completa, simplemente tenemos que descargar el plugin desde aquí. Obtendremos un archivo .jar que tendremos que copiar en el directorio plugins de la carpeta donde tengamos instalado Eclipse. La próxima vez que lo iniciemos, presionando Ctrl + Alt + Z o yendo a Window > Full Screen se nos activará.

Así da gusto picar código, ¿eh?

 

ListView ampliable en Android.

¡Nueva entrega de Programando con Alexrs95! Hoy… ListView.

Uno de los elementos básicos en cualquier aplicación para Android es un ListView. Un ListView es simplemente una lista, en la que podemos interactuar con los elementos que contiene cuando pulsamos sobre ellos, lanzando Intents, o muchas otras cosas.

Hoy vamos a aprender a crear un ListView que podamos ir rellenando nosotros mismos con los datos que vayamos introduciendo en un EditText en nuestra aplicación, así que… ¡al lío!

Requisitos

• Eclipse u otro IDE similar.
• Android SDK.
• Conocimientos básicos de Java.
• Conocimientos básicos de programación para Android.
• Ganas de aprender.

1. main.xml

Lo primero que tenemos que hacer es crear un nuevo proyecto Android, algo que, si has llegado hasta aquí, supongo que sabrás. Yo lo he llamado ListViewAmpliable.

A continuación, en nuestro main.xml añadimos un EditText, para introducir los daros que queramos mostrar en nuestro ListView, un Button, y, por supuesto, un ListView.

Mi main ha quedado de la siguiente manera, aunque vosotros podréis ponerlo a vuestro gusto.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:padding="10dp" >

    <EditText
        android:id="@+id/etDatos"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Introduce los datos" />
    <Button 
        android:text="¡Agregar!"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btAgregar"/>

    <ListView
        android:id="@+id/lvDatos"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >
    </ListView>
</LinearLayout>
 

Hasta aquí sencillo, ¿verdad?.

2. Activity principal.

Comenzamos declarando los elementos del Layout, de la siguiente manera:

public class ListViewAmpliableActivity extends Activity {
    Button btAdd;
    ListView lvDatos;
    EditText etDatos;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        btAdd = (Button) findViewById(R.id.btAgregar);
        lvDatos = (ListView) findViewById(R.id.lvDatos);
        etDatos = (EditText) findViewById(R.id.etDatos);

Vosotros podéis darle el nombre que queráis a vuestros elementos, claro está.
A continuación, tenemos que crear un objeto ArrayList que va a ir almacenando los datos que vayamos introduciendo en nuestro EditText.

final ArrayList mLista = new ArrayList();

Después, vamos a crear un Adapter y se lo asignamos a nuestro ListView, como indico a continuación:

 final ArrayAdapter mAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, mLista);
 lvDatos.setAdapter(mAdapter);

Por último, asignamos una función al botón, cuando lo presionamos, que va a ser el mostrar el String que introducimos en el EditText:

 btAdd.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				mLista.add(etDatos.getText().toString());
             //Aquí le decimos al adapter que notifique los cambios
				mAdapter.notifyDataSetChanged();
             //Borramos el contenido del EditText
				etDatos.setText("");

			}
		});

Podéis descargar el proyecto desde aquí.
Y ya está, ya lo tenemos. Ahora podemos ejecutar la aplicación y comprobar el resultado.
Si tenéis alguna duda, preguntad.