简体   繁体   English

Google 地图中的自动完成搜索栏

[英]AutoComplete Search bar in Google Maps

I'm creating an app based on places search.我正在创建一个基于地点搜索的应用程序。 I would like to know how can I add a search bar into my Google Map, where the user can select a Place, and I can capture what the user chose.我想知道如何在我的谷歌地图中添加一个搜索栏,用户可以在其中选择一个地方,我可以捕获用户选择的内容。

I'm trying to include an autocomplete Search Box that is displayed above the Google Map in the UI.我正在尝试在 UI 中包含一个显示在 Google 地图上方的自动完成搜索框。

You can simply use a PlaceAutoCompleteFragment .您可以简单地使用PlaceAutoCompleteFragment

First ensure that you're using the latest version of Google Play Services ( Version 8.4.0 and up includes the PlaceAutoCompleteFragment class ):首先确保您使用的是最新版本的 Google Play 服务(版本 8.4.0 及更高版本包括 PlaceAutoCompleteFragment 类):

compile 'com.google.android.gms:play-services-maps:11.0.2'
compile 'com.google.android.gms:play-services-location:11.0.2'
compile 'com.google.android.gms:play-services-places:11.0.2'

Then include the PlaceAutoCompleteFragment in your xml layout:然后在您的 xml 布局中包含 PlaceAutoCompleteFragment:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MapsActivity"
    android:orientation="vertical"
    android:weightSum="1">

    <fragment
        android:id="@+id/place_autocomplete"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:name="com.google.android.gms.location.places.ui.PlaceAutocompleteFragment"
        />

    <fragment
        android:id="@+id/map"
        class="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>


</LinearLayout>

Then set up a listener in your Activity:然后在您的 Activity 中设置一个侦听器:

import com.google.android.gms.common.api.Status;
import com.google.android.gms.location.places.Place;
import com.google.android.gms.location.places.ui.PlaceAutocompleteFragment;
import com.google.android.gms.location.places.ui.PlaceSelectionListener;

public class MapsActivity extends AppCompatActivity implements OnMapReadyCallback {

    private GoogleMap mMap;
    PlaceAutocompleteFragment placeAutoComplete;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_maps);

        placeAutoComplete = (PlaceAutocompleteFragment) getFragmentManager().findFragmentById(R.id.place_autocomplete);
        placeAutoComplete.setOnPlaceSelectedListener(new PlaceSelectionListener() {
            @Override
            public void onPlaceSelected(Place place) {

                Log.d("Maps", "Place selected: " + place.getName());
            }

            @Override
            public void onError(Status status) {
                Log.d("Maps", "An error occurred: " + status);
            }
        });

        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;
    }
}

When you run this code, you'll see the AutoComplete bar above the Google Map:运行此代码时,您将看到 Google 地图上方的自动完成栏:

在此处输入图片说明

When you click on the AutoComplete bar, it will look like this:当您单击 AutoComplete 栏时,它将如下所示:

在此处输入图片说明

Then, start typing, and select a Place:然后,开始输入,并选择一个地点:

在此处输入图片说明

When you tap on a place to select it, you will see the log from the PlaceSelectionListener:当你点击一个地方来选择它时,你会看到来自 PlaceSelectionListener 的日志:

D/Maps: Place selected: San Francisco

Yes, you can do that by make method for addMarker when you press on the place, You can use this code:是的,当您按下该位置时,您可以通过 addMarker 的 make 方法来执行此操作,您可以使用以下代码:

public class PlaceAutocompleteActivity extends AppCompatActivity implements OnMapReadyCallback {

    private GoogleMap mMap;
    PlaceAutocompleteFragment placeAutoComplete;

    LatLng myLat;
    Place placey;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_autocompleteplaces);

        getSupportActionBar().setTitle("Search about a Place");

        placeAutoComplete = (PlaceAutocompleteFragment) getFragmentManager().findFragmentById(R.id.place_autocomplete);
        placeAutoComplete.setOnPlaceSelectedListener(new PlaceSelectionListener() {
            @Override
            public void onPlaceSelected(Place place) {
                addMarker(place);
            }

            @Override
            public void onError(Status status) {
                Log.d("Maps", "An error occurred: " + status);
            }
        });

        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.mapplaces);
        mapFragment.getMapAsync(this);
    }

    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;
    }

    public void addMarker(Place p){

        MarkerOptions markerOptions = new MarkerOptions();

        markerOptions.position(p.getLatLng());
        markerOptions.title(p.getName()+"");
        markerOptions.icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE));

        mMap.addMarker(markerOptions);
        mMap.moveCamera(CameraUpdateFactory.newLatLng(p.getLatLng()));
        mMap.animateCamera(CameraUpdateFactory.zoomTo(13));
    }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM