【百度地图开发之三】百度地图UI控制功能讲解

jerry 地图开发 2015年11月27日 收藏

上一篇我们学习了【百度地图开发之二】基于Fragment的地图框架的使用(点击跳转),今天继续看一下百度地图UI视图的一些控制功能.

(一)基本介绍:

      百度地图UI控制功能主要包括一些开关手势功能和UI控件的显示与隐藏,(例如:对地图的缩放,平移,双击放大缩小,旋转,俯视,显示与隐藏缩放控件以及指南针的显示位置等功能).要实现以上的功能主要用要到下面两个类中的方法1:MapView(地图View),2:MapController:(地图控制器);下面来简要的看一下其中使用到的方法.

(二)方法说明:

    1:MapView:这是显示地图的视图,当该视图获得焦点的时候,可以捕捉触摸事件和点击事件手势去平移地图和缩放地图,MapView的创建我们可以通过XML布局实现,同样也可以用个构造函数去实现.本例中使用XML布局文件。同时还是用到主要下面两个方法:

       ①:public void setBuiltInZoomControls(boolean on) : 设置是否启用内置的缩放控件。如果on为true,MapView将自动显示这些缩放控件

      ②:public void setDoubleClickZooming(booean bDoubleClickZooming):设置mapView是否支持双击方法效果;

   2: MapController:地图控制器:可以实现地图的手势事件,缩放,平移,选中,俯视等功能,主要用到下面几个方法:

      ①:public void setZoomGesturesEnabled(boolean isZoomGesturesEnable):设置缩放手势状态, true,缩放手势开启

      ②:public void setScrollGesturesEnabled(boolean isScrollGesturesEnable):是平移手势开关状态,true,平移手势开启

      ③:public voic setRotationGestureEnabled(boolean isRotationGesturesEnable):设置旋转手势开关状态,true,旋转手势开启

      ④:public void  setOverlookingGesturedEnabled(boolean isOverlookingGesturesEnabled):设置俯视手势开关状态,true 俯视手势开启

      除了这些手势方法以外,该控制器还有一些其他的方法,具体的可以到BaiduMap API文档中查看。下面根据上面的方法,我们来看下百度地图中的demo项目(代码中的注释已经写的很详细了)

(三)例子实现:

     1. MyApplication.java方法,进行BMapManager全局变量的设置和密钥验证,代码如下:

  1. package com.ztt.baidumap.ui;
  2.  
  3. import android.app.Application;
  4. import android.content.Context;
  5. import android.util.Log;
  6. import android.widget.Toast;
  7.  
  8. import com.baidu.mapapi.BMapManager;
  9. import com.baidu.mapapi.MKGeneralListener;
  10. import com.baidu.mapapi.map.MKEvent;
  11. /**
  12.  * 自定义Application,进行key识别验证 (使用单例)
  13.  * @author Jiangqq
  14.  * @time 2014/03/15 10:14
  15.  */
  16. public class MyApplication extends Application {
  17.     public static MyApplication instance=null;
  18. BMapManager mBMapManager = null;
  19. public boolean m_bKeyRight = true;
  20.     public static final String strKey = "vUAGbPwLpolIqiwWisnQPeIE";  //百度地图官网申请的密钥
  21. public static MyApplication getInstance(){
  22. return instance;
  23. }
  24. @Override
  25. public void onCreate() {
  26. super.onCreate();
  27. instance=this;
  28. //在APP应用启动的时候,进行初始化验证
  29. initEngineManager(this);
  30. }
  31. /**
  32.  * 进行验证key
  33.  * @param pContext
  34.  */
  35. private void initEngineManager(Context pContext)
  36. {
  37.  if (mBMapManager == null) {
  38.             mBMapManager = new BMapManager(pContext);
  39.         }
  40.  
  41.         if (!mBMapManager.init(strKey,new MyGeneralListener())) {
  42.             Toast.makeText(MyApplication.getInstance(), 
  43.                     "BMapManager  初始化错误!", Toast.LENGTH_LONG).show();
  44.         }
  45. }
  46. // 常用事件监听,用来处理通常的网络错误,授权验证错误等
  47.     static class MyGeneralListener implements MKGeneralListener {
  48.         
  49.         @Override
  50.         public void onGetNetworkState(int iError) {
  51.             if (iError == MKEvent.ERROR_NETWORK_CONNECT) {
  52.                 Toast.makeText(MyApplication.getInstance(), "您的网络出错啦!",
  53.                     Toast.LENGTH_LONG).show();
  54.             }
  55.             else if (iError == MKEvent.ERROR_NETWORK_DATA) {
  56.                 Toast.makeText(MyApplication.getInstance(), "输入正确的检索条件!",
  57.                         Toast.LENGTH_LONG).show();
  58.             }else {
  59.  Log.d("zttjiangqq", "iError="+iError);
  60. }
  61.             // ...
  62.         }
  63.  
  64.         @Override
  65.         public void onGetPermissionState(int iError) {
  66.          //非零值表示key验证未通过
  67.             if (iError != 0) {
  68.                 //授权Key错误:
  69.                 Toast.makeText(MyApplication.getInstance(), 
  70.                         "请在 DemoApplication.java文件输入正确的授权Key,并检查您的网络连接是否正常!error: "+iError, Toast.LENGTH_LONG).show();
  71.                 MyApplication.getInstance().m_bKeyRight = false;
  72.             }
  73.             else{
  74.              MyApplication.getInstance().m_bKeyRight = true;
  75.              Toast.makeText(MyApplication.getInstance(), 
  76.                         "key认证成功", Toast.LENGTH_LONG).show();
  77.             }
  78.         }
  79.     }
  80. }

    2.布局文件


  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="vertical"
  4.     android:layout_width="fill_parent"
  5.     android:layout_height="fill_parent"
  6.     >
  7.     
  8.   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  9.         android:orientation="horizontal"
  10.         android:layout_width="fill_parent"
  11.         android:layout_height="50dip">
  12.     
  13.     <CheckBox
  14.         android:id="@+id/zoom"
  15.         android:layout_width="wrap_content"
  16.         android:layout_height="wrap_content"
  17.         android:layout_weight="1"
  18.         android:checked="true"
  19.         android:onClick="setZoomEnable"
  20.         android:text="缩放" />
  21.     <CheckBox
  22.         android:id="@+id/scroll"
  23.         android:layout_width="wrap_content"
  24.         android:layout_height="wrap_content"
  25.         android:layout_weight="1"
  26.         android:checked="true"
  27.         android:onClick="setScrollEnable"
  28.         android:text="平移" />
  29.     <CheckBox
  30.         android:id="@+id/doubleClick"
  31.         android:layout_width="wrap_content"
  32.         android:layout_height="wrap_content"
  33.         android:layout_weight="1"
  34.         android:checked="true"
  35.         android:onClick="setDoubleClickEnable"
  36.         android:text="双击放大" />
  37.   </LinearLayout>
  38.   
  39.   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  40.         android:orientation="horizontal"
  41.         android:layout_width="fill_parent"
  42.         android:layout_height="50dip">
  43.     
  44.     <CheckBox
  45.         android:id="@+id/rotate"
  46.         android:layout_width="wrap_content"
  47.         android:layout_height="wrap_content"
  48.         android:layout_weight="1"
  49.         android:checked="true"
  50.         android:onClick="setRotateEnable"
  51.         android:text="旋转" />
  52.     <CheckBox
  53.         android:id="@+id/overlook"
  54.         android:layout_width="wrap_content"
  55.         android:layout_height="wrap_content"
  56.         android:layout_weight="1"
  57.         android:checked="true"
  58.         android:onClick="setOverlookEnable"
  59.         android:text="俯视" />
  60.     <CheckBox
  61.         android:id="@+id/zoomControl"
  62.         android:layout_width="wrap_content"
  63.         android:layout_height="wrap_content"
  64.         android:layout_weight="1"
  65.         android:checked="false"
  66.         android:onClick="setBuiltInZoomControllEnable"
  67.         android:text="缩放控件" />
  68.   </LinearLayout>
  69.   
  70.   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  71.         android:orientation="horizontal"
  72.         android:layout_width="fill_parent"
  73.         android:layout_height="50dip">
  74.    
  75.      <TextView 
  76.          android:layout_width="wrap_content"  
  77.          android:layout_height="wrap_content"  
  78.          android:layout_weight="1"
  79.          android:paddingTop="10dip"
  80.          android:text="指南针位置"
  81.      />
  82.      <RadioGroup   
  83.         android:id="@+id/RadioGroup"  
  84.         android:layout_width="wrap_content"  
  85.         android:layout_height="wrap_content"  
  86.         android:layout_weight="1"
  87.         android:orientation="horizontal"  
  88.         android:text="指南针位置" 
  89.      >   
  90.        <RadioButton   
  91.            android:id="@+id/lefttop"  
  92.            android:layout_width="wrap_content"  
  93.            android:layout_height="wrap_content"  
  94.            android:onClick="setCompassLocation"
  95.            android:checked="true"
  96.            android:text="左上角"  
  97.         />   
  98.        <RadioButton   
  99.            android:id="@+id/righttop"  
  100.            android:layout_width="wrap_content"  
  101.            android:layout_height="wrap_content"  
  102.            android:onClick="setCompassLocation"
  103.            android:text="右上角"  
  104.         />   
  105.     </RadioGroup>
  106.     
  107.   </LinearLayout>
  108.     
  109.   
  110.     <com.baidu.mapapi.map.MapView android:id="@+id/bmapView"
  111.     android:layout_width="fill_parent" android:layout_height="wrap_content" 
  112.     android:clickable="true"     
  113. />
  114.     
  115. </LinearLayout>

     3.Activity具体功能实现:


  1. package com.ztt.baidumap.ui;
  2.  
  3. import android.app.Activity;
  4. import android.os.Bundle;
  5. import android.view.View;
  6. import android.widget.CheckBox;
  7. import android.widget.RadioButton;
  8.  
  9. import com.baidu.mapapi.BMapManager;
  10. import com.baidu.mapapi.map.MapController;
  11. import com.baidu.mapapi.map.MapView;
  12. import com.baidu.platform.comapi.basestruct.GeoPoint;
  13.  
  14. /**
  15.  * 演示地图UI控制功能
  16.  */
  17. public class UISettingDemo extends Activity {
  18.  
  19. /**
  20.  *  MapView 是地图主控件
  21.  */
  22. private MapView mMapView = null;
  23. /**
  24.  *  用MapController完成地图控制 
  25.  */
  26. private MapController mMapController = null;
  27.     @Override
  28.     public void onCreate(Bundle savedInstanceState) {
  29.         super.onCreate(savedInstanceState);
  30.         /**
  31.          * 使用地图sdk前需先初始化BMapManager.
  32.          * BMapManager是全局的,可为多个MapView共用,它需要地图模块创建前创建,
  33.          * 并在地图地图模块销毁后销毁,只要还有地图模块在使用,BMapManager就不应该销毁
  34.          */
  35.         MyApplication app = (MyApplication)this.getApplication();
  36.         if (app.mBMapManager == null) {
  37.             app.mBMapManager = new BMapManager(getApplicationContext());
  38.             /**
  39.              * 如果BMapManager没有初始化则初始化BMapManager
  40.              */
  41.             app.mBMapManager.init(MyApplication.strKey,new MyApplication.MyGeneralListener());
  42.         }
  43.         /**
  44.           * 由于MapView在setContentView()中初始化,所以它需要在BMapManager初始化之后
  45.           */
  46.         setContentView(R.layout.activity_uisetting);
  47.         mMapView = (MapView)findViewById(R.id.bmapView);
  48.         /**
  49.          * 获取地图控制器
  50.          */
  51.         mMapController = mMapView.getController();
  52.         /**
  53.          *  设置地图是否响应点击事件  .
  54.          */
  55.         mMapController.enableClick(true);
  56.         /**
  57.          * 设置地图缩放级别
  58.          */
  59.         mMapController.setZoom(12);
  60.         /**
  61.          * 设置地图俯角
  62.          */
  63.         mMapController.setOverlooking(-30);
  64.         /**
  65.          * 将地图移动至天安门
  66.          * 使用百度经纬度坐标,可以通过http://api.map.baidu.com/lbsapi/getpoint/index.html查询地理坐标
  67.          * 如果需要在百度地图上显示使用其他坐标系统的位置,请发邮件至mapapi@baidu.com申请坐标转换接口
  68.          */
  69.         double cLat = 39.945 ;
  70.         double cLon = 116.404 ;
  71.         GeoPoint p = new GeoPoint((int)(cLat * 1E6), (int)(cLon * 1E6));
  72.         mMapController.setCenter(p);
  73.         
  74.     }
  75.     
  76.     /**
  77.      * 是否启用缩放手势
  78.      * @param v
  79.      */
  80.     public void setZoomEnable(View v){
  81.      //缩放手势
  82.      mMapController.setZoomGesturesEnabled(((CheckBox) v).isChecked());
  83.     }
  84.     /**
  85.      * 是否启用平移手势
  86.      * @param v
  87.      */
  88.     public void setScrollEnable(View v){
  89.      //平移
  90.      mMapController.setScrollGesturesEnabled(((CheckBox) v).isChecked());
  91.     }
  92.     /**
  93.      * 是否启用双击放大
  94.      * @param v
  95.      */
  96.     public void setDoubleClickEnable(View v){
  97.      //双击
  98.      mMapView.setDoubleClickZooming(((CheckBox) v).isChecked());
  99.     }
  100.     /**
  101.      * 是否启用旋转手势
  102.      * @param v
  103.      */
  104.     public void setRotateEnable(View v){
  105.      //旋转
  106.         mMapController.setRotationGesturesEnabled(((CheckBox) v).isChecked());    
  107.     }
  108.     /**
  109.      * 是否启用俯视手势
  110.      * @param v
  111.      */
  112.     public void setOverlookEnable(View v){
  113.      //俯视
  114.         mMapController.setOverlookingGesturesEnabled(((CheckBox) v).isChecked());    
  115.     }
  116.     /**
  117.      * 是否显示内置绽放控件
  118.      * @param v
  119.      */
  120.     public void setBuiltInZoomControllEnable(View v){
  121.      //缩放控件
  122.         mMapView.setBuiltInZoomControls(((CheckBox) v).isChecked());    
  123.     }
  124.     
  125.     /**
  126.      * 设置指南针位置,指南针在3D模式下自动显现
  127.      * @param view
  128.      */
  129.     public void setCompassLocation(View view){
  130.         boolean checked = ((RadioButton) view).isChecked();
  131.         switch(view.getId()) {
  132.             case R.id.lefttop:
  133.                 if (checked)
  134.                  //设置指南针显示在左上角
  135.                  mMapController.setCompassMargin(100, 100);
  136.                 break;
  137.             case R.id.righttop:
  138.                 if (checked)
  139.                  mMapController.setCompassMargin(mMapView.getWidth() - 100, 100);
  140.                 break;
  141.         }
  142.     }
  143.     
  144.     @Override
  145.     protected void onPause() {
  146.      /**
  147.       *  MapView的生命周期与Activity同步,当activity挂起时需调用MapView.onPause()
  148.       */
  149.         mMapView.onPause();
  150.         super.onPause();
  151.     }
  152.     
  153.     @Override
  154.     protected void onResume() {
  155.      /**
  156.       *  MapView的生命周期与Activity同步,当activity恢复时需调用MapView.onResume()
  157.       */
  158.         mMapView.onResume();
  159.         super.onResume();
  160.     }
  161.     
  162.     @Override
  163.     protected void onDestroy() {
  164.      /**
  165.       *  MapView的生命周期与Activity同步,当activity销毁时需调用MapView.destroy()
  166.       */
  167.         mMapView.destroy();
  168.         super.onDestroy();
  169.     }
  170.     
  171.     @Override
  172.     protected void onSaveInstanceState(Bundle outState) {
  173.      super.onSaveInstanceState(outState);
  174.      mMapView.onSaveInstanceState(outState);
  175.     
  176.     }
  177.     
  178.     @Override
  179.     protected void onRestoreInstanceState(Bundle savedInstanceState) {
  180.      super.onRestoreInstanceState(savedInstanceState);
  181.      mMapView.onRestoreInstanceState(savedInstanceState);
  182.     }
  183.     
  184. }

   4:运行截图: