如何在自有App地图中实现点击地点图标展示详情（无需Place Picker）

我明白你想要的效果——在自己的App地图里点击本地场所（ATM、医院这类POI）的图标时，直接在当前地图界面内展示商家详情，完全不用跳转到外部的Place Picker页面对吧？其实核心思路就是自己接管地图标记的点击事件，调用Places API获取场所数据，再用自定义UI组件在App内展示，下面一步步来教你实现：

一、前期准备 #

首先得确保你的App已经集成了基础的地图能力，并且配置好Places API的权限：

• 集成Google Maps Android SDK，确保地图能正常加载显示
• 在Google Cloud Console启用Places API，并获取有效的API密钥
• 在AndroidManifest.xml中添加必要权限：

  <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
  <uses-permission android:name="android.permission.INTERNET" />
  

  同时在Manifest的<application>标签下配置API密钥：

  <meta-data
      android:name="com.google.android.geo.API_KEY"
      android:value="你的API密钥"/>
  

二、处理地图标记的点击事件 #

当地图加载完成后，你需要给地图设置标记点击监听器，这样用户点击POI标记时能触发后续逻辑：

// 初始化完成后的地图对象
GoogleMap mMap;

// 设置标记点击监听
mMap.setOnMarkerClickListener(marker -> {
    // 关键：每个标记需要关联对应的Place ID，这里假设你在添加标记时把Place ID存在了tag里
    String placeId = (String) marker.getTag();
    if (placeId != null) {
        // 调用方法获取场所详情
        fetchPlaceDetails(placeId);
    }
    return true; // 表示已处理点击事件，不再触发默认行为
});

如果是地图原生加载的POI，你也可以直接监听POI点击事件获取Place ID：

mMap.setOnPoiClickListener(poi -> {
    String placeId = poi.getPlaceId();
    fetchPlaceDetails(placeId);
});

三、调用Places API获取场所详情 #

使用PlacesClient来请求指定Place ID的详细数据，你可以按需指定需要获取的字段（比如名称、地址、评分、联系方式等）：

private PlacesClient placesClient;

// 在onCreate中初始化PlacesClient
placesClient = Places.createClient(this);

private void fetchPlaceDetails(String placeId) {
    // 定义需要获取的场所字段
    List<Place.Field> requiredFields = Arrays.asList(
        Place.Field.NAME,
        Place.Field.ADDRESS,
        Place.Field.RATING,
        Place.Field.PHONE_NUMBER,
        Place.Field.WEBSITE_URI,
        Place.Field.PHOTO_METADATAS // 如果需要展示场所照片
    );

    // 创建请求
    FetchPlaceRequest request = FetchPlaceRequest.newInstance(placeId, requiredFields);

    // 发起请求并处理结果
    placesClient.fetchPlace(request)
        .addOnSuccessListener(response -> {
            Place place = response.getPlace();
            // 获取到数据后，展示自定义详情弹窗
            showCustomPlaceDetails(place);
        })
        .addOnFailureListener(exception -> {
            if (exception instanceof ApiException) {
                ApiException apiException = (ApiException) exception;
                int statusCode = apiException.getStatusCode();
                // 处理错误，比如提示用户"获取场所详情失败"
                Log.e("PlaceDetails", "Error fetching place: " + statusCode);
            }
        });
}

四、自定义详情展示UI（无需跳转） #

这一步是核心，你需要在App内创建一个自定义的弹窗或底部弹窗（比如用BottomSheetDialogFragment），把获取到的场所数据填充进去，让用户停留在当前地图界面：

示例：用BottomSheetDialog展示详情 #

1. 先创建一个布局文件dialog_place_details.xml，比如：

<?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="wrap_content"
    android:orientation="vertical"
    android:padding="16dp">

    <TextView
        android:id="@+id/tv_place_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:textStyle="bold"/>

    <TextView
        android:id="@+id/tv_place_address"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:layout_marginTop="8dp"/>

    <TextView
        android:id="@+id/tv_place_rating"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:layout_marginTop="8dp"/>

    <!-- 可以添加更多控件，比如电话、网址按钮等 -->
</LinearLayout>

2. 然后在代码中加载这个布局并展示：

private void showCustomPlaceDetails(Place place) {
    BottomSheetDialog dialog = new BottomSheetDialog(this);
    View dialogView = getLayoutInflater().inflate(R.layout.dialog_place_details, null);

    // 填充数据到控件
    TextView tvName = dialogView.findViewById(R.id.tv_place_name);
    TextView tvAddress = dialogView.findViewById(R.id.tv_place_address);
    TextView tvRating = dialogView.findViewById(R.id.tv_place_rating);

    tvName.setText(place.getName());
    tvAddress.setText(place.getAddress());
    tvRating.setText(String.format("评分：%.1f", place.getRating()));

    // 如果需要展示照片，可以额外处理Place.Field.PHOTO_METADATAS
    // 这里省略照片加载逻辑，你可以用Glide等库加载场所照片

    dialog.setContentView(dialogView);
    dialog.show();
}

额外注意事项 #

• 权限处理：记得在运行时申请位置权限，否则可能无法获取到附近的POI数据。
• 性能优化：可以缓存已经获取过的场所详情，避免重复请求API。
• UI定制：你可以根据App的设计风格，把详情弹窗改成悬浮窗、侧边栏等样式，完全贴合自己的App体验。

内容的提问来源于stack exchange，提问作者Fazla Elahi Md. Jubayer