Spanish [B4A] [Tutorial] Google Maps Actualizado a B4A v5.8 y B4A v6+

rscheel

Well-Known Member
Licensed User
Tutorial Actualizado Google Maps Android.

Lo primero que necesitan es configurar su proyecto es tener instalados los Google Play services y para usar la API de Google Maps, deben crear una api key, para hacer esto les voy a dejar el link del tutorial en ingles desarrollado por Erel https://www.b4x.com/android/forum/threads/google-maps.63930/

-Para actualizar los servicios de Google Play, deben ir donde tengan instalada la SDK de Android y ejecutar SDK Manager. (Yo les recomiendo por mi parte es instalar Android Studio y usar el sdk que trae Android Studio, es fácil de actualizar).

-Para crear el API KEY, necesitamos crear una Private Sign Key para ello dentro de B4A tenemos que seleccionar Tools - Private Sign Key.

-Una ves creada tenemos que copiar el valor de SHA1.

* Deben registrar la aplicación en : https://console.developers.google.com
* Deben habilitar el API de Google Maps para Android
* Luego hacer click en Credenciales -> Crear Credenciales -> Clave de API -> Clave de Android (Si no le aparece esta opción, primero les pedirá crear un proyecto, luego ya verán la opción para crear la clave) Solo siga los pasos que se indican ahí para crear la clave.
Una ves creada debería tener una clave como esta: AIzaSyCmFHamGE0O0BvxxxxxxxxXbTCSrjFVg-Q

-librerías que necesitaremos:

* GoogleMaps v2.0 https://www.b4x.com/android/forum/attachments/googlemaps-zip.41897/
* GPS

Para B4A v6+

Debe añadir el siguiente fragmento de código de Google Play Service a Manifest Editor.

B4X:
AddApplicationText(
<meta-data
  android:name="com.google.android.geo.API_KEY"
  android:value="Aquí va su api key"/>
  <meta-data android:name="com.google.android.gms.version"
   android:value="@integer/google_play_services_version" />
)
Y añadir esta linea en su Activity Main.

B4X:
#AdditionalJar: com.google.android.gms:play-services-maps
Para B4A v5.8

Debe añadir el siguiente fragmento de código a Manifest Editor.

B4X:
AddManifestText( <permission
  android:name="$PACKAGE$.permission.MAPS_RECEIVE"
  android:protectionLevel="signature"/>
  <uses-feature android:glEsVersion="0x00020000" android:required="true"/>)

AddApplicationText(<meta-data
  android:name="com.google.android.maps.v2.API_KEY"
  android:value="Aquí va su api key"/>
   <meta-data android:name="com.google.android.gms.version"
   android:value="@integer/google_play_services_version" />
)
Y añadir estas lineas en su Activity Main.

B4X:
#AdditionalRes: $AndroidSDK$\extras\google\google_play_services\libproject\google-play-services_lib\res, com.google.android.gms 'esta es la ruta donde se encuentra instalada su SDK de android.
#ExcludeClasses: .games, .drive, .fitness, .wearable, .measurement, .cast, .auth, .nearby
#ExcludeClasses: .tagmanager, .analytics, .wallet, .plus, .vision, .gcm
'remove the following line if you use AdMob
#ExcludeClasses: .ads
Para ambas versiones de B4A debe seleccionar en Android Manifest minSdkVersion a 14 (Android 4)

Una ves realizada esta configuración solo queda agregar nuestro mapa.

En designer Agregan a un layout un MapFragment como muestra en la siguiente imagen.

SS-2016-02-24_12.13.18.png


Y el código en su Activity Main seria el siguiente.

B4X:
#Region  Project Attributes
    #ApplicationLabel: Mapas Ejemplo
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: unspecified
    #CanInstallToExternalStorage: False
    #AdditionalJar: com.google.android.gms:play-services-maps
#End Region

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    Dim GPS As GPS
    'Dim D As DoubleTaptoClose
End Sub

Sub Globals
       Private gmap As GoogleMap
       Private MapFragment1 As MapFragment
    Dim Latitud As Double = 0
    Dim Longitud As Double = 0
    Dim Lat2 As Double = 0
    Dim Lon2 As Double = 0 
    Dim p1, p2 As Location
    Dim Distance As Float
    Dim boton1 As Button
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("LayoutMapa")
    If MapFragment1.IsGooglePlayServicesAvailable = False Then
     ToastMessageShow("Please install Google Play Services.", True)
    End If
    GPS.Initialize("GPS")
    'Boton velocidad'
    boton1.Initialize(0)
    boton1.Text = 0 &" "&"km/h"
    boton1.TextColor = Colors.Red
    boton1.TextSize = 15
    Activity.AddView(boton1, 40%x, 5dip, 25%x, 40dip)
    'Fin Boton velocidad'
End Sub

Sub MapFragment1_Ready
    gmap = MapFragment1.GetMap
 
    Dim JavaMapsObject As JavaObject
    JavaMapsObject = gmap.GetUiSettings
    JavaMapsObject.RunMethod("setMapToolbarEnabled", Array As Object(True))

'    Dim m1 As Marker = gmap.AddMarker(10, 30, "test")
'    m1.Snippet = "This is the snippet"
    Dim cp As CameraPosition
    cp.Initialize(-33.469119900000000000 , -70.641997000000000000, 15)
    gmap.AnimateCamera(cp)
End Sub

Sub GPS_LocationChanged (Parametro As Location)
    Dim sp As Int
    sp = Ceil(Parametro.Speed * 3.6)
    boton1.Text = sp &" "&"km/h"
    Latitud = Parametro.Latitude
    Longitud = Parametro.Longitude
    p2.Initialize2(Latitud,Longitud)
    p1.Initialize2(Lat2, Lon2)
       Distance  = p1.DistanceTo(p2)
    If Latitud <> 0 And Longitud <> 0 Then
    If Distance > 10 Then
    Lat2 = Latitud
    Lon2 = Longitud
    Dim cp As CameraPosition
    cp.Initialize2(Parametro.Latitude, Parametro.Longitude, gmap.CameraPosition.Zoom, Parametro.Bearing, 0)
    gmap.AnimateCamera(cp)
    End If
    End If
End Sub

Sub Activity_Resume
    If GPS.GPSEnabled = False Then
        ToastMessageShow("Debe Activar el GPS del Equipo.", True)
        StartActivity(GPS.LocationSettingsIntent) 'Will open the relevant settings screen.
    Else
        GPS.Start(0, 0) 'Listen to GPS with no filters.
    End If
End Sub

Sub Activity_Pause (UserClosed As Boolean)
    GPS.Stop
End Sub
Este código es hecho por mi y probado, funciona perfectamente, esta realizado en B4A v6.

Una captura de como debería verse una ves hecho todo lo anterior.

Screenshot_20160720-084249.png

Si quieren obtener mayor información al inicio esta el link del post original en ingles.

Espero les ayude en sus proyectos que puedan tener.

Saludos.
 
Last edited:

ebqlabs

Active Member
Licensed User
Excelente.

Seria bueno que el mapa tuviera la caja de búsqueda con las calles. Saludos
 

Pablo Torres

Active Member
Licensed User
se q no va aca, pero no recuerdo como corno hacer un nuevo hilo, asi q lo pongo por aca.
Tengo un problema con google maps, hay algo q no funciona pero no tengo ni idea que es lo que puede estar mal
pongo el codigo para q alguien q sepa lo pueda mirar y darme una mano.
Muchas gracias
 

Attachments

rscheel

Well-Known Member
Licensed User
se q no va aca, pero no recuerdo como corno hacer un nuevo hilo, asi q lo pongo por aca.
Tengo un problema con google maps, hay algo q no funciona pero no tengo ni idea que es lo que puede estar mal
pongo el codigo para q alguien q sepa lo pueda mirar y darme una mano.
Muchas gracias
Comprueba los servicios de google play, actualiza tu sdk.
 

Pablo Torres

Active Member
Licensed User
no funciono, ahora me tira un error en las librerias q antes no me tiraba
q engorroso esto de google maps
una masa
 

rscheel

Well-Known Member
Licensed User
@Pablo Torres
Si actualizaste el sdk tienes que mover las nuevas librerías de google-play-services a tu librería de b4a y android-support-v4, android-support-v7-appcompat siempre que hagas una actualización de la sdk tienes que hacer el mismo procedimiento.
 

rscheel

Well-Known Member
Licensed User
amigos no se que pasa, pero el mapa se me queda en blnaco, no carga alguien sabe por que?
Que versión de b4a estas usando?

Acabo de actualizar el tutorial para las ultimas versiones de B4A.

Saludos espero les sirva.
 
Last edited:

rscheel

Well-Known Member
Licensed User
amigo tengo la version 6, ya intente con el tutorial de erel de google maps v2 pero mas perdidoooo que embolatado. erel no explica los pasos de firebase y creo que ahi debo tener el error, por favor ayudenme
Estimado no necesitas firebase, lee nuevamente este tutorial, lo acabo de actualizar hoy.
 

Carlos marin

Active Member
Licensed User
rscheel no había visto que actualizaste el tuto, estaba mirando el de erel, curiosamente cuando instale android-studio para obtener el api key se me borro la carpeta donde tengo el archivo google-play-services.jar ni idea del por que, hago tus pasos y cuando voy a ejecutar la aplicación me dice la aplicacion se a detenido y se sierra, voy a reinstalar el sdk primero y te voy comentando. gracias
 

rscheel

Well-Known Member
Licensed User
rscheel no había visto que actualizaste el tuto, estaba mirando el de erel, curiosamente cuando instale android-studio para obtener el api key se me borro la carpeta donde tengo el archivo google-play-services.jar ni idea del por que, hago tus pasos y cuando voy a ejecutar la aplicación me dice la aplicacion se a detenido y se sierra, voy a reinstalar el sdk primero y te voy comentando. gracias
No si con el nuevo sdk ya no aparece google-play-services.jar, sigue el nuevo tutorial y no tendrás problemas.
 

Carlos marin

Active Member
Licensed User
hola rscheel, listo e iniciado desde cero tu tutorial, me sale el siguiente error
Error occurred on line: 25 (gmaps)
java.lang.IllegalStateException: A required meta-data tag in your app's AndroidManifest.xml does not exist. You must have the following declaration within the <application> element: <meta-data android:name="com.google.android.gms.version" android:value="@Integer/google_play_services_version" />

esto es lo que tengo en la linea 25:

25: If MapFragment1.IsGooglePlayServicesAvailable = False Then
26: ToastMessageShow("Please install Google Play Services.", True)
27: End If

amigo disculpame la insistencia pero eres el unico que me esta ayudando. muchas gracias enserio.
 

rscheel

Well-Known Member
Licensed User
hola rscheel, listo e iniciado desde cero tu tutorial, me sale el siguiente error
Error occurred on line: 25 (gmaps)
java.lang.IllegalStateException: A required meta-data tag in your app's AndroidManifest.xml does not exist. You must have the following declaration within the <application> element: <meta-data android:name="com.google.android.gms.version" android:value="@Integer/google_play_services_version" />

esto es lo que tengo en la linea 25:

25: If MapFragment1.IsGooglePlayServicesAvailable = False Then
26: ToastMessageShow("Please install Google Play Services.", True)
27: End If

amigo disculpame la insistencia pero eres el unico que me esta ayudando. muchas gracias enserio.
Estimado tiene que agregar este codigo en android manifest

B4X:
AddApplicationText(
<meta-data
  android:name="com.google.android.geo.API_KEY"
  android:value="Aquí va su api key"/>
  <meta-data android:name="com.google.android.gms.version"
   android:value="@integer/google_play_services_version" />
)
y esta en su activity main

B4X:
#AdditionalJar: com.google.android.gms:play-services-maps
Y recuerda que tienes que usar la libreria GoogleMaps v2.0 https://www.b4x.com/android/forum/attachments/googlemaps-zip.41897/

Todo esto esta explicado en este tutorial por favor leer el primer post de este hilo.

Saludos.
 

Carlos marin

Active Member
Licensed User
hola rscheel si eso ya lo hice pero entonces no se si lo estoy haciendo mal mira mi manifest agregue esas lineas al inicio, el #AdditionalJar: com.google.android.gms:play-services-maps lo tengo en el main tal cual esta explicado aquí, y verifico que tengo la librería googlemaps 2.0

B4X:
AddManifestText(
<meta-data
  android:name="com.google.android.geo.API_KEY"
  android:value="AIzaSyAlNX6NBqLxxxxxxxxxxcQdbzYLnN1NCLPtvU"/>
  <meta-data android:name="com.google.android.gms.version"
   android:value="@integer/google_play_services_version" />
<uses-sdk android:minSdkVersion="14" android:targetSdkVersion="21"/>
<supports-screens android:largeScreens="true"
    android:normalScreens="true"
    android:smallScreens="true"
    android:anyDensity="true"/>)
AddManifestText(<uses-feature android:name="android.hardware.telephony" android:required="false" />)
AddManifestText(<uses-feature android:name="android.hardware.camera" android:required="false" />)
AddManifestText(<uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />)
AddManifestText(<uses-feature android:name="android.hardware.camera.flash" android:required="false" />)
'AddPermission("android.permission.ACCESS_COARSE_LOCATION")
AddPermission("android.permission.INTERNET")
AddPermission("android.permission.ACCESS_FINE_LOCATION")
AddPermission("android.permission.WAKE_LOCK")
AddPermission("android.permission.DEVICE_POWER")
'AddPermission("android.permission.ACCESS_COARSE_UPDATES")
AddPermission("android.permission.READ_PHONE_STATE")
AddPermission("android.permission.VIBRATE")
AddPermission("android.permission.CAMERA")
AddPermission("android.permission.FLASHLIGHT")
AddPermission("android.hardware.camera")
SetApplicationAttribute(android:icon, "@drawable/icon")
SetApplicationAttribute(android:label, "$LABEL$")
AddApplicationText(<activity android:name="ice.zxing.CaptureActivity"
            android:screenOrientation="portrait" android:configChanges="orientation|keyboardHidden"
            android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
            android:windowSoftInputMode="stateAlwaysHidden">
        </activity>)      
'android:screenOrientation="portrait" android:configChanges="orientation|keyboardHidden"
 

rscheel

Well-Known Member
Licensed User
Tu manifest editor esta muy mal, tiene que tenes la siguiente estructura.

B4X:
'This code will be applied to the manifest file during compilation.
'You do not need to modify it in most cases.
'See this link for for more information: http://www.b4x.com/forum/showthread.php?p=78136
AddManifestText(
<uses-sdk android:minSdkVersion="14" android:targetSdkVersion="22"/>
<supports-screens android:largeScreens="true"
    android:normalScreens="true"
    android:smallScreens="true"
    android:anyDensity="true"/>)
SetApplicationAttribute(android:icon, "@drawable/icon")
SetApplicationAttribute(android:label, "$LABEL$")
'End of default text.
AddApplicationText(
<meta-data
  android:name="com.google.android.geo.API_KEY"
  android:value="API KEY"/>
  <meta-data android:name="com.google.android.gms.version"
   android:value="@integer/google_play_services_version" />
)
no puedes colocar el servicio de google play antes de definir SdkVersion.
 

Carlos marin

Active Member
Licensed User
amigo ya me dio!!!! que felicidaaad. no sabes todos los dolores de cabeza que me dio muchas gracias mil gracias
 

bgsoft

Well-Known Member
Licensed User
Hola Carlos:

Rscheel te ha dado una buena explicación y un buen motivo sobre tu problema con el manifest, te sugiero que cuando tengas que agregar algo lo hagas al final y asi no tendras esos problemas, o si por ejemplo tienes que añadir un permiso lo hagas al final de estos.

Por otro lado te aconsejo que los permisos que no utilices los quites del manifest, si el programa lo tienes que subir al Play Store, cuando alguien vaya a instalar tu APP le pedirá que acepte todos esos permisos, y hay mucha gente que deja de bajarse las APP por exceso de permisos.

Saludos
 
Top