百度地图之添加覆盖物

前面我们关于百度地图的SDK的博客已经写了不少了,不过为了把地图这个功能做的更完善一些,同时也为了提高自己的技术,我们还是可以在目前所具有的功能之上再添加一些功能。

今天这篇博客,我就讲讲如何在地图上添加覆盖物。

一,和实现显示导航的图标一样,我们需要实例化一个BitmapDescriptor实例,然后调用BitmapDescriptorFactory的fromSource()方法,传入资源文件,这样的话,我们就可以在地图上出现覆盖物图标的第一步。
二,在Toolbar标题栏上面添加一个item选项,然后在 public boolean onOptionsItemSelected(MenuItem item){
}里面添加点击item之后的逻辑事件。不过在这之前,我们要准备好另外一个类,这个类里面放上我们覆盖物需要的一些参数。
//添加覆盖物图片
比如我新建了一个info类,然后在这个类里面来设置一些覆盖物的参数。

public class info implements Serializable{
    //private static final long serialVersionUID = -1010711775392052966L;
    private double latitude;
    private double longitude;
    private int zan;
    private String name;
    private int imgId;
    private String distance;
    public static List<info> infos = new ArrayList<info>();
    static
    {
        infos.add(new info(34.242652, 108.971171, R.drawable.a01, "英伦贵族小旅馆",
                "距离209米", 1456));
        infos.add(new info(34.242952, 108.972171, R.drawable.a02, "沙井国际洗浴会所",
                "距离897米", 456));
        infos.add(new info(34.242852, 108.973171, R.drawable.a03, "五环服装城",
                "距离249米", 1456));
       infos.add(new info(34.242152, 108.971971, R.drawable.a04, "老米家泡馍小炒",
               "距离679米", 1456));
    }
    public info(double latitude, double longitude, int imgId, String name,
                String distance, int zan)
    {
        this.latitude = latitude;
        this.longitude = longitude;
        this.imgId = imgId;
        this.name = name;
        this.distance = distance;
        this.zan = zan;
    }
    public double getLatitude()
    {
        return latitude;
    }
    public void setLatitude(double latitude)
    {
        this.latitude = latitude;
    }
    public double getLongitude()
    {
        return longitude;
    }
    public void setLongitude(double longitude)
    {
        this.longitude = longitude;
    }
    public int getImgId()
    {
        return imgId;
    }
    public void setImgId(int imgId)
    {
        this.imgId = imgId;
    }
    public String getName()
    {
        return name;
    }
    public void setName(String name)
    {
        this.name = name;
    }
    public String getDistance()
    {
        return distance;
    }
    public void setDistance(String distance)
    {
        this.distance = distance;
    }
    public int getZan()
    {
        return zan;
    }
    public void setZan(int zan)
    {
        this.zan = zan;
    }
}

三,准备好info类以后,我们就开始写点击item后的逻辑事件。

 case R.id.id_add:
                addOverlays(info.infos);
                break;
 private void addOverlays(List<info> infos)
    {
        baiduMap.clear();
        LatLng latLng = null;
        Marker marker = null;
        OverlayOptions options;
        for (info info : infos)
        {
            latLng = new LatLng(info.getLatitude(), info.getLongitude());// 经纬度

            options = new MarkerOptions()
                    .position(latLng)
                    .icon(mMarker)// 图标
                    .zIndex(5);
            marker = (Marker) baiduMap.addOverlay(options);
            Bundle arg0 = new Bundle();
            arg0.putSerializable("info", info);
            marker.setExtraInfo(arg0);
        }
        MapStatusUpdate msu = MapStatusUpdateFactory.newLatLng(latLng);
        baiduMap.setMapStatus(msu);
    }

这样的话,我们就把点击item,就可以显示出marker。
四,准备布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="220dp"
    android:background="#cc4e5a6b" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="150dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/img_border"
        android:scaleType="fitXY"
        android:src="@drawable/a01" >
    </ImageView>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:background="@drawable/bg_map_bottom" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="20dp"
            android:orientation="vertical" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="老米家泡馍"
                android:textColor="#fff5eb" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="距离200米"
                android:textColor="#fff5eb" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="20dp"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/map_zan"
                android:clickable="true" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="789"
                android:layout_gravity="center"
                android:textColor="#fff5eb" />
        </LinearLayout>
    </RelativeLayout>

</RelativeLayout>

然后我们贴一张效果图
这里写图片描述

五,点击marker的逻辑事件

//设置marker的点击事件
        baiduMap.setOnMarkerClickListener(new OnMarkerClickListener()
        {
            @Override
            public boolean onMarkerClick(Marker marker)
            {
                Bundle extraInfo = marker.getExtraInfo();
                info info = (info) extraInfo.getSerializable("info");
                ImageView iv = (ImageView) mMarkerLy
                        .findViewById(R.id.id_info_img);
                TextView distance = (TextView) mMarkerLy
                        .findViewById(R.id.id_info_distance);
                TextView name = (TextView) mMarkerLy
                        .findViewById(R.id.id_info_name);
                TextView zan = (TextView) mMarkerLy
                        .findViewById(R.id.id_info_zan);
                iv.setImageResource(info.getImgId());
                distance.setText(info.getDistance());
                name.setText(info.getName());
                zan.setText(info.getZan() + "");//把赞的类型由int 变成String
                 mMarkerLy.setVisibility(View.VISIBLE);
                return true;
            }
        });

不过,我们同样也要设置点击地图其他位置时候,让marker消失。

baiduMap.setOnMapClickListener(new OnMapClickListener()
        {

            @Override
            public boolean onMapPoiClick(MapPoi arg0)
            {
                return false;
            }

            @Override
            public void onMapClick(LatLng arg0)
            {
                mMarkerLy.setVisibility(View.GONE);
            }
        });

六,我们还希望在点击marker的时候,还希望在marker上面添加一行文字说明。
这时候我们需要实例化一个infowindow对象,然后给infowindow实例添加一些参数。

InfoWindow infoWindow;
                TextView tv = new TextView(context);
                tv.setBackgroundResource(R.drawable.location_tips);
                tv.setPadding(30, 20, 30, 50);
                tv.setText(info.getName());
                tv.setTextColor(Color.parseColor("#ffffff"));
                BitmapDescriptor tips = BitmapDescriptorFactory.fromView(tv);
                final LatLng latLng = marker.getPosition();
                Point p = baiduMap.getProjection().toScreenLocation(latLng);
                p.y -= 47;
                LatLng ll = baiduMap.getProjection().fromScreenLocation(p);
                infoWindow = new InfoWindow(tips, ll,p.y,
                        new OnInfoWindowClickListener()
                        {
                            @Override
                            public void onInfoWindowClick()
                            {
                                baiduMap.hideInfoWindow();
                            }
                        });
                baiduMap.showInfoWindow(infoWindow);

,这样的话,我们离大功告成就只有一步之遥了。我们需要在 baiduMap.setOnMapClickListener(new OnMapClickListener(){
}方法里面添加一句baiduMap.hideInfoWindow();用来隐藏infowindow.

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值