Nativecript-autocompletion and Google Place Autocompletion

plugins

#1

Has anyone here ever implemented a google place auto-completion with nativescript? If so please do provide some examples of it as I am stuck.
Thank you


#2

I implemented it very recently.
But this is only for android.

exports.onSearchTap = function() {
    try {
        const PLACE_AUTOCOMPLETE_REQUEST_CODE = 1;
        const intent = new PlaceAutocomplete.IntentBuilder(
            PlaceAutocomplete.MODE_FULLSCREEN
        ).build(app.android.foregroundActivity);
        app.android.foregroundActivity.startActivityForResult(
            intent,
            PLACE_AUTOCOMPLETE_REQUEST_CODE
        );
    } catch (e) {
        console.dir(e);
        // TODO: Handle the error.
    }
};
app.android.foregroundActivity.onActivityResult = function(
    requestCode,
    resultCode,
    intent
) {
    const PLACE_AUTOCOMPLETE_REQUEST_CODE = 1;
    if (requestCode === PLACE_AUTOCOMPLETE_REQUEST_CODE) {
        if (resultCode === android.app.Activity.RESULT_OK) {
            const place = PlaceAutocomplete.getPlace(
                app.android.context,
                intent
            );

            const navigationEntry = {
                moduleName: routes.searchResults,
                animated: true,
                transition: {
                    name: "slide",
                    duration: 380,
                    curve: "easeIn"
                },
                context: {
                    lat: place.getLatLng().latitude,
                    lng: place.getLatLng().longitude
                }
            };
            frameModule.topmost().navigate(navigationEntry);
        } else if (resultCode === PlaceAutocomplete.RESULT_ERROR) {
            const status = PlaceAutocomplete.getStatus(
                app.android.context,
                intent
            );
            console.log(status.getStatusMessage());
        } else if (resultCode === android.app.Activity.RESULT_CANCELED) {
            // The user canceled the operation.
            console.log("User cancelled the operation");
        }
    }
};

put these in your code behind, change the navigation route to your liking,
and call onSearchTap when the search bar is clicked.
(to you app vaiable you need to require it first, const app = require("application");
also, add const PlaceAutocomplete = com.google.android.gms.location.places.ui.PlaceAutocomplete; at the top)

in your app/Android_Resources/android/app.gradle
add these dependencies

dependencies {
        compile 'com.google.android.gms:play-services:11.2.2'
        compile 'com.google.android.gms:play-services-places:11.2.2'
}

^ try the second one first, if you get some build errors, because of other
plugins, you’ll need both lines.

Finally add this inside application element of app manifest files

<meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="REPLACE_THIS_WITH_API_KEY"/>

Hope that helps :slight_smile:


#3

thank you bro. Is it possible that you can put your project link? Thing is I am having issue with play services part as 11.2.2 is outdated and I am using 11.4.0 for firebase already


#4

You can use 11.4.0 just by changing version in the dependencies.
Cannot share the project link as it is on a private repo.


#5

@multishiv19

Hello,
Could you compile this code for ios?
I was using the plugins but it sends me an error when it is joined with the firebase plugin. To see if you could help me.


#6

@terminator10
I’m able to use it with firebase plugin just fine.
Can you share the build error? it will help debug the issue.