Desarrollando una app en Android Studio desde 0: #1 Login y Registro

En la entrada anterior, os expliqué la planificación que he tenido que hacer para mi aplicación, en esta entrada os mostraré cómo cree el login y el registro que utiliza Kinder.

Lo primero de todo es crear la base de datos basándonos en el esquema mencionado en la entrada anterior:

BD

Y cuando la generemos, la debemos subir a la web o a un servidor, si no tenéis, podéis descargaros Wamp o cualquier otro programa similar para hacer las pruebas necesarias.

Una vez generada la BD, y subida a nuestro servidor, deberemos programar distintos archivos PHP para poder acceder a la base de datos desde nuestra aplicación.

El más importante es el archivo de conexion.php, con el cual le estaremos dando acceso a nuestra base de datos:

<?php
$hostname = '';
$database = '';
$username = '';
$password = '';

$conexion = new mysqli($hostname,$username,$password,$database);
if($conexion->connect_error){
    echo "Error";
}
?>

(Obviamente por temas de seguridad he omitido los datos)

Registro php

Puede parecer difícil, pero si se piensa bien un registro no es más que el añadido de un nuevo usuario a la base de datos, un INSERT para ser más exactos.

Además, para hacerlo todo más seguro, deberemos encriptar los datos sensibles, cómo la contraseña:

<?php

include 'connexio.php';

$nom=$_POST['nom'];
$ape=$_POST['ape'];
$mail=$_POST['mail'];
$password=$_POST['Contraseña'];
$password= hash('sha512',$password);
$edat=$_POST['edat'];
$genero=$_POST['genero'];
$telefono=$_POST['telefono'];



$sentencia = $conexion->prepare("INSERT INTO usuarios (Nombre,Apellidos,Correo,Contraseña,Edat,Genero,Teléfono) VALUES (?,?,?,?,?,?,?)");
$sentencia->bind_param('sssssss',$nom,$ape,$mail,$password,$edat,$genero,$telefono);

if ($sentencia->execute()) {
  echo "creado";
}else{
  echo "error";
}
?>

Login php

Y para simplificar de nuevo las cosas, un login simplemente es un SELECT dónde miramos si existe un usuario con una contraseña concreta:

<?php

include 'connexio.php';

$correuUsuari=$_POST['Correo'];
$contrasenyaUsuari=$_POST['Contraseña'];


$contrasenyaUsuari= hash('sha512',$contrasenyaUsuari);

$sentencia = $conexion->prepare("SELECT IDUsuario,Nombre,Apellidos,Correo,Edat,Genero FROM usuarios WHERE Correo=? AND Contraseña=?");
$sentencia->bind_param('ss',$correuUsuari,$contrasenyaUsuari);
$sentencia->execute();


$resultado = $sentencia->get_result();

while ($columna = mysqli_fetch_array($resultado)){

        echo $columna[0].'#'.$columna[1].'#'.$columna[2].'#'.$columna[3].'#'.$columna[4].'#'.$columna[5].'#';

}

$sentencia->close();
$conexion-> close();

?>

En mi caso, si el SELECT tiene respuesta (es decir, si el usuario y la contraseña son correctos), hago que me la devuelva separada por ‘#’ para poder usarla después.

Estos archivos PHP, los ejecutaremos más tarde desde Android Studio.

Activity del login

Ya en el Android Studio, vamos a definir el Activity de login, yo he utilizado dos LinearLayout para poder ordenar los campos:

Activity Login
Activity Login

Cuyo XML es el siguiente:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/design_default_color_background">

    <LinearLayout
        android:layout_width="361dp"
        android:layout_height="469dp"
        android:layout_above="@id/input_group"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="25dp"
        android:layout_marginRight="25dp"
        android:layout_marginBottom="-1dp"
        android:gravity="center"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView6"
            android:layout_width="match_parent"
            android:layout_height="469dp"
            app:srcCompat="@mipmap/kinder_foreground" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/input_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="25dp"
        android:layout_marginRight="25dp"
        android:layout_marginBottom="50dp"
        android:gravity="center"
        android:orientation="vertical">

        <EditText
            android:id="@+id/et_correo_login"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
            android:hint="Correo Electrónico"
            android:inputType="textPersonName"
            android:padding="15dp" />

        <EditText
            android:id="@+id/et_contra"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
            android:hint="Contraseña"
            android:inputType="textPassword"
            android:padding="15dp" />

        <Button
            android:id="@+id/btn_login"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:text="Login"
            android:textAllCaps="false"
            android:textColor="@color/purple_200"
            android:textSize="17sp" />

        <Button
            android:id="@+id/btnRegistro"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:onClick="CambioPantalla"
            android:text="Registro" />

    </LinearLayout>

    <ProgressBar
        android:id="@+id/progress_bar_login"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:indeterminate="true"
        android:visibility="gone" />
</RelativeLayout>

Login Java

En el java, declaramos los botones y EditText necesarios, y ponemos el botón de login en escucha para que cuando sea pulsado, ejecute la función «validarUsuario», cómo parámetro para la función, deberemos añadir una URL que lleve al archivo php de login.

Dicha función, cojera el valor que hayamos escrito en los EditText del usuario y la contraseña, los enviará al archivo «login.php» que hemos definido anteriormente, y cuando tenga respuesta, añadirá los datos de dicha respuesta a una clase estática para así tener los datos del usuario siempre a mano. Una vez añadidos los datos, se abrirá la pantalla para añadir o modificar los filtros.

La función validar usuario es la siguiente:

public void validarUsuario(String URL){

        StringRequest stringRequest = new StringRequest(Request.Method.POST, URL, new Response.Listener<String>() {
            @Override
            public void onResponse(String response) {

                if(!response.isEmpty()){ //si l'usuari existeix

                    String usuarioSplit [] = response.split("#");
                    Usuario.setIDUsuario(usuarioSplit[0]);
                    Usuario.setNombre(usuarioSplit[1]);
                    Usuario.setApellidos(usuarioSplit[2]);
                    Usuario.setCorreo(usuarioSplit[3]);
                    Usuario.setCumple(usuarioSplit[4]);
                    Usuario.setGenero(usuarioSplit[5]);

                
                   Intent i = new Intent(getApplicationContext(),Filtros.class);
                    startActivity(i);
                    finish();

                }else{

                    Toast.makeText(Login.this,"Usuario o contraseña incorrectos",Toast.LENGTH_SHORT).show();
                }

            }
        }, new Response.ErrorListener() {
            @Override
            public void onErrorResponse(VolleyError volleyError) {


                String message = null;
                if (volleyError instanceof NetworkError) {
                    message = "No se puede conectar a Internet... ¡Compruebe su conexión!";
                } else if (volleyError instanceof ServerError) {
                    message = "No se pudo encontrar el servidor. Por favor, inténtalo de nuevo después de un tiempo.";
                    volleyError.printStackTrace(System.out);
                } else if (volleyError instanceof AuthFailureError) {
                    message = "No se puede conectar a Internet... ¡Compruebe su conexión!";
                } else if (volleyError instanceof ParseError) {
                    message = "¡Error de sintáxis! Por favor, inténtalo de nuevo después de un tiempo.";
                } else if (volleyError instanceof NoConnectionError) {
                    message = "No se puede conectar a Internet... ¡Compruebe su conexión!";
                } else if (volleyError instanceof TimeoutError) {
                    message = "¡El tiempo de conexión expiro! Por favor revise su conexion a internet.";
                }
                Toast.makeText(Login.this,message,Toast.LENGTH_SHORT).show();
            }
        }) {
            @Override
            protected Map<String, String> getParams() throws AuthFailureError {
                Map<String,String> parametros = new HashMap<String,String>();
                parametros.put("Correo", Correo.getText().toString());
                parametros.put("Contraseña",contra.getText().toString());
                return parametros;

            }
        };
equestQueue requestQueue = Volley.newRequestQueue(getApplicationContext());
requestQueue.add(stringRequest); 

    }

Además, añadimos una función para que cuando pulse el botón registro, se cambia la pantalla.

Activity Java

Activity Registro
Activity Registro

Java Registro

En el java del registro, utilizaremos el mismo tipo de función que en el login: llamamos la función con una URL hacia el archivo de registro.php, le añadimos los parámetros necesarios y esperamos una respuesta.

Antes de ejecutar la función, deberemos comprobar si las dos contraseñas escritas son iguales:

if(Contraseña.getText().toString().equals(Contraseña2.getText().toString())){
                    valCon = true;
                }else{
                    valCon = false;
                }
if(valCon == true){

                    validarUsuario("https://www.debianlu.com/Kinder/registro.php");
                }else{
                    Toast.makeText(Registro.this,"Las Contraseñas no coinciden",Toast.LENGTH_SHORT).show();
                }

Y también, para facilitar la entrada de la fecha de cumpleaños, añadiremos un calendario con estás líneas:

@RequiresApi(api = Build.VERSION_CODES.N)
    @Override
    public void onClick(View view) {
        int dia,mes,ano;

        if(view == Cumpleaños){
            final Calendar c = Calendar.getInstance();
            dia = c.get(Calendar.DAY_OF_MONTH);
            mes = c.get(Calendar.MONTH);
            ano = c.get(Calendar.YEAR);

            DatePickerDialog datePickerDialog = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener() {
                @Override
                public void onDateSet(DatePicker datePicker, int any, int mes, int dia) {
                    if(mes < 12){
                        mes = mes + 1;
                    }else if (mes == 12){
                        mes = 12;
                    }
                    Cumpleaños.setText(any+"-"+(mes+1)+"-"+dia);
                }
            },dia,mes,ano);
            datePickerDialog.show();
        }
    }
¡Sígueme y comparte en tus redes!

Deja un comentario

Twitter
Visit Us
Follow Me
INSTAGRAM
error: Contenido protegido!