Android：GoogleMaps 标记详细信息片段

Question

我是 Android 的初学者，我正在尝试实现类似于 Google Maps App 的功能。 当我按下标记时，我希望在SupportMapFragment顶部出现一个带有详细信息的新片段，如下所示：

我怎样才能做到这一点？

这是该片段的默认布局吗？

这甚至是一个片段还是只是一个修改过的信息 window？

Answer 1

是的，您可以使用这个库轻松实现它，它在最小化和拉伸时支持 2 种布局，我在谷歌地图应用程序之后实现了类似的行为，获取如下数据并将其设置在布局中

这是链接

样本用法是

    <com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:umanoPanelHeight="68dp"
    sothree:umanoShadowHeight="4dp">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="Main Content"
        android:textSize="16sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center|top"
        android:text="The Awesome Sliding Up Panel"
        android:textSize="16sp" />
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

Answer 2

我想到了。 我需要的是一个底页对话框。 这是我用作灵感来源的非常有用的指南。

步骤1

在 `app.gradle` 中实现材质组件库：

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_gravity="bottom">
   
        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="Rent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>

第2步

在 res->layout 中创建您选择的布局。 我的看起来像这样：

 @Override
   public boolean onMarkerClick(Marker marker) {
      showBottomSheetDialog();
      return false;
   } 

布局与底部对齐。

第 3 步

定义一个实例化 BottomSheetDialog 的方法：

 private void showBottomSheetDialog() { final BottomSheetDialog bottomSheetDialog = new BottomSheetDialog(getContext()); bottomSheetDialog.setContentView(R.layout.MY_LAYOUT_NAME); AppCompatButton btn = bottomSheetDialog.findViewById(R.id.btn_view); bottomSheetDialog.show(); }

第4步

这一步是额外的，如果您想查看如何通过按下 GoogleMap 标记来调用 BottomSheetDialog。

确保处理 MapSupportFragment 的 class 实现OnMapReadyCallback 、 GoogleMap.OnMarkerClickListener和（如果需要标记集群） ClusterManager.OnClusterItemClickListener 。 覆盖必要的方法：

 @Override public boolean onMarkerClick(Marker marker) { showBottomSheetDialog(); return false; }

如果您需要集群，请不要忘记在 @onMapReady() 中添加：

 map.setOnCameraIdleListener(clusterManager); map.setOnMarkerClickListener(clusterManager); clusterManager.setOnClusterItemClickListener(this);

瞧！