Armando Picón
Posted on September 30, 2019
Este es el tercer artículo que escribo sobre Kotlin y el segundo relacionado directamente a cómo crear una aplicación con Kotlin, hoy toca ver cómo implementamos una lista simple con este lenguaje. Si quieres leer los artículos anteriores, te los listo a continuación:
- Android — Aprendiendo Kotlin para desarrollar Android apps. En este doy algunas razones por las que debemos aprender Kotlin.
- Android — Primeros Pasos con Kotlin (aka. Hola Mundo). En este generamos el proyecto base.
Hablemos un poco sobre los conceptos
Para entender un poco el manejo de listas está bien hacer mención de algunos conceptos y componentes que intervienen en esta solución:
- RecyclerView : Es el componente que nos permite crear listas, a diferencia del antiguo componente ListView, este es más flexible y menos costoso a nivel de rendimiento.
- Adapter : Este componente es una clara representación del patrón Adapter que nos permite unir dos elementos completamente diferentes (como en el caso del RecyclerView, el layout de cada item y una lista de objetos). Dentro de este componente se define qué pasará al obtener un elemento, inflar el layout y enlazarlo con cada elemento de la lista.
- ViewHolder : también proviene de un patrón y sirve para almacenar los datos de cada item definiendo qué valor irá en cada elemento de nuestro layout.
- LayoutManager : este componente nos permitirá definir la manera en que se mostrarán los elementos en el RecyclerView ya sea de forma lineal (LinearLayout) o como una grilla (GridLayout).
Agregando dependencias
Dado que trabajaremos con un RecyclerView, necesitaremos agregar la dependencia correspondiente. Toma nota que para manejar la versión estoy haciendo uso de propiedades extras para refactorizar las versiones comunes de las dependencias. Adicionalmente, agregaré la dependencia para el uso de Anko , una biblioteca de código muy interesante que trae consigo un buen número de funciones que nos permitirá simplificar líneas de código.
Armando el layout
Una vez configurada la dependencia, ahora vamos a realizar algunas modificaciones en nuestro archivo main_layout.xml; primero, cambiaremos el LinearLayout por FrameLayout y, a continuación, remplazaremos el TextView que teníamos inicialmente por la etiqueta correspondiente a RecyclerView.
Creando nuestro adaptador
Vamos a crear nuestro adaptador, para ello crearemos una clase siguiendo los pasos que seguimos en el artículo anterior. Para este ejemplo la estoy llamando MyAdapter.
Ahora vamos a crear nuestro ViewHolder, para ello creamos una clase dentro de nuestro adaptador con el ingenioso nombre de ViewHolder, al cual le crearemos un constructor primario que reciba un objeto del tipo TextView. Luego, haremos que extienda de la clase ViewHolder correspondiente al RecyclerView; en este punto estaremos enviando el objeto TextView al constructor de la clase de la que extendemos. Todo esto en una sola línea.
Habiendo armado nuestro ViewHolder, es tiempo de completar la implementación de nuestro adaptador. Para ello declararemos un constructor primario que reciba una lista de objetos del tipo String y haremos que extienda de la clase Adapter correspondiente al RecyclerView. Debido a que Adapter es una clase abstracta deberemos implementar cada uno de sus métodos (o funciones en este caso).
Ahora pasaremos a implementar cada una de las funciones, empezando por la función getItemCount, su implementación es sencilla:
Ahora, como tenemos una función con una sola línea, la podemos simplificar de esta manera, con lo que simplificaremos algunas líneas:
Terminando la implementación de las funciones restantes, nuestro adaptador debería quedar de esta forma, algo que me gustaría recalcar es que cuando hacemos la invocación a un atributo de una clase implícitamente Kotlin llama a las funciones get() o set() según la situación, como pueden apreciar en las líneas en las que hacemos el bind entre la lista y el atributo text del TextView, y al obtener el tamaño de la lista por medio del atributo size.
Programando nuestro MainActivity
Vamos a cambiar un poco el activity que creamos en el artículo anterior. En esta ocasión, primero, obtendremos la referencia a nuestro elemento RecyclerView por medio del uso de una de las funciones que trae Anko llamada find (adiós findViewById). Para finalizar, establecemos el manejador de layouts y el adaptador correspondientes.
Y así es como debería lucir nuestras aplicación:
Antes de Finalizar
En los artículos anteriores hablamos un poco sobre la simplicidad del código en Kotlin y el hacer más por menos, y me parece que hasta aquí ya podemos ver lo simple que resulta desarrollar una aplicación android simple. En los próximos artículos llevaremos esta aplicación a consumir algunos servicios lo cual nos llevará a aprender algunas cosas nuevas.
Si desean ver el código de este proyecto base lo podrán encontrar en su respectivo repositorio en Github.
Referencias
- Anko
- Classes and Inheritance — Kotlin Programming Language (en inglés)
- Android Developers |Reference — RecylcerView.Adapater
- Android Developers | Creating List and Cards
- Gradle | ExtraPropertiesExtension
- Gradle Forum | Dynamic properties and dependencies version
Posted on September 30, 2019
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.