Mi Taxi 031021
Mi Taxi 031021
Mi Taxi 031021
Nosotos vamosa cosntrir la aplicación del cliente , endonde puede solictar el taxi, tipo uber , va a ver el
map, se puedan buscar direcciones , se pueda buscar la dirección y vamos a agregar una petición,
consumir un servicio ya hecho y vasmoa enviar una petición del taxi , se le va a otrogar un taxi y se va
simular q el taxista está yendo a recogerte , simple, nada más , hasta q llegue a tu posición y ahí va a
quedar porque nos demoraríamos más de lo q dura ekl curso
ES MPORTANTE VERIFICAR Q EL EMULADOR CUENTA CON PLAY STORE , POR ENDE VA A contar con los
servicios de google
1. CAPITULO 1 INTRODUCCIÓN
12.
13.
14.
16.
17.
20.
21. Aquí nos muestra q podemos añadir firebase a un proyecto ya sea de IOs , Android o web ,
elegimos Android
22. Lo primero q nos va apedir es el nombre del paquete cuando creamos nuestra aplicación
23.
24. Para obtener el paquete nos vamos Android studio y hacemos anticilic sobre algún paquete y
26. Y lo pegamos
27.
28. Para esto abrimos en la parte superior izquierda el panel gradle y desplegamos el projecto y le
34.
37. Lo que debemos hacder a continuación es pegar el archivo en la carpeta app de nuestro
oproyecto
38. Para pegarlo de una manera más correcta es cambiar la mlodalidad q visualizamos el proyecto y
39.
40.
41.
42.
45. Mucho cuidado si Android srudio le mdoifica el nom,bre , siempre se debe de llamar google-
services.json
66.
67. También necesitamos un plugin de google services (Android Application ya existe arriba)
68.
69. Agregamos el plugin al final y prsionamos sync para actualizar las dpendencias
70.
73. El último paso es ejecutar la aplicación en el emulador para ver si se conectó exitosamente
74.
75. Modificamos en la parte superior , ya q lo ultimo q ejeuctamos fue signinreport lo cambio a app
76.
78.
79. Presionamos ir a la consola
81.
83. VAmos a instalar un plugin q nos facilite agregar imágenes nuestro proyecto , vamos afiles
86. No lo vamos a encontrar en el Marketplace así qlo haremos de manera manual , lo descargamos
desde el drive
87.
88. Cerramos Android stuido y en la pantala incial en la parte inferiro derecha em configure y
elegimos plugins
89.
90. En la ventana q se abre , le damos al engranaje de la parte supeiriro izquierda y elegimos instalar
desde el disco
91.
94. En las versiones anteriores de 3.5 en la parte inferior tienen las opciones design y text
95. Ahora en las versiones más modernas vana estar en la parte superior derecha
99.
100. Si queremos camboar cual es la panralla d incio cambiamos ella etiqueta intent filter
101.
113.
114. Esta propiedad permite q los elementos mostrados en el cajpn no se oculten debajo de
la barra de estado
127.
131.
138. Vamos agregar un color de fondo para toda esta pantalla avmos adecirle que el color d
141.
142.
146.
147. Si nos vamos al activity vemos los colores
148.
152.
159.
160.
162. g
165. Después del textview agreagamos un linearlayout para indicar si vamos a utilizar la
166.
167. AGREGAMOS LOS BOTONES
168.
171. Ahora queremos q ambos botones ocupen el mismo espacio y se enucuntren posición
172. Para esto modificamos el width a 0 y agregamos la propiedad weight a 1 , con esto
182.
183. Agregaremos el color de fondo para los botones
184.
185.
187. Nos ubicamos sobre el color hexadecimal y le damos a alt + enter y elegimos la opción
205.
206. Yvamos a indicarle q la forma serpa rectangular , con un padding y las esuqinas on un
207.
208. Ahora para habiktar este shape al botón debemos darle a la propiedad background y el
209.
214.
215. Video 4 . Crear pantalla de selección de de Login o Registro
217.
218. Una vez creado vamos a cambiar el cosntraint por un coordinator layout
223. Ahora vamos a copiar el linear layout del home para ahorrar tiempo y lo pegamos en el
selectOptionAuth
224. <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@drawable/icon_uber_clone"
android:layout_gravity="center"
android:layout_marginTop="50dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="MiTaxi es un aplicativo similar a Uber"
android:textAlignment="center"
android:textColor="@color/color_White"
android:layout_margin="40dp"
android:textSize="20sp"
android:textStyle="bold"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="bottom"
android:layout_margin="20dp">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@drawable/round_button"
android:backgroundTint="@color/colorBlueLight"
android:textColor="@color/color_White"
android:layout_marginRight="5dp"
android:text="SOY CONDUCTOR"/>
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@drawable/round_button"
android:backgroundTint="@color/color_White"
android:layout_marginLeft="5dp"
android:text="SOY CLIENTE"/>
</LinearLayout>
</LinearLayout>
225.
228. Ahora para cambiar un poco el diseño los botones los sacmos del lienar lay out y lis
vamos a pegar debajo del tetxview y eliminamos el linear donde estaban los botones
229.
230. Tendremos q elimnar el weight e indicarle q el widrh es match parent lo mismo para los
dos botones
231.
232. Ahora al primer botón la vamos a dar un margin left y right de 30 dp pata q se separe de
las esquinas
233.
240. Ahora vamos acentrar todo el contenido con la propiedad gravity en el linear layout
241.
242. Vamos a cambiar los textos de los botones a “YA TENGO CUENTA” y a “REGSITRARME
AHORA”
243. G
245. Vmos a crea una nueva empty activity q se llamará register Activity
246.
251. Dentro del linear vamos a crear las entradas de texto tambie´n llamadas
253. Vamosa copiar este control 02 veces m una para el correo electrónico , donde
textimpotlayout
258. Para seto vamos a ir a la pagina icons8 , aquí podemos encontrar muchos icono
gratuitos
259. Vamos abuscar un icono par elnombre de usuatio buscamos user y descargamos el sgte
260.
261. Lo denficimaos
264. Una vez densificada la imagen creamos un linearlayout antes del primer
textimputlayout
265.
268. Y antes de este textinputlayout agregamos un imageview con 50 dp tanto para el alto
274. Vamos a modificar el width y height del imaeview a 40dp para hacerlo más pequeño
275.
276. A este iumageview vamos a drale un margintop de 10dp para q se alieie con el
textinputlayout
277.
278. Por ultimo al lunear layout q contiene al iconuser y al proenr textinputlayout le vamos
280. Haremos lo mismo con el correo y la contraseña así q densificaremos ambos iconos una
282. Y creamois un nuevo Linearlayout debajo del del user , metemos el inputtextlayout .
así dos veces una para el email y ñla otra para el password
284.
288. Ahora necesitamos un botón que la presionarlo nos permit la acción de registrara , lo
agregamos después del linearlayout de contraseña , que tenga color de texto blanco y color de
fondo el primary
289.
292. Ahora quiero q nuestro botón esté alineado al final de nuestro layout , para esto , lo voy
a insertar dentro de un linearlayout , con match parent ganto para el weight omo el height y la
nomnbre completo
301.
básicamente sería copiar el Imageview y pegarlo antes del linearlayout horizontal que solicta el
310.
311. Tenemos ya las pantallas de login , de registro, de selección , de autenticación y l
pnatalla donde selecciono si quiero inciar sesión como conductor o como lciente , con esto ya
313. Vamos aejecutar la aplicación y ver q tenemos hasta ahora , nos va a mostrar la pantalla
del main activity , el primer cambio q vamos a hacer es quitar el tollbar q se muestra por
defecto, para esto vamos a air al archivo styles de la carpeta values de DArkActionBAr a
NoActionBar
>HomeActiviry.xml y agregarle a los botones sus respectivos ids que sirvan de referencia
declaramos al incio de la clase y dep´s los refreenciamos dentro del método onCreate
320.
método setOnClickListener , (dentro del método , en las paréntesisi escribimos new dejamos
322. .
323. q
325.
326.
327. Y dentro del método onclick vamos aprogramar lo qjeu quremos q haga el botón cuando
presionemos sobre él
331. Vamos a indicarle que ejecute el método goSelectAuth , este método aun no existe , así
q vamos apermtir q Android Studii lo cree , para esto presionamos alt + enter
332.
336.
337. Lo que va a hacer este método es pasar de una pantalla a la otra, para esto vamos a
utilizar intent
338.
339.
340. s donde básicamente le damos el contexto donde nos encontramos , la activty hacia
341.
342. Ejecutamos la aplicación y clickamos en el botón soy clinte y vemos como nos lleva a la
activity selectOptionAuth
343.
344.
345. Copiamos el método y modificamos para q funcione también con el botón
mButtonIamDriver
346.
353. Dentro del nuevo archivo creadom cambiaremos el constraintlayout por por un
AppBarLayout
357.
358. Dentro vamos acrear una propiedad llamada Tollbar, con width matchparemt y height
wrap content
365. Como tiene el mismo color no se difrenecia , con la propiedad backgroun le indicam,os q
370. Y declaramos esta tollbr , luego la referenciamos esta toolbar (recorcdar q lo tenemos q
importar de androidx.appcompar.widget)
371.
373.
374. Para q el función up funcione tenemos q realizar una configuración en el manifest y
375.
376. Ejecutamos el proyecto y verificamos que ya tenemos la action bar con el titulo yboton
378. Vamos a modificar el color del texto del botón y deltexto de la appbnar
379. Vamos a ir al actionvra tool bar xml (lo podemos hacer con ctrl + tab)
388.
391. Para poder utilizar tanto las funxinalidades de Firebase como otros servicios de Goolgle
android.permission.Internet
393.
394. Esto basta para que nuestra aplicación se pueda conectar a internet
396. Para esto debemos programar para q el poton “ya tengo cuenta” nos lleve al login
actovity
400.
404.
405. Quedando de la sgte manera:
406.
410.
411. Pero debemos ir a la loginactivity.xml y darle sus respectivo Ids a los edittext y al botón
412.
421. A continuación declaramos el setonclicklistener (se agrega el menú con ctrl + espacio)
422.
425. Como esta función no existe le permitimos a Android studio q la genereg (elegimos la
segunda opcion)
426.
428. Crearemosdos variables , una para el email y otra para el password y así guardar los
datos ingresados
429.
431. Si tanto el email como el passwotd no estan vacios validamos q el password tenga al
433.
435. Para esto recurrimos a la documentación goglemaos autenticación Firebase con Android
436. Vamos a autenticación del sdk
437.
439.
440. Vamos a provechar y agregaremos las dependencias para poder trabajar con la base de
configuración…
441.
444. Con estas dos dependencias ahora sí nos vamos a ir al lognactivity y voy a declara un
447. Hago los mismo con la referencia de la base de datos en tiempo real
448.
449. Y lo refernciamos
450.
451. Ya integrados estos ervicios , voy a poder ulizar dentro del l función login el método
452. Para agregarle el listener no olvidar que se autogenera el código con ctrl + espacio
453.
454. Que estamos haciendo aquí , , bueno es indicarle qué va hacer cuando ya se haya
vamos a mostrra un mensaje con un Toast donde indicaresmos q el email o contraseña son
incorrectos
456.
457. En caso de que sea exitoso vamos a mostrar por ahora un mensaje que se realizó
exitosamnete
458.
lo agregu´re y se solucionó
462. Vamos a firebase a autenticación
.
463. En sign method acvtivamos usuario y cntraseña
464.
465.
467.
478. Falta agregarle 2 else, donde validamos q tanto el email y contraseña son obligatoriosy
481. Esta librerai va ai,plementar una barra de progreso q le va a ainidicar al usuario que
491.
492. Y ahora lo referenciamos en el onCreate , donde configuramos su contexto , el cual será
493.
494. Y para mostrarlo vamos a decir después de las validaciones antes de q se ejecute el
496. Y una vez q se termine de completra esta tarea indicamos q se dehe de mostrar con el
método dissmiss
497.
498. Vamos a a correr el proyecto
500. g
501. Así le damos al usurio a conocer q una función asíncrona se está ejecutando y q debe de
esérar un momento
505.
515. Ahora debemos también ir al manifest y añadir cual será la actividad padre (el
selectoption)
516.
520. Ahora debemos agregarle alboton registrar ahora pata q nos lleve a la pamntalla de
registro
525.
528. Ahora para diferenciar si soy un conductor i un cliente lo q voy a ahcer espasar un
parámetro cuando presionemos el botón y dicho parámetro tendrá un valor con el cula
sharedprefrences que nos permite almacenar un valor en el dispositiv hasta nosotros le digamos
q deje de existir a nosotros desinstalemos la aplicación
529. Pata poder empezar a utilizar shared´ppreferences primero debo de crear una variable
530.
531.
532. Ahpra voy a crearme una variable del tipo editor donde guadraé lo q edite en el shared
preferences
533.
536.
540. Ahora si quisiéramos obtener ese valor es q cuando estemos en la pantalla de regsitro
545. El string q necesitamos obtener esel user ya q al editor le indicamos q establezca el valor
para ese identifcador (mostrar en homeActiviy) y le damos un espacio vacio , para q drvuelva
549. Y pata ver q está funcionando vamos a utilizar un toast donde muestre el valor asugabdi
a la variable selecteduser
550.
552.
linstanciamos
556.
558. Entonces vamos a al modilo de database de firebase y le damos a crear abse de datos
559.
563.
564. Vamos a crear en registeractivity.java una propiedad DAtabasereference
565.
566. Con esto estamos hacinedo referencia a nuestro nodo principal de nuestra base de
datos
567. Ahora vamos a agregar los ids al registeracriviry para poder utilizarlas
568.
570.
571.
572.
575. Ahora establecemos el método setonclicklistener para el botón (utilizar ctrl + espacio)
576. Le vamsoa indicar q cuando hagamos clic en este botón ejecute un metodod llamado
582.
583. En este método lo priemro q debemos hacer es obrener lo que el usuario registra en los
campos de texto
584.
585. Ahora validaremos q tanto el nombre como el emaly el password no estén vacíos y que
588.
591. Le vamos a indicar que si la tarea se ejecutó exitsamenet haga algo , y si no mostrrá un
592.
596.
597. A este metdo saveUer , lo priemro es que le vamos a apsar el name y el email
598.
600.
601. Ahora vamos a usar el objeto database q ya lo habíamos referenciado , pero antes
vemos q nos indica q las variable deben de ser declaradas como final para que no marquen
errores
602.
604.
605. Ahora para guardar el usuario en la base de datos voy a cortar la variable selecteduser y
606.
608.
609. A continuación agregaremos un condicional para identificar si el usurio selecciono el
610.
611. Ahora si eligió driver voy a crear un nodo dentro la base de datos q llamaremos Users,
dentro a suvez otro nodo q llamaremos drivers y dentro de este configuraremos un nuevo
613. Ahora debemos crearnos un modelo para el nuevo usuario , entonces iremos al paquete
principal
614.
615. Vamos air al package principal, botón derecho y creamos un nuevo package que se
llamará models
616.
617. Vamos acrear dentro del package models una clase llamada User
618.
619.
621. Necesitamos también crear un cosntructor con param,emtros y sus getters y setters con
622.
623.
626. Ahora instanciamos el nuevo usuario y le voy a decir q a este suaurio le establezca el
628. En lo q estamos trabajando de la abse de datos , ants del servalue vamos agenerar un id
único para este usuario , lo haremos con el método push , y dentro de este id si guardaremos el
objeto user
629.
631.
632. Ahora agregaremos un addOnCompleteListener recordar con ctrl + espacio
633.
635.
638.
641.
651.
652. Vemos q al registrar el id en la base de datos no lo hace con el mismo id que cuando se
crea el usuario , para que se guarde en la base de datos cn el mismo iduser , ya no vamos a
654.
662. Avmos a copiar del lgonactivity al registeractivty.java los registros asociados al toolbar
663.
668. Para q no esté encimado agreagmos la propiedad layout behavior al linear lyout
669.
674.
675. Vamos añadirle al register la barra de progreso para q el usuario sepa que tiene qw
677.
678. Ahora le decimos que silos campos están llenos y la constraseña tiene al menos 6
caracteres ,se mostrara esta barra de progreso y si ya completó l tarea de registrar al usuario se
683. Primero vamos a mover la toolbar a una clse aparte para poder invocarlo desde lo
684. Vamos a crear en el paquete principal un nuevo pquete que se llamará includes
685.
686. Dentro de includes creamos unjaca class q se va llamar mytooolbar y dentro creamos un
687.
amostrar o noupbutton
689.
691.
694. No olvoidarse modificar el contexto a activty y lo mismo en los tres método de abajo
695.
696. En settitle registramos el parámetro titleg , igual en el caso del parámetro boolenao para
698.
702. Quedando:
703.
704. Si corremos la aplicación debería mosrars como si nada hubiera sido modificado
705.
706.
707. Video 8 . Mejorando el código del proyecto parte 1
708. Una buena practcva al trabajar con firebase es gnarar un mlodelo por cada uno de los
nodos , tenemos un nodo para clientes y otro para conductores vamosa crear una clase driver y
otra Cliente
709.
710.
711.
712. Ahora q ya tenemos a ,los modelos q representan a ls dos nodos de firebase , lo sgrte q
modularizar el código es separar la lo´gica del registro en un archivo a parte y lo único q deberoa
q se llamará aurhProvider
714.
716. .
719. Crearemos un constructor y dentro de este voy a pegar la instancia de mAuth que
copiode registerActivity
720. g
721. Ahora crearemos un método publco llamado register, que hará este me´todo,
722. Copiamos
723.
createUserWithEmailAndPAsswotd
725.
726. Nos va arrojar un error, voy aelegir la primera opción del foquito rojo donde nos indica q
728. Lo mismo dberiamos hacer con el método de login (copiamos el método q acabamos de
crear) , este método también recibe el email y el password, pero ya no es créate sino sigIn
729.
730. También vamos a separar la lógica para insertar los dtos en realtimedatabase
731.
del registerActivity
733.
734.
739. Lo qyue estamos haciendo es un provider para l cliente y ahí se va amanejar toda la
741. Ahora vamos a crear otro método publico que deberpia retornarnos también una tarea ,
al igual q lo hicimlos con el authProvider y esta tarea será de tipo void y lo vamos allamar créate
para seguir los standares al trabajar por ejem con un api rest , para crearnos un cliente
744. Y para crear nuestro cliente simplemente decimos mDatabse punto child
745.
746. Recordar que dentro de clientes necesitamos crear un id para el cliente y dentro sus
751.
sus instancias (vamos primero al registeractivity) y vamos adeclrar un objeto del tipo
757.
758.
métodos
761. NORA : cometí un error al importar Authprovider jale de java.security antes que de mi
package providesr
764.
765.
770.
771. Una vez cortado en vez de este código llamamos a un método register , el cual aun no
hemos mplementado
772.
775. Dentro vamos apegar el método q habíamos cortado , pero ya no vamoa usar el mauth,
sino el mAuthProvider , reemplazar por el método para crear el usuario, que se llamaba register
777.
778. Ahora , al igual q hicvimos antes , vamos aejecutar el addonCompleteListener y decimos
779. Y vamos aguardar ese usuario en ela base de datos medienate el método créate , en
este caso solo vamos a trabajar con el cliente , ya que en el caso del conductor vamos a ahcerle
780. Decalaramos el emtodo créate: (no olvidar importar la clase desdeel package model)
781.
782. Igual , en el método créate ejecutamos el oncompeltelisteners , sito do fue ok vamos a
decirle que haga algo , pero sino , va a mostrar unm toast con un mensajed e errpr
783.
784. Ahora justo después del registro vamos a crearnos un cliente , recordando q en el
785.
786. Necesitamos el id , ahora lo vamos a obtener de la clase FirebaseAuth
787.
789.
792. Y ahora ya no va a ejecutar el saveuser sino el método créate que va arecibir como
parámetro un cliente
793.
794. Y vamos a comentar el código del método saveuser q está más abajo
795.
796. Y ahora al método register tenemos q pasarle el name , email y password , que los
800.
801. Ejecutamos la aplicación
802. Y vemos q registra correctamente pero los clientes se guardan con el , si no quiero eso ,
803.
805. Vamos acrear un package q se va llamar activities y refactorizamos cuano metamos las
en client
807.
808. Y dentro de driver vamos acrear una nueva actividad , una empty activity
811.
812. Y lo q vamos a ahcer es coíar todo el código de registeractivity excepto el ultimo método
814.
815. Mucho cuidado dentro del oncreare en setcontencview cambiar al regsiter driverg
816.
820.
826.
827. En los toasr del método register y créate hayque modficar el contexto
828.
829.
830.
831. En el método créate ejecutamos mdriverPorvider y le vamos a pasar como modelo un
objeto Driver
832.
833. En el método register una vez q se ha creaddo el usuario , para guardar el conductor en
la base de datos debemos adecuar la instancicacion , debemos crear un objeto del tipo Driver
834.
835. Pero hay un detalle , el condugotor en el mode,o vmos q también tiene la marca del
836. Vamos a copiar el contenido del layout dl register del cliente y lo pegamos en el
register_driver
839. Y debemos añadir dos campos más pegamos el ultimo linearlayout dis veces abajo y
adecuamos los respectivos ids y las referencias a los iconos que van a mostrar
840.
841. Y ek otro
842. Inputtext
843.
853. Mee voy a buscar otro ícono para la placa de rodaje , vamos a elegir el q se llama filter_1
858. Ahira ya contamos con todos los campos necesarios para registrar un vehiculo
863. En el método del clickregister también necsitamos obtener los valores de esos campos,
865. Ahora en las validaciones necesitamos saber si el usuario ingresó esos valores
866.
867. También ene l método de registro vamos apasar esos parámetros , tanto la marca como
la placa de rodaje
868.
869. En la declaración del método register debemos de recibit estos dos parámetros también
870.
871. Ahora , lo único q debería cambiar aquí s que cuando el usuario se registre
correctamente , debemos instanciar un driver , que ncluya todos los parámetros necesarios y le
asiganmos este driver al método créate para que se registre en la base de daros
872.
873. Y ahora como haríamos para que cuando le demos al botón registrarme ahora me lleve
pegamos en selectOptionactivity
876. g
881. Le indicamos que si el valor q devuelve shared preferences es client , nos llvará
RegisterDriverActivity
882.
883. Ahora si vamosa correr l aplicación y vamos a ver como estpa funcionando
884. Y probaré tanto como conductor que como cliente y vemos si se acrivan los respectivos
formularios de rgistro
886.
890.
893. En client vamos a crear una nueva actividad empty actovity llamada MapClientActivity
894.
899.
900.
901. En el mapdriver vamos agregarle un textviewg que diga este es el mapa del conductor
907. Cuando nosotros registramos un usuario nos debrá poder llevar al mapdriver , pero el
usuario no debería pder regresar a esra pantalla de registro , entonces a este intent le vamos
añadir una propiedad addflags , done los voya decir q el intent utilice una propiedad flag activity
new task o una propiedad llamada FLAG_ACTIVITY_CLEAR_TASK , CON ESTO NOS ASEGURAMOS
stratactivity
908.
911. Ambién se nos olvida si en el login vamos air al mapa del clente o al mapa del conductor,
entonces me voy a copiar el sharedpreferences y nos vamos al loginactivity tanto el objeto como
la refrenciacion en el onCreate
912.
913. Ahora, una vez q el usuario hay realizado correctamente el logueo , obrendremos cual
915. Y vamos aejecutar la aplicación y voy aloguarme como conductor “javier” y lugo como
cliente (creamos cliente jani) , si le damos a atrass cuando estamos en el mapa , se cerrará la
918. cuando nosotros nos logueamos i hacemos registro se crea una sesión de usuario
919. si nosotros una vez q estamos en el mapa damos al botón back y volvemos a entrar nos
corresponda
920. para esto vamos a ir al mainactivity y sobresescribiremos un método del ciclo de vida de
923.
924. Y vamos a utilizar el sharedpreferences y un condicional con los intents (que lo
925.
926. Ahora volvemos correr la aplcació y probamos dandolde atrás , e intentamos ingresar
nuevamente
929. Para probar como cerrar la sesión , en el mapa del cliente.xml borramos la etiqueta y
931. g
932. Vamos a ir al mapcloientactivity.java y vamos acrear un botón y areferenciarlo ene l on
Create
933.
935. .
936.
referenciamos en el onCreate
940.
941. Y cuando le demos clci al botón de logout vamos allmara simplemnet al logout y
942.
943. Y a continuación declramos un intent que nos lleve al Home Activity , le indicamos que
950. Si cierro la app y la vuelvo a abrr no llevara al home porq las sesión se ha cerrado
951. CAPITULO 4
mapdriveractivity
954. Vamosa google y buscamos google console y entramo a google cloud console
955.
965.
966. Y NOS VA AGENERAR UNA API-KEY que nos permitirá integrar google maps
967.
968. La vamos acopiar y le daremos al botón cerra y nos vamos a Android studio a la carpeta
972. Agregaremos una etiqutea string donde agregaremos la pai_key y algunas propiedades
973.
974. Ahpra debsmoa it al activitymapdriver.xml5 y borramos el text view y agregaremos un
fragment
975.
976. Nos arroja errores pporque aun no hemos integrado los servicios de google
988.
989. Ahora necesitamos crearnos 2 propiedades
990.
993. Ahora invocarems el método getAsync del nMapFragment , este método getasyn dice q
recibe un callback , en este caso será this , esta actividad está implemetado el
onMApReadycallback
994.
995. Ahora iremos al método OnMap Ready aquí le ddamos a nMao googlemap como
agregado
998.
999.
1006.
1007. Y activaremos maps sdk para androidg , lo seleccionamos y habilitamos
1008.
1009.
Y pegamos el fragment
1017. Nota (hay q mover el mapdriveractivity.java a la carpeta driver por errro no estaba
ahi)
1018. Ahora vamosa copiarnos del mapdriver.java las dos propiedades necesarias para
implementar el mapa
1019.
1024. Vamos a borrar el botón de logout por por ahora no lo vamosa utilizar
1025.
findviewbyID
1027.
1031.
1032. También copiamos el método onMApReady desde el map driver activity
1033.
1041. Vamos acrear en este mapa un toolbar para poder usar la función de cerrar sesión
1047. Para esto vamos a crear en la carpeta res un nuevo Android resource directory
1048.
1049. Esta se llmará menú y resource type también lo configuramos amenu (ya la creó cesar)
1050.
1051. Dentro de est carpeta vamos acrear un nuevo menú resource file y lo llmaremos
driver_menu
1052.
1053.
1056.
1057. Se va amostrar el menú , y al desplegarse se muestra la opción q acabamos de definir
1058.
1060.
menu inflater genera un enú a partir de un archivo xml ) y le vamos a pasar como pa´rametro el
el action del ítem selecioando del menú corresponde al action_logout , vamos aejecutar el
1069. Ste método logout vamos a copiarlo del mapClient y también nos faltaría declarar el
1070. Authprovider
1071.
1076. nOTA(al cambiar la activity de incio hay q desisntalar para q sea ctualice)
1080. Vamos a hacer lo mismo para el cliente , primero vamos acrear un menú para el cliente ,
1083. Paa trabajar con el gps vamos a agregar la implementation de la librería location
1084.
1087. Necesitamos también un callback q va a estar escichando cada vez que el dueñop del
celular se mueve
1088.
objeto LocationResult
1090.
1091. Vamos utilizar un for para recorrer una propiedad de tipo location
1092.
1093. Dentro vamos a hacer una validación donde preguntamos si el contexto de la aplicación
1095. Pero antes vamos atener q instanciasr las dos propiedades del tipo locationRequest y
FusedLocationProvider
1099. usamos otra propiedad setSmallestDisplacement que dedfine la minima cantidad entre
1100.
1101.
1102.
el onCreate
1104.
1105. Con my fusedLocation vamos apoder inciar o detener la ubicación del usuario cada vez q
lo veamos conveniente, pero antes necesitamos obtener los permisos de parte del usuario que
utilzará la aplicación
1108. En este método vamos apreguntar si el requestcode va ser igual a una variable global
1109.
1110. Crearemos la constante global la cual va aser como un flag o bandera , para saber si
1111.
1115.
1116. Si estos permisos han sido concedidos , vamos a utilizar mFusedLocation y su método
1117.
1118. Necesitamos también añadir unos permisos en el manifest para obtener la uubicación
() el access_fine_location
1119.
1120. Lo sgte es crear un m etod para validar si el usuario no concede los permsisos y
(https://developer.android.com/training/permissions/requesting)
1124. Si aplica esta validación haremos otra dentro donde mediante un alert informaremos al
usuario indicándole q debe de facilitar los permisos para efectuar loq e la apliación requiere
1125.
1128. La línea q va dentro del onClick ser´pa que permita conceder los permiso
1129. Necesitamos también agregar un else donde agregaremos la misma línea de código, la
1131. Ahora implementaremos otro método para incxializar el listener d nuestra ubicación y
se llamará startlocation
1132.
1133. Dentro de este tambié validaremos que si la versión de Android es mayor o igualñ a la
versión marshmellow
1134.
1135. Copiaremos una línea de código que ya hemos utilizado para ver si los permisos han sido
requestLocationUpdates
1136.
1143. Y llamaremos a una función llamada moveCAmera , esta función va arecibir una función
1148.
1149. Vamos acorrer la aplicación y veremos como está funcionando
1151.
1152. Esto nos pide la primera vez le damos en allow y ns va allvar a donde el emulador de
1154.
1155. Para realizar una prueba más adecuada podemos descarfar una app que se llama fake
gps
1159.
1170. En este caso no obtendría la ubicación del usuario y la aplicación quedaría inservible ya
1175. Pero para asegurarme q la aplicación funcione es hacer la validación del método
1177.
1178. Si ehjecutamos nuevamente la aplicación nos pedirá conceder los permisos hasta
lohagamos
1179. Otra validación q debemos hacer es q al inicar sesión el usuario no tenga activado el gps
1181. Ahora lo q vamos ahacer es agregar un dialog para q nos adiverta q el gps stá apagado y
1183.
1184. Agregaremos un objeto del tipo LocationMnager la cual provee información de los
1185.
isActive
1188.
1189. Entonces como indicamos nos permitirá saber si tiene activo el gpsg
1190. Y rearemos otro método que permita crear un alert q le permita al usuario ir a las
1194.
1195. Agregaremos la nsruccion activtyForResult la cual va a esperar hasta q el usuario realice
1196. Aqupi vamos a gregar un intenet que nos va allevar a la opción de configuración para
activar el gps
1197. Pero antes avmos anecsitar crearnos una avriable global que vamos a necesitar como
1198.
1199.
1201.
1202. Ahora , como les dije el método starrActivityForResult va aestar esperando la acción del
usuario
1203. Para poder aprovechar esto vamos atener q escribir un método onActivityResult
1207. Si cumple esta condición inicaremos el listener de nuestra ubicación actual con el
1208.
1209. Aqupi nos va arrojar un error para esto debemos agregar la anotación
1210.@SuppressLint("MissingPermission")
1211.
la advertencia
función.
1213.
1214. El metdo gpsactive también podemos utilzarlo en el método startlocation
1216.
1218.
1219. Igual en el otro else
1220.
1221. Esta validación también es necesaria si el usuario concede los permisos necesarios para
obtener la ubicación
1222. Así qu e cuano pregunte para conceder los permisos evalue si el gps esta activado o no,
1232.
1235.
1239. Vamos a xcontinuar con el conductor y vamos a mostrar como obtener el punto exacto
de nuestra ubicación
1240. Para ellos nos vamos al onMapReady del MapDriverActivity.java y vmos autilizar el
1249. Ahora en el caso del conductor quisera agregarle un marcador más personalizado
1252. )
1258. ya q nostros queremos utilizar un marcador , en vez de este punto de referencia que se
va air actualizando confomrme nos movamos en el mapa, , por eso vamos ainstanciar este
1263. Le vamos aestablecer un titulo con la propiedad title y además el icono q se va mostrar
1268. En este caso el icono parece muy grande parareducirlo lo desnsificamos de nuevo y le
1270. Sobreescribimos todo y le va,osa quitar también el punto azul que teníamos por defecto
cambiamos a false
1272.
1273. Volvenmos aocrrer la aplicación
1274.
tiempo real
1277.
validación , dondesi el marcador es distinto anulo, es decir q ya existe ,lo vamos aeliminar con la
propiedad remove
1282.
1283.
1287. Ahora avmos al mapdriver.java y declaramos una variable del tipo button
1288.
1291. Establecemos el método setOnClickListener después del new damos ctrl + space para
1293. Y cuando presionemos este botón lo q haremos primero es crearnos una variable del
tipo Booleana para saber si estamos conectados , la vamos a llamar isConnect y por defecto va
aestar en false
1294.
1295. Ahora, en el setobnclicklistener del botón vamos apreguntar que si el conductor está
startLocation
1296.
1297. Nos indica q el método disconnect aun no lo tengo implementado , así q dejamos q AS
lo cree
1298.
1301. Pero antes también vamos agregar unas cositas en el startLocation , si el gps está
cambiará a true
1302.
1303. Podemoscopir setas dos líneas para el método disconncet , donde el texto cambiará a
cuando está establwcido lógicamente en true para habilitar ese pequeño circulo azul , que
identificaba la posición exacta de nuestra ubicación, lo podemos utilizar pero podría crashear la
1313. Si no tuviéramos estos permisos que nos va apedir la aplicación cuando la ejecutemos
por pr9emra vez y el método setMyLocation Enabled en true, va a hacer q la aplicación falle,
mfusedLOcation.requestLocationUpdates
1317. (en el onActivityResult, en el startLocation (02 veces)) , una vez hecho esto podrían
utilizar esa funcionalidad sin que que genere ningún error en la aplicación
firebase Realtime
1320. Para esto vamos airnos a las dependencias en gradle app y googlearemos geofire for
Android
1321.
1324. Nos vamos al mapdriverActivity.java y para hacer uso de esa dependencia vamos
1326. Aqupi declaramos 02 propiedades , una referencia la base de datos y una del tipo
Geofire
1327.
1328. Crearmos un constructor para esta clase e instanciaremos ,las propiedades , en el caso
q deberpa recibir dos parámetros, primero el id del uuario , q en este caso es un conductor y lo
1332. Adentro de este método vamos a utilizar geofire y en particular su método setlocation,
qye recibe como primer parámetro la llave, q seria el id deL conductor, y como segundo
1334. Con esta simple línea vamos a poder guardar la ubicación en la base de datos
1335. Vamosa implementar otro método para eliminmar la ubicación que llamaremos
removeLocation el cual recibirá como parámetro el id del cnductor , donde llamaremos ageofire
y su método removeLocation
1336.
1337. Para poder trabajar con estos métodos adecuadamente nos vamos al
longitud
1340.
1341. Como necesitamos guardar la ubicación del conductor cada vez q s está moviendo en el
implementado
1342.
1345. Algo que hemos olvidado hacer es declarar una propiedad del tipo GeofireProvider
1346.
método savelocation ,
1350.
el cual necesita el id del conductor, para esto vamos air al authprovider y declaramos un método
1352. Este método nos devuelve el id del usuario actual , lo vamos aimplemenmtar en el
1354. Per lo correcto en este método updatelocation serp validar primero q el usuario esté
1357. Básicamente estamos declarando una variable booleana llamada exist , valida si el
usuario actual de firebase es distinto a nulo , entonces de acuardo a eso la variable booleana
validación del la actual sesión y de si la long y latitud es disitinto a nulo , de cumplir con ambas
1360. Y por ultimo nos quedaría en el método disconnect ejecutar el método para eliminar la
algún error
1361.
1362. Validamos además que la sesión exista y de será sí borramos de la base de datos la
ubicación
1363.
1365. Si esta corriendo el fake gps veremos como se crea el nodo active drivers y dentro el id
del conductor activo. Dentro tendremos dos propiedades usaremos la q tiene l , dentro hay un
1367. Vemos como sea ctualiza en tiempo real si le damos desconectarse va a eliminar el nodo
de la base de datos
1368. Le dmso en conectar de nuevo y nuevamente tendríamos los datos en la base de datos
1369. Esto nos va aservir para q el cliente sepa la posición del conductor
1373.
1376. También nos faltaría ejecutar el método disconnect en el método del logout, ya q
cuando el conductor cierre sesión deberían eliminarse también los datos de su ubicación en
firebase
1377.
1378. Esto se evidencia , al cerrar sesión nos elina la ubicación del usuario
1379. Probamos corriendo la aplicación , nos conectamos y luego cerramos sesión , veremos
1382.
1384. Necesitamos agregar nuestro marcador actual como clente, vamosa copiar desde el
1396. Nos vamosa ir al geofireprovider y vamos aimpementar un método para obtener los
conductores disponibles
1397. En este caso nos va retornar un objeto del tipo GeoQuery y se llamará getActiveDrivers
1398.
1399. A este método le vamos apasar una latitud y una longitud como parámetro
1400. Le vamos adar también respecto al cliente el radio de búsqueda de los conductores, es
decir a cuanta distanmcia quero q se muestren los conductores , en este caso le pondremos 5
1402. Vamos ahora a regresar al mapclientactivity y vamosa declrar un método que lo vamos
la clase geofireprovider
1409.
1410. En este caso este método va arecibir la latitud y longitud en la q se encuentra el cliente,
para ello vamos aguardar esta localizacon en una variable global como lo hicimos en el
1417.
1418. Vamos a trabajar principalmente sobre los tres primeros métodos
1419. El emtodo onKeyentered serpa donde nostros iremos añadiendo los marcadores de los
desconectan de la aplicación
1421. Y en el método onkeymoved vamos air actualizando en tiempo real la psicion del
1423.
1424. Para añadir los marcadores debemos de crearnos una lista de objetos tipo marker
1425.
1426. Ahora dentro del método onKeyentered vanmios acreanos un for para recorrr esa lisat
de marcadores
1427.
si ese marcador es igual al key que viene como parámetro en el método onKeyentered , el cual
viene de la base de datos cuando se conecte un conductor , si fuera así nos devuelveun retur ,
1429.
1430.
1431. Después de esto nos vamos a crear una propiedad latlng y esta almacenará la posición
1433. La latitud y longitud la obtenemos del objeto location q viene como parámetro en este
método
1434. Ahora teniendo la posición del nuevo conductor vamos intsnaciar un nuevo marcador
1435.
1436.
1437. Ahora le vamos adecir q a este marcador le vamos a asignar como identificador el id del
conductor , que lo obtenemos del parámetro key de este metod onkeyentered y lo agreagremos
vamos a copiarnos el for del onKeyEntered lo pegamos ylo adecuamos y añadimos unpar de
de marcadores
1441.
1442. Por ultimo nos vamos al onKeymoved q es donde vamos a actualizar la posicon de
le vamos a decir al marcador que se establezca en una nueva posición con el método setposition
1443.
1444. Ahora simplemente nos falta llmara a este método getactivedrivers dentro de la
1445. Pero hay un detalle , este método debe ejecutarse una vez y el callback va aestar
1446. Para poder ejecutralo una vez vamos declarar una variable global a la q llamaremos
el método getActiveDrivers
1448.
1455.
dependencia
1459.
1460.
1461. Y sincronizamos
1462. Ahora nos vamos al mapclienteactivity.xml y nos crearemos otro fragment cuyo ID será
1464. Si lo corremos no se va a ver nada ya q el toolbar está por encima de la vista q tenemos
aquí
1470. Para adecuar esto, meteremos este fragment en u cardview , el margen y la propiedad
1471. Vamos aponerle un color de fondo al cardview , color blanco y border redondeados con
cardcorner radius
1472.
1476.
1477. Ahora mnos iremos al ativitymapclient.java y voy adeclarar dos propiedadaes , la primer
1478.
lo instanciamos
1482.
com.google.android.libraries.places.api.model)
1486.
1487. Ahora a este autocomplete le queiro implemntr un listener cuando el usuario presione