1.- Prime nos vamos a https://console.firebase.google.com
2.- Damos click en añadir proyecto
3.- Agregamos el nombre del proyecto y damos click en continuar y seleccionamos el pais
4.- Damos click en crear proyecto
5.- Click en añade Firebase a tu aplicación de android.
6.- Colocamos el nombre del paquete para encontrarlo nos vamos a nuestro proyecto en el archivo MainActivity en la parte de arriba ejemplo:
package com.codigofacilito.mg.loginkotlin /*Este es el nombre del paquete copiamos y pegamos*/
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
}
7.- En apodo de la aplicación agregamos login 8.- Damos click en registrar la aplicación
9.- Descargamos el archivo google-services.json
ya que termino de descargar copiamos el archivo y nos vamos a nuestro proyecto en la parte de arriba de la estructura de nuestro proyecto la vamos a cambiar de android a project seleccionamos la carpeta app pegamos el archivo y damos click en ok, cambiamos la vista project a Android nuevamente.
10.- Regresamos a firebase console y damos clic en continuar 11.- Esta línea de código
classpath 'com.google.gms:google-services:4.3.2'
nos vamos a Gradle Scripts y pegamos la línea en el archivo build.gradle project en dependencies
dependencies {
classpath 'com.android.tools.build:gradle:3.4.1'
classpath 'com.google.gms:google-services:4.3.2'//Línea de código
classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
}
12.-la segunda línea
apply plugin: 'com.google.gms.google-services'
Nos vamos nuevamente a Gradle Scripts y pegamos la línea en el archivo build.gradle Module en dependencies debajo de dependencias también vamos agregar estas dos líneas para poder usar las clases de firebase en la autenticación y en la base de datos estas las vamos agregar en dependencies
implementation 'com.google.firebase:firebase-auth:18.0.0'
implementation 'com.google.firebase:firebase-database:18.0.0'
Las tres líneas deben de quedar de la siguiente manera
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
implementation 'androidx.appcompat:appcompat:1.1.0'
implementation 'androidx.core:core-ktx:1.1.0'
implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
implementation 'com.google.android.material:material:1.0.0'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'androidx.test:runner:1.2.0'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0'
//Librerias para usar las clases de firebase
implementation 'com.google.firebase:firebase-auth:18.0.0'
implementation 'com.google.firebase:firebase-database:18.0.0'
}
//usar los servicios de google services
apply plugin: 'com.google.gms.google-services'
13.- Damos click Sync Now que se encuentra en la esquina superior derecha.
14.- Regresamos a firebase console y damos click en finalizar.
15.- En la izquierda nos aparecerá el menú seleccionamos autenticación y después damos click en CONFIGURAR EL MÉTODO DE INICIO DE SESIÓN
16.- Seleccionamos correo electrónico y contraseña habilitamos y damos click en guardar.
17.- Seleccionamos database del menú y damos click en empezar
18.- Nos vamos a nuestro proyecto.
En nuestro proyecto primero vamos ahorrarnos unas lineas de codigos creando un estilo nos vamos a res/values/styles.xml abrimos el archivo y vamos agregar el siguiente:
<style name="viewCustom">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_margin">8dp</item>
</style>
Creando este estilo no nos llenaremos de líneas de código repitiendo el ancho, largo y margen si quieren agregar otros atributos en común sería perfecto ahorrarán más líneas.
Ahora vamos a abrir el siguiente archivo nos vamos a res/values/Strings.xml dentro de este agregaremos el siguiente código:
<string name="email">Correo</string>
<string name="password">Contraseña</string>
<string name="forgotPassword">Olvidaste tu contraseña?</string>
<string name="firstName">Nombre</string>
<string name="lastName">Apellido</string>
<string name="login">Iniciar sesión</string>
<string name="createAct">Crear cuenta</string>
En name agregamos el identificador del String y dentro de las etiquetas el texto que se visualizará al llamar el string con el id.
Ahora vamos abrir el siguiente archivo res/layout/activity_main.xml y creamos el siguiente diseño usando un LinearLayout con orientación vertical para que todos los elementos dentro de este se acomoden de esta manera:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:id="@+id/etEmail"
style="style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:hint="@string/email" <!-- En esta parte llamamos el string con el name que le asignamos -->
android:inputType="textEmailAddress" />
<EditText
android:id="@+id/etPassword"
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:hint="@string/password"<!-- En esta parte llamamos el string con el name que le asignamos -->
android:inputType="textPassword" />
<Button
android:id="@+id/btnLogin"
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:background="@color/colorPrimary"
android:text="@string/login"<!-- En esta parte llamamos el string con el name que le asignamos -->
android:textColor="@android:color/white"
android:textStyle="bold"
android:onClick="login"/> <!-- agregamos un nombre a nuestro onclick para poder ejecutarlo más adelante ->
<Button
android:id="@+id/create"
style="@style/viewCustom"
android:background="@color/colorPrimary"
android:text="@string/create"
android:textColor="@android:color/white"
android:textStyle="bold"
android:onClick="register"/><!-- Aquí creamos el método que llamaremos en la clase Main-->
<TextView
android:id="@+id/txtForgotPassword"
style="@style/viewCustom"
android:layout_below="@id/btnLogin"
android:onClick="forgotPassword"
android:gravity="center_horizontal"
android:text="@string/forgotPassword"
android:textSize="20sp" />
</LinearLayout>
Ya que tenemos nuestro diseño abrimos el archivo ** java/MainActivity** agregamos el siguiente código:
class MainActivity : AppCompatActivity() {
private val TAG = "LoginActivity"
//global variables
private var email by Delegates.notNull<String>()
private var password by Delegates.notNull<String>()
private lateinit var etEmail: EditText
private lateinit var etPassword: EditText
private lateinit var mProgressBar: ProgressDialog
//Creamos nuestra variable de autenticación firebase
private lateinit var mAuth: FirebaseAuth
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
initialise()
}
/*Creamos un método para inicializar nuestros elementos del diseño y la autenticación de firebase*/
private fun initialise() {
etEmail = findViewById(R.id.etEmail)
etPassword = findViewById(R.id.etPassword)
mProgressBar = ProgressDialog(this)
mAuth = FirebaseAuth.getInstance()
}
//Ahora vamos a Iniciar sesión con firebase es muy sencillo
private fun loginUser() {
//Obtenemos usuario y contraseña
email = etEmail.text.toString()
password = etPassword.text.toString()
//Verificamos que los campos no este vacios
if (!TextUtils.isEmpty(email) && !TextUtils.isEmpty(password)) {
//Mostramos el progressdialog
mProgressBar.setMessage("Registering User...")
mProgressBar.show()
//Iniciamos sesión con el método signIn y enviamos usuario y contraseña
mAuth.signInWithEmailAndPassword(email, password)
.addOnCompleteListener(this) {
//Verificamos que la tarea se ejecutó correctamente
task ->
if (task.isSuccessful) {
// Si se inició correctamente la sesión vamos a la vista Home de la aplicación
goHome() // Creamos nuestro método en la parte de abajo
} else {
// sino le avisamos el usuairo que orcurrio un problema
Toast.makeText(this, "Authentication failed.",
Toast.LENGTH_SHORT).show()
}
}
} else {
Toast.makeText(this, "Enter all details", Toast.LENGTH_SHORT).show()
}
}
private fun goHome() {
//Ocultamos el progress
mProgressBar.hide()
//Nos vamos a Home
val intent = Intent(this, HomeActivity::class.java)
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)
startActivity(intent)
}
/* Tenemos que crear nuestros métodos con el mismo nombre que le agregamos a nuestros botones en el atributo onclick y forzosamente tenemos que recibir un parámetro view para que sea reconocido como click de nuestro button ya que en view podemos modificar los atributos*/
/*Primero creamos nuestro evento login dentro de este llamamos nuestro método loginUser al dar click en el botón se iniciara sesión */
fun login(view: View) {
loginUser()
}
/*Si se olvido de la contraseña lo enviaremos en la siguiente actividad nos marcara error porque necesitamos crear la actividad*/
fun forgotPassword(view: View) {
startActivity(Intent(this,
ForgotPasswordActivity::class.java))
}
/*Si quiere registrarse lo enviaremos en la siguiente actividad nos marcara error porque necesitamos crear la actividad*/
fun register(view: View) {
startActivity(Intent(this, RegisterActivity::class.java))
}
}
Vamos a crear un nuevo archivo damos click derecho en la carpeta JAVA seleccionamos NEW/ACTIVITY/EMPTY ACTIVITY colocamos el nombre de RegisterActivity y damos click en finish, ahora nos vamos a res/layout/activity_register.xml en este archivos vamos a usar un LinearLayout con orientación vertical y agregaremos los campos que se necesitan para crear una cuenta:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="@+id/txtName"
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:hint="@string/firstName"
android:inputType="textPersonName" />
<EditText
android:id="@+id/txtLastName"
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:hint="@string/lastName"
android:inputType="textPersonName" />
<EditText
android:id="@+id/txtEmail"
style="@style/viewCustom"
android:hint="@string/email"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:inputType="textEmailAddress" />
<EditText
android:id="@+id/txtPassword"
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:hint="@string/password"
android:inputType="textPassword" />
<Button
style="@style/viewCustom"<!-- En esta parte llamamos el estilo que creamos anteriormente para ahorrarnos 3 líneas de código-->
android:onClick="register"
android:background="@color/colorAccent"
android:text="@string/createAct"
android:textColor="@android:color/white"
android:textStyle="bold" />
</LinearLayout>
Nos vamos a JAVA/RegisterActivity
class RegisterActivity : AppCompatActivity() {
private lateinit var txtName: EditText
private lateinit var txtLastName: EditText
private lateinit var txtEmail: EditText
private lateinit var txtPassword: EditText
private lateinit var progressBar: ProgressDialog
private lateinit var databaseReference: DatabaseReference
private lateinit var database: FirebaseDatabase
private lateinit var auth: FirebaseAuth
//global variables
private var firstName by Delegates.notNull<String>()
private var lastName by Delegates.notNull<String>()
private var email by Delegates.notNull<String>()
private var password by Delegates.notNull<String>()
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_register)
initialise()
}
/*Creamos un método para inicializar nuestros elementos del diseño y la autenticación y la base de datos de firebase*/
private fun initialise() {
//llamamos nuestras vista
txtName = findViewById(R.id.txtName)
txtLastName = findViewById(R.id.txtLastName)
txtEmail = findViewById(R.id.txtEmail)
txtPassword = findViewById(R.id.txtPassword)
//Creamos nuestro progressDialog
progressBar = ProgressDialog(this)
/*Creamos una instancia para guardar los datos del usuario en nuestra base de datos*/
database = FirebaseDatabase.getInstance()
/*Creamos una instancia para crear nuestra autenticación y guardar el usuario*/
auth = FirebaseAuth.getInstance()
/*reference nosotros leemos o escribimos en una ubicación específica la base de datos*/
databaseReference = database.reference.child("Users")
}
//Vamos a crear nuestro método para crear una nueva cuenta
private fun createNewAccount() {
//Obtenemos los datos de nuestras cajas de texto
firstName = txtName.text.toString()
lastName = txtLastName.text.toString()
email = txtEmail.text.toString()
password = txtPassword.text.toString()
//Verificamos que los campos estén llenos
if (!TextUtils.isEmpty(firstName) && !TextUtils.isEmpty(lastName)
&& !TextUtils.isEmpty(email) && !TextUtils.isEmpty(password)) {
/*Antes de iniciar nuestro registro bloqueamos la pantalla o también podemos usar una barra de proceso por lo que progressbar está obsoleto*/
progressBar.setMessage("Usuario registrado...")
progressBar.show()
//vamos a dar de alta el usuario con el correo y la contraseña
auth.createUserWithEmailAndPassword(email, password)
.addOnCompleteListener(this) {
//Si está en este método quiere decir que todo salio bien en la autenticación
/*Una vez que se dio de alta la cuenta vamos a dar de alta la información en la base de datos*/
/*Vamos a obtener el id del usuario con que accedio con currentUser*/
val user:FirebaseUser = auth.currentUser!!
//enviamos email de verificación a la cuenta del usuario
verifyEmail(user);
/*Damos de alta la información del usuario enviamos el la referencia para guardarlo en la base de datos de preferencia enviamos el id para que no se repita*/
val currentUserDb = databaseReference.child(user.uid)
//Agregamos el nombre y el apellido dentro de user/id/
currentUserDb.child("firstName").setValue(firstName)
currentUserDb.child("lastName").setValue(lastName)
//Por último nos vamos a la vista home
updateUserInfoAndGoHome()
}.addOnFailureListener{
// si el registro falla se mostrara este mensaje
Toast.makeText(this, "Error en la autenticación.",
Toast.LENGTH_SHORT).show()
}
} else {
Toast.makeText(this, "Llene todos los campos", Toast.LENGTH_SHORT).show()
}
}
//llamamos el método de crear cuenta en la accion registrar
fun register(view: View){
createNewAccount()
}
private fun updateUserInfoAndGoHome() {
//Nos vamos a la actividad home
val intent = Intent(this, HomeActivity::class.java)
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)
startActivity(intent)
//ocultamos el progress
progressBar.hide()
}
private fun verifyEmail(user: FirebaseUser) {
user.sendEmailVerification()
.addOnCompleteListener(this) {
//Verificamos que la tarea se realizó correctamente
task ->
if (task.isSuccessful) {
Toast.makeText(this,
"Email " + user.getEmail(),
Toast.LENGTH_SHORT).show()
} else {
Toast.makeText(this,
"Error al verificar el correo ",
Toast.LENGTH_SHORT).show()
}
}
}
}
Vamos a crear un nuevo archivo damos click derecho en la carpeta JAVA seleccionamos NEW/ACTIVITY/EMPTY ACTIVITY colocamos el nombre de ForgotPasswordActivity y damos click en finish, ahora nos vamos a res/layout/activity_forgot_password.xml en este archivos vamos a usar un LinearLayout con orientación vertical y agregaremos un campo y un botón:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:id="@+id/etEmail"
style="@style/viewCustom"
android:hint="Email"
android:inputType="textEmailAddress" />
<Button
android:id="@+id/btnSend"
style="@style/viewCustom"
android:background="@color/colorPrimary"
android:text="Enviar contraseña"
android:textColor="@android:color/white"
android:textStyle="bold" />
</LinearLayout>
Nos vamos a JAVA/ForgotPasswordActivity en este vamos a recuperar la contraseña del usuario solo con su correo
class ForgotPasswordActivity : AppCompatActivity() {
private var etEmail: EditText? = null
private var btnSend: Button? = null
//Firebase references
private var mAuth: FirebaseAuth? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_forgot_password)
initialise()
}
private fun initialise() {
etEmail = findViewById<View>(R.id.etEmail) as EditText
btnSend = findViewById<View>(R.id.btnSend) as Button
mAuth = FirebaseAuth.getInstance()
btnSend!!.setOnClickListener { sendPasswordResetEmail() }
}
private fun sendPasswordResetEmail() {
val email = etEmail?.text.toString()
if (!TextUtils.isEmpty(email)) {
mAuth!!
.sendPasswordResetEmail(email)
.addOnCompleteListener { task ->
if (task.isSuccessful) {
Toast.makeText(this, "Email Enviado", Toast.LENGTH_SHORT).show()
goMain()
} else {
Toast.makeText(this, "No se encontró el usuario con este correo", Toast.LENGTH_SHORT).show()
}
}
} else {
Toast.makeText(this, "Agregue el correo", Toast.LENGTH_SHORT).show()
}
}
private fun goMain() {
val intent = Intent(this, MainActivity::class.java)
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)
startActivity(intent)
}
}
Aqui esta el video donde se muestran los resultados del login Login en Android con Firebase usando Kotlin
Bootcamp Ciencia de Datos
12 semanas de formación intensiva en los conocimientos, fundamentos, y herramientas que necesitas para ser científico de datos
