自定义地图覆盖物(包括自定义View和动画的显示)

目录[-]

• 官方例子
• 覆盖物（Marker）自定义
• 覆盖物（Marker）动画
• 效果图

官方例子

这个百度地图 android SDK 关于基础地图覆盖物的例子

http://developer.baidu.com/map/wiki/index.php?title=androidsdk/guide/basicmap#.E6.A0.87.E6.B3.A8.E8.A6.86.E7.9B.96.E7.89.A9 

 

 

//定义Maker坐标点 
LatLng point = new LatLng(39.963175, 116.400244); 
//构建Marker图标
BitmapDescriptor bitmap = BitmapDescriptorFactory
.fromResource(R.drawable.icon_marka); 
//构建MarkerOption，用于在地图上添加
 Marker  OverlayOptions option = new MarkerOptions()  
    .position(point)  
    .icon(bitmap); 
//在地图上添加Marker，并显示  
mBaiduMap.addOverlay(option);

其中的Marker 也就是标记的意思，就是咱们今天要说的覆盖物，其中的难点在于它只接收一个bitmap来显示，那假如当我们有需求，需要加入一些复杂的View(比如Linearlayout嵌套一个TextView和ImageView)来代替这个bitmap怎么办？在我查了很多资料以后，终于找到了解决方案。

 

覆盖物（Marker）自定义

其实解决方案很简单，就是将View或者Viewgroup转化为Bitmap就行了。因为地图的SDK是第三方提供的，我们没有权利要求别人去改接口来适应我们，所以我们只好想办法去适应他们。

现在我自定义了一个布局，如下所示

point.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:background="@drawable/popup"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">

        <ImageView android:layout_width="35dp"
                   android:layout_height="35dp"
                   android:scaleType="centerCrop"
                   android:padding="5dip"
                   android:src="@drawable/head_1"/>

        <TextView android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:textColor="@android :color/black"
                  android:textSize="20sp"
                  android:text="测试"
              />

</LinearLayout>

然后想让它转为Bitmap之后，装进Marker。下面是核心转换函数：

    private Bitmap getViewBitmap(View addViewContent) {

        addViewContent.setDrawingCacheEnabled(true);

        addViewContent.measure(
                View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED),
                View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
        addViewContent.layout(0, 0,
                addViewContent.getMeasuredWidth(),
                addViewContent.getMeasuredHeight());

        addViewContent.buildDrawingCache();
        Bitmap cacheBitmap = addViewContent.getDrawingCache();
        Bitmap bitmap = Bitmap.createBitmap(cacheBitmap);

        return bitmap;
    }

其中，最外层的布局我用Relativelayout尝试过，但无法转化得到bitmap，深层次的原因有兴趣大家可以试试。

只要最外层是LinearLayout，里面的布局你可以随意写，不管再嵌套多少层其他的布局，比如Relativelayout，都能顺利的显示到地图上。

覆盖物（Marker）动画

实现动画的前提是，你要拿到当前只知道经纬度的这一点在屏幕上的位置，拿到之后你就可以做一个假动画，把覆盖物放到目标位置之后再根据经纬度添加真实的Marker。

下面是转换代码：

Point p = baiduMap.getProjection().toScreenLocation(target);

其实核心的就这一句，拿到target(类型为LatLng)的点的经纬度信息后，将它转化为相对于屏幕上的点Point。

Point的x和y属性就是当前相对屏幕的位置，之后你想做什么动画就随便你了，还是挺简单，是吧。

 

效果图

才接触地图不到2天，有错误的地方请指正，谢谢大家。

 

 

这里是Freestyletime@foxmail.com，欢迎交流。

本人原创作品，转载请标明出处