Android地图开发：自定义地图弹出框内容

Android地图开发有个很常见的需求，比如地图上绘制一系列图标，点击每个图标，弹出一个气泡，里面是详细内容，有图片、文字等等。

这篇文章讲的是如何自定义一个弹出框，里面包含图片、文字等等，思路是这样的：

我们写一个弹出框的xml布局文件，需要弹出的时候，将这个view转换成bitmap，然后转换成drawable，然后就可以控制这个drawable的位置，比如让它显示在图标的上方，当然可以随意设定弹出的位置。

我们先看看效果图：

地图使用的是图吧的地图，实际上Google Maps也是一样的，API调用方法都一样的，只是图吧地图xml布局里面不需要key。

上图中弹出的气泡时间上是一个LinearLayout，只是将其转换成了drawable，以便使用canvas绘制。

这里我们分成两个部分讲，分成两个类，MapPopupActivity（地图页面）和MapPopupView（弹出框）。

1.首先，我们准备好地图，在此地图上我们将绘制一系列图标，点击图标时弹出气泡。内容有点多，我会进行注释。

MapPopupActivity.java

import android.content.res.Resources;
import android.graphics.Canvas;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import com.mapbar.android.maps.*;
import com.tuan800.credit.R;
import com.tuan800.credit.views.MapPopupView;


import java.util.ArrayList;
import java.util.List;


/**
 * Created by IntelliJ IDEA.
 * User: chenjishi
 * Date: 12-4-10
 * Time: 下午4:29
 * To change this template use File | Settings | File Templates.
 */
public class MapPopupActivity extends MapActivity implements MapPopupView.PopupViewTapListener {
    private List<Spot> mSpotList;

    private MapView mMapView;
    private MapController mMapController;
    private List<Overlay> mOverlayList;

    private OverItemT mOverItemT;

//弹出窗口类
    private MapPopupView mMapPopupView;

//设定一个地图中心位置
    private double mLat = 39.973860D;
    private double mLng = 116.382240D;
    private Resources mRes;


    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        setContentView(R.layout.map_view);
        
        mMapView = (MapView) this.findViewById(R.id.map_view);
        mMapView.setBuiltInZoomControls(true);
        mMapController = mMapView.getController();
        mMapController.setZoom(12);

        mRes = getResources();

//默认图标
        Drawable defaultIcon = mRes.getDrawable(R.drawable.my_location);
        defaultIcon.setBounds(0, 0, defaultIcon.getIntrinsicWidth(), defaultIcon.getIntrinsicHeight());

//绘制图标的内部类
        mOverItemT = new OverItemT(defaultIcon);

//初始化弹出窗
        mMapPopupView = new MapPopupView(this, mRes.getDrawable(R.drawable.category_1));

//处理弹出窗的点击事件
        mMapPopupView.setPopupViewListener(this);


        mOverlayList = mMapView.getOverlays();

//下面这两句很重要，不然图标无法显示
        mOverlayList.add(mOverItemT);
        mOverlayList.add(mMapPopupView);

//设置地图中心点
        setMyLocation();

//初始化一系列图标
        setData();

//往地图上绘制图标
        setMarkers();
    }


    private void setMyLocation() {
        GeoPoint p = new GeoPoint((int) (mLat * 1E6), (int) (mLng * 1E6));
        mOverItemT.addOverlay(new OverlayItem(p, "我的位置", ""), 0);
        mMapController.setCenter(p);
    }


    private void setMarkers() {
        if (mSpotList.size() == 0) {