信息窗口

请选择平台: Android iOS JavaScript

信息窗口在地图上方的弹出窗口中显示文本或图像。信息窗口始终固定在某个标记上。默认情况下,当用户点按标记时,系统就会显示相应的信息窗口。

代码示例

GitHub 上的 ApiDemos 代码库包含一个展示所有信息窗口功能的示例:

简介

您可以在用户点按标记时,通过信息窗口向其显示信息。一次只能显示一个信息窗口。如果用户点击一个标记,系统将关闭当前信息窗口,并显示新的信息窗口。请注意,如果用户点击一个目前正显示信息窗口的标记,该信息窗口将关闭并重新打开。

信息窗口绘制时朝向设备屏幕的相反方向,在其关联标记的上方居中显示。默认信息窗口包含以粗体显示的标题,以及标题下方的(可选)文字片段。

添加信息窗口

添加信息窗口的最简单方法是设置相应标记的 title()snippet() 方法。设置这些属性后,每当用户点击标记,系统就会向其显示信息窗口。

Java


final LatLng melbourneLatLng = new LatLng(-37.81319, 144.96298);
Marker melbourne = map.addMarker(
    new MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne")
        .snippet("Population: 4,137,400"));

      

Kotlin


val melbourneLatLng = LatLng(-37.81319, 144.96298)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne")
        .snippet("Population: 4,137,400")
)

      

显示/隐藏信息窗口

信息窗口设计为对用户触摸事件作出响应。如果您愿意,可以通过对目标标记调用 showInfoWindow() 以编程方式显示信息窗口。可通过调用 hideInfoWindow() 隐藏信息窗口。

Java


final LatLng melbourneLatLng = new LatLng(-37.81319, 144.96298);
Marker melbourne = map.addMarker(
    new MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne"));
melbourne.showInfoWindow();

      

Kotlin


val melbourneLatLng = LatLng(-37.81319, 144.96298)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne")
)
melbourne?.showInfoWindow()

      

您还可以为各个聚类标记创建信息窗口。请参阅有关为各个聚类标记添加信息窗口的指南。

自定义信息窗口

您还可以自定义信息窗口的内容和设计。为此,您必须创建 InfoWindowAdapter 接口的具体实现,然后通过您的实现调用 GoogleMap.setInfoWindowAdapter()。该接口包含两个供您实现的方法:getInfoWindow(Marker)getInfoContents(Marker)。API 将首先调用 getInfoWindow(Marker),如果系统返回 null,则会接着调用 getInfoContents(Marker)。如果仍返回 null,则系统会使用默认信息窗口。

上述第一个方法 (getInfoWindow()) 可让您提供一个可用于整个信息窗口的视图。上述第二个方法 (getInfoContents()) 可让您仅自定义窗口的内容,但仍保留默认信息窗口的框架和背景。

以下图像显示的是一个默认信息窗口、一个包含自定义内容的信息窗口以及一个包含自定义框架和背景的信息窗口。

信息窗口对比

信息窗口事件

MarkerDemoActivity 示例包含用于注册和处理信息窗口事件的示例代码。

您可以使用 OnInfoWindowClickListener 来监听信息窗口上的点击事件。如需在地图上设置此监听器,请调用 GoogleMap.setOnInfoWindowClickListener(OnInfoWindowClickListener)。当用户点击信息窗口时,系统将调用 onInfoWindowClick(Marker) 并以默认突出显示颜色(灰色)突出显示信息窗口。

Java


class InfoWindowActivity extends AppCompatActivity implements
    GoogleMap.OnInfoWindowClickListener,
    OnMapReadyCallback {

    @Override
    public void onMapReady(GoogleMap googleMap) {
        // Add markers to the map and do other map setup.
        // ...
        // Set a listener for info window events.
        googleMap.setOnInfoWindowClickListener(this);
    }

    @Override
    public void onInfoWindowClick(Marker marker) {
        Toast.makeText(this, "Info window clicked",
            Toast.LENGTH_SHORT).show();
    }
}

      

Kotlin


internal inner class InfoWindowActivity : AppCompatActivity(),
    OnInfoWindowClickListener,
    OnMapReadyCallback {
    override fun onMapReady(googleMap: GoogleMap) {
        // Add markers to the map and do other map setup.
        // ...
        // Set a listener for info window events.
        googleMap.setOnInfoWindowClickListener(this)
    }

    override fun onInfoWindowClick(marker: Marker) {
        Toast.makeText(
            this, "Info window clicked",
            Toast.LENGTH_SHORT
        ).show()
    }
}

      

同样,您可以使用 OnInfoWindowLongClickListener(可通过调用 GoogleMap.setOnInfoWindowCloseListener(OnInfoWindowCloseListener) 进行设置)监听长按事件。该监听器的运行方式与点击监听器类似,当发生长按事件时,系统会通过 onInfoWindowClose(Marker) 回调通知该监听器。

如需在信息窗口关闭时收到通知,请使用 OnInfoWindowCloseListener(可通过调用 GoogleMap.setOnInfoWindowCloseListener(OnInfoWindowCloseListener) 进行设置)。您将收到 onInfoWindowClose(Marker) 回调。

刷新信息窗口相关注意事项:如果用户通过点按某个已经具有打开的信息窗口的标记来刷新信息窗口,则会触发 onInfoWindowClose() 事件。但是,如果您对打开的信息窗口以程序化方式调用 Marker.showInfoWindow(),则不会触发 onInfoWindowClose() 事件。后面一种行为基于这样一种假设:您知道信息窗口将关闭并且会重新打开。

正如上文对信息窗口的介绍,信息窗口并非实时视图,而是以图像形式渲染在地图上的视图。因此,您在该视图上设置的任何监听器都会被忽略,并且您也无法区分该视图不同部分上的点击事件。建议您不要在自定义信息窗口内放置按钮、复选框或文本输入等互动组件。