viernes, 9 de junio de 2017

Tutorial
Trabajando con un Adaptador en Android

Introducción:
Dentro de Android tenemos un objeto llamado Adapter. Un adaptador se define como el puente entre los datos y la vista. El adaptador se encarga de tomar la vista y repetirla para cada colección de datos además de interactuar con los elementos que componen la vista.
Un claro ejemplo de donde podemos usar un adaptador, es cuando tenemos una colección de datos y la queremos mostrar como una lista de ítems en una activity. Pues bien es el adaptador, quienes nos ayuda a mostrar la colección en los ítems.

La colección de datos:
Antes de crear el adaptador, necesitamos saber que vamos a mostrar. En este caso vamos a trabajar con una lista de comentarios. Por tanto, necesitamos una clase que represente la información que manejamos.

La clase Comentario:

public class Comentario {
private String nombre, tema, comentario, fecha;
public Comentario(String nombre, String tema, String comentario, String fecha){
this.nombre = nombre;
this.tema = tema;
this.comentario = comentario;
this.fecha = fecha;
}
public String getFecha() {
return fecha;
}
public void setFecha(String fecha) {
this.fecha = fecha;
}
public void setNombre(String nombre){
this.nombre = nombre;
}
public void setTema(String tema){
this.tema = tema;
}
public void setComentario(String comentario){
this.comentario = comentario;
}
public String getNombre(){
return this.nombre;
}
public String getTema() {
return this.tema;
}
public String getComentario() {
return this.comentario
}
}

Ya tenemos nuestra clase, que manejara objetos tipo “Comentario”. Y es que como se verá más adelante, al adaptador le pasaremos un array de comentarios, que es lo que queremos mostrar en la lista de items.

Creando la vista:
Lo siguiente ahora es, necesitamos dos elementos para mostrar la colección. El primero es definir el item, que va ser un layout. Este layout tendrá lo que necesitemos para mostrar un objeto de nuestra colección, en nuestro caso tendrá lo necesario para mostrar un objeto de tipo comentario. Por supuesto podemos mostrar lo que queramos de dicho objeto. Una vez que tengamos hecho el “item”, lo siguiente es definir la activity en la que vamos a mostrar una lista de esos items. Lo podemos hacer, creando dentro de nuestra activity un ListView, o un GridView, o también un RecyclerView. Con estos dos elementos, ya tenemos listo lo necesario para mostrar nuestra lista de comentarios. Lo que nos queda es crear el adaptador, y hacer ese puente entre los datos y la vista.

Creando el adaptador:
El Adaptador tendrá dos elementos muy importantes. La primera es la lista de items. Estos items son de tipo “Comentario”. Y el otro elemento es, el referenciado a los distintos campos o objetos que tiene un item. Puesto que el adaptador va a “rellenar” cada item con la información, de los comentarios. A continuación, la clase que implementa un adaptador.

private class ComentarioAdapter extends RecyclerView.Adapter<ComentarioAdapter.ComentarioViewHolder> {
private List<Comentario> items;
private Context context;
public class ComentarioViewHolder extends RecyclerView.ViewHolder {
// Campos respectivos de un item
public TextView nombre, tema, comentario, fecha;
public ComentarioViewHolder(View v) {
super(v);
nombre = (TextView) v.findViewById(R.id.nombreText);
tema = (TextView) v.findViewById(R.id.temaText);
comentario = (TextView) v.findViewById(R.id.comentarioText);
fecha = (TextView) v.findViewById(R.id.fechaText);
}
}
public ComentarioAdapter(List<Comentario> items, Context context) {
this.items = items;
this.context = context;
}
@Override
public int getItemCount() {
return items.size();
}
@Override
public ComentarioViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
View v = LayoutInflater.from(context).inflate(R.layout.item, viewGroup, false);
return new ComentarioViewHolder(v);
}
@Override
public void onBindViewHolder(ComentarioViewHolder viewHolder, int i) {
viewHolder.nombre.setText(items.get(i).getNombre());
viewHolder.tema.setText(items.get(i).getTema());
viewHolder.comentario.setText(items.get(i).getComentario());
viewHolder.fecha.setText(items.get(i).getFecha());
}
}

Como se ha dicho antes, primero tenemos la lista de Comentarios, y el contexto. Por qué el adaptador necesita saber en qué activity estamos. ViewHolder Permite referenciar los elementos que componen un item, en nuestro ejemplo tenemos 4 TextView. En el constructor de la clase le pasaremos la lista de comentarios y el contexto.
El método getItemCount(), devuelve el tamaño de la lista. El siguiente método, se trata de “inflar” nuestra activity con los items. Es decir, en nuestra activity tenemos una lista de items. Pues bien, esos items van a ser el “layout item”, que hemos creado precisamente para cada item. De esta forma, nuestra activity tendrá en cada item, ese layout. Y por último mediante el ViewHolder vamos a establecer el texto a los TextView de cada item. De manera que se recorre toda la lista de Comentarios, y se va creando cada item. No es para nada complicado. Solo que como en todo, la primera vez, cuesta un poco entender las cosas. Con el adaptador implementado, ya estamos al 95%. Puesto que, ya nos queda solo hacer uso de
todo lo que llevamos hecho.

Usando el adaptador:
Nos situamos en el fichero java que haga referencia a la activity, donde vamos a mostrar la lista de items. Primero necesitamos información que mostrar, en este ejemplo, son los comentarios. Por tanto, vamos a crear varios comentarios. Para esto, hacemos uso de nuestra clase que hemos hecho para guardar comentarios.

private ArrayList<Comentario> comentarios;
comentarios.add(new Comentario(“nombre”, “tema,” “comentario”,”fecha”));

Ahora creamos el objeto Adaptador:

private ComentarioAdapter adapter;
adapter = new ComentarioAdapter(comentarios,getApplicationContext());

Ya solo falta, pasarle a la lista de la activity, el adaptador. Recordando, esta lista puede ser por ejemplo un RecyclerView.

private RecyclerView lista;
lista = (RecyclerView) findViewById(R.id.listaItems);
lista.setAdapter(adapter);


Pues, ya está, así de sencillo es el uso de un adaptador. Con un adaptador podemos personalizar el contenido que queramos en los items de una lista. Es una forma ordenada y muy práctica de poder hacer eso. Como siempre donde hay más información detallada es en la documentación oficial de Android. Donde se explica todos los elementos de la clase Adaptador.

martes, 6 de junio de 2017

Tutorial
¿Cómo hacer un registro de usuarios con una base de datos remota?

Introducción: 
Muchas aplicaciones necesitan un registro de usuarios para poder hacer un login. Cuando se está desarrollando una aplicación podemos en este caso utilizar para el registro de usuarios dos variantes sobre la base de datos. La primera es implementar la base de datos en local. Para ello podemos utilizar SQLite. Pero esto no es lo normal. Lo normal es que tengamos un servidor de base de datos dedicado, y al que nos conectamos de forma remota. Por tanto en este tutorial vamos a ver cómo conectarse con un servidor remotamente. Para ello vamos a utilizar una librería que nos permite hacer peticiones HTTP. Esta se llama Volley y en el siguiente enlace podemos ver que podemos hacer con esta librería:


Preparando nuestro proyecto:
Lo primero que debemos hacer es incluir nuestra librería dentro de nuestro proyecto. Para ello vamos a incluir la siguiente línea en el fichero build.gradle (Module: app):

compile 'com.android.volley:volley:1.0.0'

Con esta línea ya tenemos incluida la librería en nuestro proyecto, pero todavía no está todo listo. Hace falta sincronizar, nos aparecerá el siguiente mensaje y le damos a sincronizar. Una vez hecho esto ya estará listo todo para utilizarla.


Preparando el servidor:
Debemos elegir un hosting que nos permita crear base de datos. Necesitamos para cada acción que vayamos realizar sobre la base de datos crear scripts en PHP, para poder interactuar con ellos. Una vez que tengamos un servidor listo debemos de hacer un script en PHP para la conexión. Este, por ejemplo, lo vamos a llamar connect_db.php. Y que tenemos otro que por ejemplo hace el registro básico de un usuario, llamado alta_usuario.php.

Fichero connect_db.php

<?php
//Establecer conexion sobre la base de datos y seleccionar esta
$conexion = mysqli_connect('ip_servidor','root','pass') or die("No se puede conectar a la BD.");
mysqli_set_charset($conexion, 'utf8');
mysqli_select_db($conexion, "nombre_BD") or die("No se puede acceder a la BD.");
return $conexion;
?>

Fichero alta_usuario.php

<?php
//script para dar de alta un usuario
//Recibimos los datos del formulario
$nombre = $_POST['nombre'];
$email = $_POST['correo'];
$pass = $_POST['password'];
$con = require("connect_db.php"); //Abrir conexion con la base de datos
//Sentencia SQL
$query = "INSERT INTO usuarios (nombre,email,password) VALUES ('$nombre','$email','$pass')";
$query2 = "SELECT * FROM usuarios WHERE email='$email'";
$result = mysqli_query($con, $query2);
if($row = mysqli_fetch_array($result)){
echo "Ya hay un usuario registrado con el mismo email";
} else {
if (mysqli_query($con, $query)){
echo "Registrado Correctamente";
}
else{
echo "No se ha podido registrar";
}
}
// liberar la serie de resultados
mysqli_free_result($result);
//Cerrar la conexion
mysqli_close($con);
?>

Creando la activity:
Creamos la activity con: 3 EditText y un Button. En el fichero Java de la activity, recogemos los 4 elementos dichos anteriormente. Creamos una función por ejemplo llamada registrarUsuario(). Esta función la llamaremos desde el onClick() del botón.

Función registrarUsuario()

private void registrarUsuario(){
final String username = user.getText().toString().trim();
final String email = ema.getText().toString().trim();
final String password = pass.getText().toString().trim();
final String REGISTER_URL = htttp://www.miservidor.com/alta_usuario.php;
if (username.equals("") || email.equals("") || password.equals("")){
Toast.makeText(getApplicationContext(), "Algún campo está vacio", Toast.LENGTH_LONG).show();
Intent intent = new Intent(getApplicationContext(), RegisterActivity.class);
finish();
startActivity(intent);
} else {
StringRequest stringRequest = new StringRequest(Request.Method.POST, REGISTER_URL,
new Response.Listener<String>() {
@Override
public void onResponse(String response) {
Toast.makeText(getApplicationContext(), response, Toast.LENGTH_LONG).show();
}
},
new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
Toast.makeText(getApplicationContext(), "No hay conexion", Toast.LENGTH_LONG).show();
}
}) {
@Override
protected Map<String, String> getParams() {
Map<String, String> params = new HashMap<String, String>();
params.put("nombre", username);
params.put("correo", email);
params.put("password", password);
return params;
}
};
RequestQueue requestQueue = Volley.newRequestQueue(this);
requestQueue.add(stringRequest);
}
}

En primer lugar extraemos el contenido de los EditText con el método toString(). Definimos al principio de la función, una variable para guardar la url. Esta url es la de nuestro servidor llamando al script de registro. En nuestro ejemplo: htttp://www.miservidor.com/alta_usuario.php

Con una sentencia condicional vemos si los campos están vacíos. Si algún campo está vacío se le manda un mensaje al usuario y se le manada de nuevo a la activity de registro. Si todos los campos contienen valores entonces creamos un StringRequest. Como vemos en la función, debemos definir si los datos los vamos a pasar con el método GET o POST. La url, y dos llamadas a Response. La primera es para gestionar la respuesta correcta del servidor. Es decir, lo que queramos hacer si la acción en el servidor se ha hecho correctamente lo colocamos dentro de esta llamada. La otra, como se puede apreciar, para que hacer en caso de que el servidor devuelve error.

getParams(), este método como se puede ver crea un map con pares clave/valor. Pues bien, este map es el que se le “envía” al script en PHP. Los nombres de las variables que reciben el valor en el script deben de ser los mismos nombres clave del map. Por último, le decimos a Volley que ejecute el StringRequest. Y por último si queremos que haga alguna acción después de esta función. Pues lo incluimos en el método del botón.

Con esto ya tenemos hecho un registro de usuarios básico con una base de datos remota. Cuando hagamos test, veremos que cuando el móvil no tiene conexión a internet veremos un mensaje de Volley diciendo que no hay conexión. Siempre hay que tener claro, qué nombres hay en los campos de la base de datos y en el script. Para no tener problemas.

Tutorial Trabajando con un Adaptador en Android Introducción: Dentro de Android tenemos un objeto llamado Adapter. Un adaptador se de...