学习内容来自“慕课网”

本片学习内容接自前四篇基础

请先学习前4篇再学习本篇，因为本篇在前四篇的基础上进行代码的编写

 

一、新建一个类用来存放数据（距离，点赞数，介绍图等信息）

1 package com.example.map;  2   3 import java.io.Serializable;  4 import java.util.ArrayList;  5 import java.util.List;  6   7 public class Info implements Serializable  8 {  9     private static final long serialVersionUID = -1010711775392052966L; 10     //经纬度 11     private double latitude; 12     private double longitude; 13     //图片id 14     private int imgId; 15     //商家的名称 16     private String name; 17     //距离 18     private String distance; 19     //点赞的数量 20     private int zan; 21  22     public static List
     
       infos = new ArrayList
      
       (); 23     //这里的数据都是死的，实际开发中数据都是从服务器中获取的，这里只演示如何添加覆盖物这个效果 24     static 25     { 26         infos.add(new Info(34.242652, 108.971171, R.drawable.a01, "英伦贵族小旅馆", 27                 "距离209米", 1456)); 28         infos.add(new Info(34.242952, 108.972171, R.drawable.a02, "沙井国际洗浴会所", 29                 "距离897米", 456)); 30         infos.add(new Info(34.242852, 108.973171, R.drawable.a03, "五环服装城", 31                 "距离249米", 1456)); 32         infos.add(new Info(34.242152, 108.971971, R.drawable.a04, "老米家泡馍小炒", 33                 "距离679米", 1456)); 34     } 35     //构造方法 36     public Info(double latitude, double longitude, int imgId, String name, 37             String distance, int zan) 38     { 39         this.latitude = latitude; 40         this.longitude = longitude; 41         this.imgId = imgId; 42         this.name = name; 43         this.distance = distance; 44         this.zan = zan; 45     } 46  47     public double getLatitude() 48     { 49         return latitude; 50     } 51  52     public void setLatitude(double latitude) 53     { 54         this.latitude = latitude; 55     } 56  57     public double getLongitude() 58     { 59         return longitude; 60     } 61  62     public void setLongitude(double longitude) 63     { 64         this.longitude = longitude; 65     } 66  67     public int getImgId() 68     { 69         return imgId; 70     } 71  72     public void setImgId(int imgId) 73     { 74         this.imgId = imgId; 75     } 76  77     public String getName() 78     { 79         return name; 80     } 81  82     public void setName(String name) 83     { 84         this.name = name; 85     } 86  87     public String getDistance() 88     { 89         return distance; 90     } 91  92     public void setDistance(String distance) 93     { 94         this.distance = distance; 95     } 96  97     public int getZan() 98     { 99         return zan;100     }101 102     public void setZan(int zan)103     {104         this.zan = zan;105     }106 107 }
      
     

二、添加覆盖物

首先在菜单中增加"添加覆盖物"菜单项

res-menu-main.xml

红色字体部分为新添加的代码部分

1 
     
       2  3     
       8     
      13     
      18     
      23     
      28     
      33     
      38     
      43 44 
     

给菜单项添加响应事件

1 //菜单按钮的响应事件 2     @Override 3     public boolean onOptionsItemSelected(MenuItem item) { 4         // TODO Auto-generated method stub 5         switch (item.getItemId()) { 6         case R.id.id_map_common: 7             mBaiduMap.setMapType(BaiduMap.MAP_TYPE_NORMAL); 8             break; 9         case R.id.id_map_site:10             mBaiduMap.setMapType(BaiduMap.MAP_TYPE_SATELLITE);11             break;12         case R.id.id_map_traffic:13             if(mBaiduMap.isTrafficEnabled())14             {15                 mBaiduMap.setTrafficEnabled(false);16                 item.setTitle("实时交通(off)");17             }18             else19             {20                 mBaiduMap.setTrafficEnabled(true);21                 item.setTitle("实时交通(on)");22             }23             break;24         case R.id.id_map_location:25             //定位最新自己的位置26             centerToMyLocation();27             break;28 29         case R.id.id_mode_common:30             //设置普通模式31             mLocationMode = LocationMode.NORMAL;32             break;33         case R.id.id_mode_following:34             //设置跟随模式35             mLocationMode = LocationMode.FOLLOWING;36             break;37         case R.id.id_mode_compass:38             //设置罗盘模式39             mLocationMode = LocationMode.COMPASS;40             break;41         case R.id.id_add_overlay:42             //设置添加覆盖物43             addOverlays(Info.infos);44             break;45         default:46             break;47         }48         return super.onOptionsItemSelected(item);49     }

 

这是添加覆盖物的方法 ，

1 private void addOverlays(List
     
       infos) { 2         // TODO Auto-generated method stub 3         //添加覆盖物 4         //清楚定位的一些图层 5         mBaiduMap.clear(); 6         // 经纬度 7         LatLng latLng = null; 8         Marker marker = null; 9         OverlayOptions options;10         for (Info info : infos)11         {12             // 经纬度13             latLng = new LatLng(info.getLatitude(), info.getLongitude());14             // 图标15             options = new MarkerOptions().position(latLng).icon(mMarker).zIndex(5);//5表示图层的位置，越大越在上面16             marker = (Marker) mBaiduMap.addOverlay(options);17             Bundle arg0 = new Bundle();18             arg0.putSerializable("info", info);19             marker.setExtraInfo(arg0);20         }21         //定位好之后，讲地图定位到最后一个图标的位置22         MapStatusUpdate msu = MapStatusUpdateFactory.newLatLng(latLng);23         mBaiduMap.setMapStatus(msu);24         25     }
     

效果图：

可以看到，地图上显示了4个覆盖物的坐标，但是这些坐标无法点击

。下面学习实现点击坐标显示相应的信息效果

二、实现覆盖物信息效果

实现建立显示信息的信息框的布局文件

1 
     
       9 10         
      
       21         22 23         
       
        28 29             
        
         35 36                 
         42 43                 
         49             50 51             
         
          58 59                 
          64 65                 
          72             73         
         
        
       
      
     74     

 

 

注意第18行代码

这里还需要建一个.xml文件

在res目录下新建文件夹drawable 在此文件夹下新建img_border.xml

res-drawable-img_border.xml

1 
      2 
     
       3  4     
       7  8     
      
       13     
      14 
     

 

信息框布局文件就由这两个.xml文件构成了

MainActivity.java

1 package com.example.map;  2   3 import java.util.List;  4   5 import com.baidu.location.BDLocation;  6 import com.baidu.location.BDLocationListener;  7 import com.baidu.location.LocationClient;  8 import com.baidu.location.LocationClientOption;  9 import com.baidu.mapapi.SDKInitializer; 10 import com.baidu.mapapi.map.BaiduMap; 11 import com.baidu.mapapi.map.BaiduMap.OnMapClickListener; 12 import com.baidu.mapapi.map.BaiduMap.OnMarkerClickListener; 13 import com.baidu.mapapi.map.BitmapDescriptor; 14 import com.baidu.mapapi.map.BitmapDescriptorFactory; 15 import com.baidu.mapapi.map.InfoWindow; 16 import com.baidu.mapapi.map.MapPoi; 17 import com.baidu.mapapi.map.MapStatusUpdate; 18 import com.baidu.mapapi.map.MapStatusUpdateFactory; 19 import com.baidu.mapapi.map.MapView; 20 import com.baidu.mapapi.map.Marker; 21 import com.baidu.mapapi.map.MarkerOptions; 22 import com.baidu.mapapi.map.MyLocationConfiguration; 23 import com.baidu.mapapi.map.MyLocationConfiguration.LocationMode; 24 import com.baidu.mapapi.map.MyLocationData; 25 import com.baidu.mapapi.map.OverlayOptions; 26 import com.baidu.mapapi.model.LatLng; 27 import com.example.map.MyOrientationListener.OnOrientationListener; 28 import com.example.map.R; 29  30 import android.location.Location; 31 import android.os.Bundle; 32 import android.app.Activity; 33 import android.content.Context; 34 import android.graphics.Bitmap; 35 import android.graphics.Color; 36 import android.graphics.Point; 37 import android.view.Menu; 38 import android.view.MenuItem; 39 import android.view.View; 40 import android.view.Window; 41 import android.widget.ImageView; 42 import android.widget.RelativeLayout; 43 import android.widget.TextView; 44 import android.widget.Toast; 45  46 public class MainActivity extends Activity { 47      48     private MapView mMapView = null; 49     private BaiduMap mBaiduMap; 50     //简化代码            用于this.context=this; 51     private Context context; 52     //定位相关 53     private LocationClient mLocationClient; 54     private MyLocationListener mLocationListener; 55     //是否第一次定位的标志 56     private boolean isFirstIn = true; 57     //定位经纬度 58     private double mLatitude; 59     private double mLongtitude; 60     //自定义定位图标 61     private BitmapDescriptor mIconLocation; 62     private LocationMode mLocationMode; 63     private MyOrientationListener myOrientationListener; 64     private float mCurrentX; 65     //添加覆盖物 66     private BitmapDescriptor mMarker; 67     //信息框的布局 68     private RelativeLayout mMarkerLy; 69      70      71      72     @Override 73     protected void onCreate(Bundle savedInstanceState) { 74         super.onCreate(savedInstanceState); 75       //在使用SDK各组件之前初始化context信息，传入ApplicationContext   76         //注意该方法要再setContentView方法之前实现   77         SDKInitializer.initialize(getApplicationContext());   78          79         requestWindowFeature(Window.FEATURE_NO_TITLE); 80         setContentView(R.layout.activity_main); 81         this.context = this; 82         initView(); 83         //初始化定位 84         initLocation(); 85         //初始化覆盖物相关 86         initMarker(); 87         mBaiduMap.setOnMarkerClickListener(new OnMarkerClickListener() 88         { 89             @Override 90             public boolean onMarkerClick(Marker marker) 91             { 92                 Bundle extraInfo = marker.getExtraInfo(); 93                 Info info = (Info) extraInfo.getSerializable("info"); 94                  95                 ImageView iv = (ImageView) mMarkerLy.findViewById(R.id.id_info_img); 96                 TextView distance = (TextView) mMarkerLy.findViewById(R.id.id_info_distance); 97                 TextView name = (TextView) mMarkerLy.findViewById(R.id.id_info_name); 98                 TextView zan = (TextView) mMarkerLy.findViewById(R.id.id_info_zan); 99                 100                 iv.setImageResource(info.getImgId());101                 distance.setText(info.getDistance());102                 name.setText(info.getName());103                 zan.setText(info.getZan() + "");104 105                 mMarkerLy.setVisibility(View.VISIBLE);106                 return true;107             }108         });109         mBaiduMap.setOnMapClickListener(new OnMapClickListener()110         {111 112             @Override113             public boolean onMapPoiClick(MapPoi arg0)114             {115                 return false;116             }117 118             @Override119             public void onMapClick(LatLng arg0)120             {121                 mMarkerLy.setVisibility(View.GONE);122                 mBaiduMap.hideInfoWindow();123             }124         });125     }126     127     private void initMarker() {128         // TODO Auto-generated method stub129         //标记图标130         mMarker = BitmapDescriptorFactory.fromResource(R.drawable.maker);131         mMarkerLy = (RelativeLayout) findViewById(R.id.id_maker_ly);132     }133 134     private void initView() {135         // TODO Auto-generated method stub136         mMapView = (MapView) findViewById(R.id.id_bmapView);137         mBaiduMap = mMapView.getMap();138         //设置打开时的显示比列  这里显示500m左右139         MapStatusUpdate msu = MapStatusUpdateFactory.zoomTo(15.0f); 140         mBaiduMap.setMapStatus(msu);141         }142     private void initLocation() {143         // TODO Auto-generated method stub144         mLocationClient = new LocationClient(this);145         mLocationListener = new MyLocationListener();146         mLocationClient.registerLocationListener(mLocationListener);147         //默认模式为普通型148         mLocationMode = LocationMode.NORMAL;149         LocationClientOption option = new LocationClientOption();150         option.setCoorType("bd09ll");151         option.setIsNeedAddress(true);152         option.setOpenGps(true);153         option.setScanSpan(1000);154         155         mLocationClient.setLocOption(option);156         157         // 初始化图标158         mIconLocation = BitmapDescriptorFactory.fromResource(R.drawable.navi_map_gps_locked);159         myOrientationListener = new MyOrientationListener(context);160         myOrientationListener.setOnOrientationListener(new OnOrientationListener()161         {162             @Override163             public void onOrientationChanged(float x)164             {165                 mCurrentX = x;166             }167         });168     }169     //activity销毁时百度地图也销毁170     @Override  171     protected void onDestroy() {   172         super.onDestroy();  173         //在activity执行onDestroy时执行mMapView.onDestroy()，实现地图生命周期管理  174         mMapView.onDestroy();  175     }  176     @Override177     protected void onStart() {178         // TODO Auto-generated method stub179         super.onStart();180         // 开启定位181         mBaiduMap.setMyLocationEnabled(true);182         if (!mLocationClient.isStarted())183             mLocationClient.start();184         // 开启方向传感器185         myOrientationListener.start();186             187     }188     @Override189     protected void onStop() {190         // TODO Auto-generated method stub191         super.onStop();192         // 停止定位193         mBaiduMap.setMyLocationEnabled(false);194         mLocationClient.stop();195         // 停止方向传感器196         myOrientationListener.stop();197     }198     @Override  199     protected void onResume() {  200         super.onResume();  201         //在activity执行onResume时执行mMapView. onResume ()，实现地图生命周期管理  202         mMapView.onResume();  203         }  204     @Override  205     protected void onPause() {  206         super.onPause();  207         //在activity执行onPause时执行mMapView. onPause ()，实现地图生命周期管理  208         mMapView.onPause();  209         }  210     @Override211     public boolean onCreateOptionsMenu(Menu menu) {212         // TODO Auto-generated method stub213         214         getMenuInflater().inflate(R.menu.main, menu);215         return true;216     }217     //菜单按钮的响应事件218     @Override219     public boolean onOptionsItemSelected(MenuItem item) {220         // TODO Auto-generated method stub221         switch (item.getItemId()) {222         case R.id.id_map_common:223             mBaiduMap.setMapType(BaiduMap.MAP_TYPE_NORMAL);224             break;225         case R.id.id_map_site:226             mBaiduMap.setMapType(BaiduMap.MAP_TYPE_SATELLITE);227             break;228         case R.id.id_map_traffic:229             if(mBaiduMap.isTrafficEnabled())230             {231                 mBaiduMap.setTrafficEnabled(false);232                 item.setTitle("实时交通(off)");233             }234             else235             {236                 mBaiduMap.setTrafficEnabled(true);237                 item.setTitle("实时交通(on)");238             }239             break;240         case R.id.id_map_location:241             //定位最新自己的位置242             centerToMyLocation();243             break;244 245         case R.id.id_mode_common:246             //设置普通模式247             mLocationMode = LocationMode.NORMAL;248             break;249         case R.id.id_mode_following:250             //设置跟随模式251             mLocationMode = LocationMode.FOLLOWING;252             break;253         case R.id.id_mode_compass:254             //设置罗盘模式255             mLocationMode = LocationMode.COMPASS;256             break;257         case R.id.id_add_overlay:258             //设置添加覆盖物259             addOverlays(Info.infos);260             break;261         default:262             break;263         }264         return super.onOptionsItemSelected(item);265     }266     private void addOverlays(List
     
       infos) {267         // TODO Auto-generated method stub268         //添加覆盖物269         //清楚定位的一些图层270         mBaiduMap.clear();271         // 经纬度272         LatLng latLng = null;273         Marker marker = null;274         OverlayOptions options;275         for (Info info : infos)276         {277             // 经纬度278             latLng = new LatLng(info.getLatitude(), info.getLongitude());279             // 图标280             options = new MarkerOptions().position(latLng).icon(mMarker).zIndex(5);//5表示图层的位置，越大越在上面281             marker = (Marker) mBaiduMap.addOverlay(options);282             Bundle arg0 = new Bundle();283             arg0.putSerializable("info", info);284             marker.setExtraInfo(arg0);285         }286         //定位好之后，讲地图定位到最后一个图标的位置287         MapStatusUpdate msu = MapStatusUpdateFactory.newLatLng(latLng);288         mBaiduMap.setMapStatus(msu);289         290     }291 292     //进到自己的位置293     private void centerToMyLocation() {294         LatLng latLng = new LatLng(mLatitude,mLongtitude);295         296         MapStatusUpdate msu = MapStatusUpdateFactory.newLatLng(latLng);297         mBaiduMap.animateMapStatus(msu);298     }299     private class MyLocationListener implements BDLocationListener{300 301         @Override302         public void onReceiveLocation(BDLocation location) {303             // TODO Auto-generated method stub304             MyLocationData data = new MyLocationData.Builder()//305             .direction(mCurrentX)//306             .accuracy(location.getRadius())//307             .latitude(location.getLatitude())//308             .longitude(location.getLongitude())//309             .build();310     mBaiduMap.setMyLocationData(data);311     // 设置自定义图标312     MyLocationConfiguration config = new MyLocationConfiguration(mLocationMode, true, mIconLocation);313     mBaiduMap.setMyLocationConfigeration(config);314     //获取最新经纬度315     mLatitude = location.getLatitude();316     mLongtitude = location.getLongitude();317     //判断是否第一次定位318     if (isFirstIn)319     {320         //设置经纬度321         LatLng latLng = new LatLng(location.getLatitude(),location.getLongitude());322         323         MapStatusUpdate msu = MapStatusUpdateFactory.newLatLng(latLng);324         mBaiduMap.animateMapStatus(msu);325         //将是否第一次定位的标志 变为不是第一次定位326         isFirstIn = false;327         //显示当前定位的位置328         Toast.makeText(context, location.getAddrStr(),329                 Toast.LENGTH_SHORT).show();330     }331 332         }333         334     }335 }
     

 

 其中红色字体部分为本篇新加代码 

对应布局文件

activity_main.xml

1 
      
        5  6     
       11 12     
       
        20 21         
        
         32         33 34         
         
          39 40             
          
           46 47                 
           53 54                 
           60             61 62             
           
            69 70 
            75 76 
            83 84 
           
          
         
        
       
      85     86 87 

效果图：

点击坐标便显示对应的信息，点击几个坐标以外的位置，信息框便会消失