3

在 iOS 中,您可以通过调用以下方法轻松设置标记的标注:

[marker setCanShowCallout:YES];
[marker setRightCalloutAccessoryView:YOUR_BUTTON];

但我找不到 Mapbox Android SDK 的这个功能。我现在确实有一个侦听器,它可以检测到标注视图上的触摸,但是我如何设置标注图像/按钮?

Marker marker = new Marker(p.getTitle(), p.getCatagoryName(), new LatLng(p.getLatitude(), p.getLongitude()));
                        marker.setMarker(getResources().getDrawable(getResources().getIdentifier(string, "drawable", getActivity().getPackageName())));
                                mMapView.addMarker(marker);

                        InfoWindow toolTip = marker.getToolTip(mMapView);
                        View view = toolTip.getView();
                        // view.setBackgroundResource(R.drawable.callout_button); THIS DOES NOT WORK
                        view.setOnTouchListener(new View.OnTouchListener() {
                            @Override
                            public boolean onTouch(View view, MotionEvent motionEvent) {
                                Log.e(TAG, "onTouch");

                                return true;
                            }
                        });
4

2 回答 2

5

您必须自己构建此功能,但通过定义自定义标记和工具提示布局实际上很容易完成。

首先定义您的工具提示布局。显然,它必须是一个 RelativeLayout 才能定位标注图像。将您的上下文设置为创建标记的任何活动。必须包含底部的 TipView,因为它控制自定义 Tooltip 的大小。

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@color/white"
    android:id="@+id/parent_layout"
    android:padding="5dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    tools:context="com.XXX.MainActivity">

    <TextView
        android:id="@+id/tooltip_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/black"
        android:textSize="18sp"
        android:maxEms="17"
        android:layout_gravity="left"
        android:layout_weight="1"
        android:text="@string/toolTipTitle"/>

    <TextView
        android:id="@+id/tooltip_description"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/black"
        android:textSize="14sp"
        android:maxEms="17"
        android:text="@string/toolTipDescription"
        android:layout_below="@+id/tooltip_title"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/marker_about"
        android:src="@drawable/ic_action_about"
        android:layout_toEndOf="@+id/tooltip_description"
        android:layout_toRightOf="@+id/tooltip_description"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="10dp" />

    <com.mapbox.mapboxsdk.views.TipView
            android:layout_width="132dp"
            android:layout_height="10dp"/>
</RelativeLayout>

然后创建一个自定义的 Marker 类并重写 createTooltip 方法以返回具有新布局的 InfoWindow:

public class CustomMarker extends Marker {

    public CustomMarker(MapView mv, String aTitle, String aDescription, LatLng aLatLng){
        super(mv, aTitle, aDescription, aLatLng);
    }

    @Override
    protected InfoWindow createTooltip(MapView mv) {
        return new InfoWindow(R.layout.custom_tooltip, mv);
    }
}

这不应该改变任何其他功能,因此您拥有的代码仍然可以工作。只需将 Marker 更改为自定义类名,您就应该设置好。

编辑:这是实际上将 CustomMarker 和 InfoWindow 设置为我的地图的代码。您可以看到我在点击时启动了另一个活动,并且我为标记设置了一个自定义图标,但这些东西不是必需的:

        CustomMarker m =
                new CustomMarker(mv, report.issue, report.getFormattedDateString(), latLng);
        m.setIcon(new Icon(this, Icon.Size.LARGE, "oil-well", "FF0000"));
        //get the InfoWindow's view so that you can set a touch listener which will switch
        //to the marker's detailed view when clicked
        final InfoWindow infoWindow = m.getToolTip(mv);
        View view = infoWindow.getView();
        view.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                //make sure to choose action down or up, otherwise the intent will launch twice
                if(motionEvent.getAction() == MotionEvent.ACTION_DOWN){
                    startActivity(intent);
                    //close the InfoWindow so it's not still open when coming back to the map
                    infoWindow.close();
                }
                return true;
            }
        });
        mv.addMarker(m);

我也在使用 SDK 0.5.0-SNAPSHOT。我不确定这是否适用于旧版本的 SDK。

于 2014-10-23T15:59:59.973 回答
3

ryansh 的出色响应要求我在自定义布局中包含 ID 为 tooltip_title 和 tooltip_description 的 TextView。我还必须添加第三个 tooltip_subdescription TextView。默认的 InfoWindow 代码假定这些视图存在,如果不存在就会崩溃。为了获得更多控制,我扩展了 InfoWindow,覆盖了 onOpen,并且能够为工具提示使用我想要的任何布局。对于扩展 Marker 类中重写的 createTooltip,我很自然地实例化并返回了我的扩展 InfoWindow 对象。

更新。这是扩展标记和信息窗口以支持自定义工具提示的示例:

public class MapboxMarker extends Marker {
    private MyInfoWindow mInfoWindow;

    public class MyInfoWindow extends InfoWindow {

        public MyInfoWindow(int layoutResId, MapView mapView) {
            super(layoutResId, mapView);
        }

        public void onOpen(Marker overlayItem) {
            //
            //  Set data on mInfoWindow.getView()
            //
        }

    }

    public MapboxMarker(MapView mv, LatLng aLatLng, MapController mapController){
        super(mv, "Title", "Description", aLatLng);
    }

    @Override
    protected InfoWindow createTooltip(MapView mv) {
        mInfoWindow = new MyInfoWindow(R.layout.custom_tooltip_layout, mv);
        return mInfoWindow;
    }
}
于 2014-12-15T22:05:47.697 回答