Android开发初体验之百度地图开发（3）

在前面文章我分享了如何开始初步的使用百度地图API以及地图搜索功能，这次我将分享如何在百度地图上设置marker，以及info窗口，这次也主要是参考了鸿洋老师的博客，大家想继续学习的话也可以关注一下鸿洋老师的博客。当然百度地图的官方demo也有相关的教程，大家也可以看看。

了解百度地图如何添加覆盖物

覆盖物就是我们自己往地图上添加的东西，这个形状可以由自己设置，标注点里面的信息也由自己设置，大家也可以看看百度地图官方对于覆盖物的介绍。

上面图片所示的就是如何添加marker，右边就是覆盖物的类型了，其实几种都差不多，大家学会一种其他的差不多也就会了。

为marker设置信息

记录相应点的经纬度信息

我们想要添加marker，首先得找一些地点的经纬度信息，这个我们可以去百度地图api 的官网去找到坐标拾取器。如下图所示：

打开坐标拾取器之后我们就输入自己想添加点的位置，然后记录下位置的经纬度就可以了。

编写布局文件

我们要想为地图添加info窗口的话，我们得先写一个info窗口，我们在布局文件下添加下面这些代码

 <RelativeLayoutandroid:id="@+id/marker_info"android:layout_width="350dp"android:layout_height="120dp"android:background="#FFFFFF"android:clickable="true"android:layout_marginBottom="33dp"android:visibility="gone"android:layout_above="@+id/my_location"android:layout_centerHorizontal="true"><ImageViewandroid:id="@+id/info_img"android:layout_width="90dp"android:layout_height="90dp"android:layout_marginLeft="12dp"android:layout_marginRight="12dp"android:alpha="1.0"android:background="@drawable/map_image_border_white"android:clickable="true"android:scaleType="fitXY"android:src="@drawable/axin"android:layout_centerVertical="true"android:layout_alignParentStart="true"android:layout_marginStart="10dp" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id="@+id/info_name"android:text="@string/app_name"android:textColor="#121212"android:textSize="15sp"android:layout_marginStart="33dp"android:layout_alignTop="@+id/info_img"android:layout_toEndOf="@+id/info_img" /><TextViewandroid:id="@+id/info_content"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/app_name"android:textSize="20sp"android:textColor="#121212"android:layout_centerVertical="true"android:layout_alignStart="@+id/info_name" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="信誉积分:"android:layout_alignBottom="@+id/info_img"android:layout_alignStart="@+id/info_content"android:id="@+id/textView5" /><TextViewandroid:id="@+id/info_credit"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="100"android:layout_alignBottom="@+id/textView5"android:layout_alignParentEnd="true"android:layout_toEndOf="@+id/textView5" /></RelativeLayout>

创建info类

我们为了模拟后台提供数据，我们先写一个info类，由于我们仅仅只是模拟，所以我们把info类里面的数据写成静态的，然后为info类设置构造函数就行了。

package com.example.test;import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;public class Info implements Serializable {/*** 精度*/private double latitude;/*** 纬度*/private double longitude;/*** 图片ID，服务器中为图片路径*/private int imgId;/*** 姓名*/private String name;/*** 帮助或者服务内容*/private String content;/** 信誉积分*/private String credit;public static List<Info> infos = new ArrayList<Info>();static {infos.add(new Info(30.652696,104.056063, R.drawable.axin, "阿信", "帮我在城南买个火锅底料", "120"));infos.add(new Info(30.669488,104.061614, R.drawable.chenduling, "小陈","可以在成都地区跑个腿", "130"));infos.add(new Info(30.666397,104.034848,R.drawable.zhoujielun, "阿杰","想吃青羊区的李记兔头", "143"));infos.add(new Info(30.553369,114.305926, R.drawable.linjunjie, "大俊","我可以帮你们买江汉路附近的美食", "113"));infos.add(new Info(30.550239,114.309052, R.drawable.xuezhiqian,"小谦","我想配副眼睛","159"));infos.add(new Info(30.593933,114.277316, R.drawable.guobiting,"老郭","我想要一个孙中山纪念像！","148"));infos.add(new Info(39.915119,116.403963,R.drawable.alalei,"小蕾","我可以代买故宫门票哦","125"));infos.add(new Info(39.991002,116.328896,R.drawable.xiaoyan,"阿萌","我可以代买北京特产","254"));infos.add(new Info(39.916224,116.417435,R.drawable.dilireba,"胖迪","我想买个雕像","287"));}public Info(){}public Info(double latitude, double longitude, int imgId, String name, String content, String credit ){super();this.latitude = latitude;this.longitude = longitude;this.imgId = imgId;this.name = name;this.content = content;this.credit= credit;}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 String getName(){return name;}public int getImgId(){return imgId;}public void setImgId(int imgId){this.imgId = imgId;}public void setName(String name){this.name = name;}public String getContent(){return content;}public void setContent(String content){this.content = content;}public String getCredit(){return credit;}public void setCredit(String credit){this.credit = credit;}}

根据info类为控件设置信息

因为我们上面写好了info类，所以我们接下来写一个函数将info类中的信息设置到我们之前编写的控件上面。

 /*** 根据info为布局上的控件设置信息**/protected void popupInfo(RelativeLayout infowindows, Info info){ViewHolder viewHolder = null;if (infowindows.getTag() == null){viewHolder = new ViewHolder();viewHolder.infoImg = (ImageView) infowindows.findViewById(R.id.info_img);viewHolder.infoName = (TextView) infowindows.findViewById(R.id.info_name);viewHolder.infoContent = (TextView) infowindows.findViewById(R.id.info_content);viewHolder.infoCredit = (TextView) infowindows.findViewById(R.id.info_credit);infowindows.setTag(viewHolder);}viewHolder = (ViewHolder) infowindows.getTag();viewHolder.infoImg.setImageResource(info.getImgId());viewHolder.infoContent.setText(info.getContent());viewHolder.infoName.setText(info.getName());viewHolder.infoCredit.setText(info.getCredit());}/*** 复用弹出面板infowindows的控件** @author shang**/private class ViewHolder{ImageView infoImg;TextView infoName;TextView infoContent;TextView infoCredit;}

为地图添加marker

根据info类中坐标将marker添加进地图中

由于我们在info类设置了坐标信息，所以我们只需要写个add函数就可以将marker添加到地图相应的位置。

 /*** 为地图添加marker*/public void addInfosOverlay(List<Info> infos){baiduMap.clear();LatLng latLng = null;OverlayOptions overlayOptions = null;Marker marker = null;for (Info info : infos){// 位置latLng = new LatLng(info.getLatitude(), info.getLongitude());// 图标overlayOptions = new MarkerOptions().position(latLng).icon(mIconMaker).zIndex(5);marker = (Marker) (baiduMap.addOverlay(overlayOptions));Bundle bundle = new Bundle();bundle.putSerializable("info", info);marker.setExtraInfo(bundle);}}

为marker和infowindows设置点击事件

我们若要点击marker时出现infowindows我们就得为marker设置一个点击事件，我们还要为infowindows设置一个点击事件，这样就可以点击infowindows进入下一个布局或者出现新的信息。我们还得通过点击地图空白处让infowindows消失。这样代码如下：

//marker的点击事件baiduMap.setOnMarkerClickListener(new BaiduMap.OnMarkerClickListener() {@Overridepublic boolean onMarkerClick(Marker marker) {// 获得marker中的数据Info info = (Info) marker.getExtraInfo().get("info");// 根据商家信息为详细信息布局设置信息infowindows.setVisibility(View.VISIBLE);popupInfo(infowindows, info);return true;}});

 /** 百度地图点击事件将InfoWindow隐藏*/private void InitMapClick() {baiduMap.setOnMapClickListener(new BaiduMap.OnMapClickListener() {@Overridepublic boolean onMapPoiClick(MapPoi arg0) {// TODO Auto-generated method stubreturn false;}@Overridepublic void onMapClick(LatLng arg0) {infowindows.setVisibility(View.GONE);baiduMap.hideInfoWindow();}});}

//infowindows的点击事件infowindows.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {//执行的事件}});

这就是如何在百度地图中添加marker，至此百度开发初级三部曲结束，当然由于百度的api一直在更新所以大家若是想进一步学习的话，就要多多研究一下百度官方给出的demo。
这里面上面项目的源代码：http://pan.baidu.com/s/1mi64jRM 密码：hda9