项目背景:最近有一个需求,是要在百度地图上添加类似的网页版的地图标注功能,主要是能给用户临时的在地图上标注一个地方
网页版的效果
可以看见这个功能的要求是左边一个棒棒糖,右边有对应的文字说明
客户端的效果
相关类的使用
- ItemizedOverlay 自定义覆盖物
- OverlayItem 单个覆盖物的信息
- MapView 百度地图
(相关类的说明,请自行到百度开发者的网站,查看文档,本人用的是比较老的版本baidumapapi_v2_4_1.jar,他们不换新版本,我也很无奈)
因为百度地图不提供同时含图片和文字的覆盖物 ItemizedOverlay,只支持drawable的资源,作为覆盖物的标识,但是我们都知道bitmap是能转drawable的bitmapdrawable,那就可以将文字和图片转成bitmap,对应的转成drawable就可以了,代码如下:
private ItemizedOverlayMark markOverlay;
//这里ItemizedOverlayMark 继承了ItemizedOverlay,因为要重写ontap的方法
markOverlay = new ItemizedOverlayMark(context.getResources().getDrawable(R.drawable.icon_marka), mMapView);
mMapView.getOverlays().add(markOverlay);
mMapView.regMapTouchListner(new MKMapTouchListener() {
private DialogView dv;
private EditText et_mark;
private View contView;
@Override
public void onMapLongClick(GeoPoint arg0) {
}
@Override
public void onMapDoubleClick(GeoPoint arg0) {
}
@Override
public void onMapClick(final GeoPoint arg0) {
if (ib_mark.isSelected()) {
if (dv == null) {
dv = new DialogView(context);
contView = View.inflate(context, R.layout.view_editdailog, null);
et_mark = (EditText) contView.findViewById(R.id.et_mark);
et_mark.setImeOptions(EditorInfo.IME_ACTION_DONE);
dv.setcontent(contView);
}
dv.AddDialogClickListener(new OnDialogClickListener() {
@Override
public void OnOKClickListener(View v) {
if (TextUtils.isEmpty(et_mark.getText().toString())) {
ToastUtils.showToast(context, "请输入内容!");
} else {
closeSoftInput(context, et_mark);
//第一个参数是点,第二个是title,第三个是字体片段(这里用不上,传空)
OverlayItem item = new OverlayItem(arg0, et_mark.getText().toString(), "");
item.setMarker(new BitmapDrawable(makerBitmap(item.getTitle())));
markOverlay.addItem(item);
mMapView.refresh();
}
}
@Override
public void OnCustomClickListener(View v) {
}
@Override
public void OnCancelClickListener(View v) {
}
});
dv.show();
}
}
});
/**
* 创建字体的bitmap
*
* @param msg
* @return
*/
private Bitmap makerBitmap(String msg) {
Rect rect = new Rect();
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setTextSize(DensityUtil.sp2px(context, 12));
paint.getTextBounds(msg, 0, msg.length(), rect);
int textWidth = rect.width();
int textHeight = rect.height();
int bitmapWidth = (int) (textWidth + 20);
int bitmapHeight = (int) (textHeight * 1.5f);
Bitmap markBmp = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_mark2);
Bitmap newBmp = Bitmap.createBitmap(bitmapWidth, markBmp.getHeight() + bitmapHeight, Config.ARGB_8888);
Canvas canvas = new Canvas(newBmp);
canvas.drawColor(Color.TRANSPARENT);
Paint paintRect = new Paint();
paintRect.setColor(context.getResources().getColor(R.color.black));
paintRect.setStyle(Paint.Style.STROKE);
paintRect.setStrokeWidth(2);
canvas.drawRect(2, 2, bitmapWidth - 2, bitmapHeight, paintRect);
paintRect.setColor(context.getResources().getColor(R.color.white));
paintRect.setStyle(Paint.Style.FILL);
canvas.drawRect(2, 2, bitmapWidth - 2, bitmapHeight, paintRect);
Paint paintText = new Paint();
paintText.setColor(context.getResources().getColor(R.color.black));
paintText.setTextSize(DensityUtil.sp2px(context, 12));
paintText.setAntiAlias(true);
canvas.drawText(msg, 10, bitmapHeight - textHeight / 2, paintText);
Paint markPaint = new Paint();
markPaint.setColor(context.getResources().getColor(R.color.white));
canvas.drawBitmap(markBmp, bitmapWidth / 2 - markBmp.getWidth() / 2, bitmapHeight, markPaint);
canvas.save(Canvas.ALL_SAVE_FLAG);
canvas.restore();
return newBmp;
}