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

    写在前面的话:

  【百度地图开发之三】百度地图UI控制功能讲解(博客地址:http://blog.csdn.net/developer_jiangqq),转载请注明。

     Author:hmjiangqq

     Email:jiangqqlmj@163.com  

  上一篇我们学习了【百度地图开发之二】基于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全局变量的设置和密钥验证,代码如下:

package com.ztt.baidumap.ui;

import android.app.Application;
import android.content.Context;
import android.util.Log;
import android.widget.Toast;

import com.baidu.mapapi.BMapManager;
import com.baidu.mapapi.MKGeneralListener;
import com.baidu.mapapi.map.MKEvent;
/**
 * 自定义Application,进行key识别验证 (使用单例)
 * @author Jiangqq
 * @time 2014/03/15 10:14
 */
public class MyApplication extends Application {
    public static MyApplication instance=null;
	BMapManager mBMapManager = null;
	public boolean m_bKeyRight = true;
    public static final String strKey = "vUAGbPwLpolIqiwWisnQPeIE";  //百度地图官网申请的密钥
	public static MyApplication getInstance(){
		return instance;
	}
	@Override
	public void onCreate() {
		super.onCreate();
		instance=this;
		//在APP应用启动的时候,进行初始化验证
		initEngineManager(this);
	}
	
	/**
	 * 进行验证key
	 * @param pContext
	 */
	private void initEngineManager(Context pContext)
	{
		 if (mBMapManager == null) {
	            mBMapManager = new BMapManager(pContext);
	        }

	        if (!mBMapManager.init(strKey,new MyGeneralListener())) {
	            Toast.makeText(MyApplication.getInstance(), 
	                    "BMapManager  初始化错误!", Toast.LENGTH_LONG).show();
	        }
	}
	// 常用事件监听,用来处理通常的网络错误,授权验证错误等
    static class MyGeneralListener implements MKGeneralListener {
        
        @Override
        public void onGetNetworkState(int iError) {
            if (iError == MKEvent.ERROR_NETWORK_CONNECT) {
                Toast.makeText(MyApplication.getInstance(), "您的网络出错啦!",
                    Toast.LENGTH_LONG).show();
            }
            else if (iError == MKEvent.ERROR_NETWORK_DATA) {
                Toast.makeText(MyApplication.getInstance(), "输入正确的检索条件!",
                        Toast.LENGTH_LONG).show();
            }else {
				 Log.d("zttjiangqq", "iError="+iError);
			}
            // ...
        }

        @Override
        public void onGetPermissionState(int iError) {
        	//非零值表示key验证未通过
            if (iError != 0) {
                //授权Key错误:
                Toast.makeText(MyApplication.getInstance(), 
                        "请在 DemoApplication.java文件输入正确的授权Key,并检查您的网络连接是否正常!error: "+iError, Toast.LENGTH_LONG).show();
                MyApplication.getInstance().m_bKeyRight = false;
            }
            else{
            	MyApplication.getInstance().m_bKeyRight = true;
            	Toast.makeText(MyApplication.getInstance(), 
                        "key认证成功", Toast.LENGTH_LONG).show();
            }
        }
    }
}
    2.布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="50dip">
    
    <CheckBox
        android:id="@+id/zoom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="true"
        android:onClick="setZoomEnable"
        android:text="缩放" />
    <CheckBox
        android:id="@+id/scroll"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="true"
        android:onClick="setScrollEnable"
        android:text="平移" />
    <CheckBox
        android:id="@+id/doubleClick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="true"
        android:onClick="setDoubleClickEnable"
        android:text="双击放大" />
  </LinearLayout>
  
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="50dip">
    
    <CheckBox
        android:id="@+id/rotate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="true"
        android:onClick="setRotateEnable"
        android:text="旋转" />
    <CheckBox
        android:id="@+id/overlook"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="true"
        android:onClick="setOverlookEnable"
        android:text="俯视" />
    <CheckBox
        android:id="@+id/zoomControl"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:checked="false"
        android:onClick="setBuiltInZoomControllEnable"
        android:text="缩放控件" />
  </LinearLayout>
  
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="50dip">
   
     <TextView 
         android:layout_width="wrap_content"  
         android:layout_height="wrap_content"  
         android:layout_weight="1"
         android:paddingTop="10dip"
         android:text="指南针位置"
     />
     <RadioGroup   
        android:id="@+id/RadioGroup"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_weight="1"
        android:orientation="horizontal"  
        android:text="指南针位置" 
     >   
       <RadioButton   
           android:id="@+id/lefttop"  
           android:layout_width="wrap_content"  
           android:layout_height="wrap_content"  
           android:onClick="setCompassLocation"
           android:checked="true"
           android:text="左上角"  
        />   
       <RadioButton   
           android:id="@+id/righttop"  
           android:layout_width="wrap_content"  
           android:layout_height="wrap_content"  
           android:onClick="setCompassLocation"
           android:text="右上角"  
        />   
    </RadioGroup>
    
  </LinearLayout>
    
  
    <com.baidu.mapapi.map.MapView android:id="@+id/bmapView"
	    android:layout_width="fill_parent" android:layout_height="wrap_content" 
	    android:clickable="true"     
	/>
    
</LinearLayout>
     3.Activity具体功能实现:

package com.ztt.baidumap.ui;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.RadioButton;

import com.baidu.mapapi.BMapManager;
import com.baidu.mapapi.map.MapController;
import com.baidu.mapapi.map.MapView;
import com.baidu.platform.comapi.basestruct.GeoPoint;

/**
 * 演示地图UI控制功能
 */
public class UISettingDemo extends Activity {

	/**
	 *  MapView 是地图主控件
	 */
	private MapView mMapView = null;
	/**
	 *  用MapController完成地图控制 
	 */
	private MapController mMapController = null;
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        /**
         * 使用地图sdk前需先初始化BMapManager.
         * BMapManager是全局的,可为多个MapView共用,它需要地图模块创建前创建,
         * 并在地图地图模块销毁后销毁,只要还有地图模块在使用,BMapManager就不应该销毁
         */
        MyApplication app = (MyApplication)this.getApplication();
        if (app.mBMapManager == null) {
            app.mBMapManager = new BMapManager(getApplicationContext());
            /**
             * 如果BMapManager没有初始化则初始化BMapManager
             */
            app.mBMapManager.init(MyApplication.strKey,new MyApplication.MyGeneralListener());
        }
        /**
          * 由于MapView在setContentView()中初始化,所以它需要在BMapManager初始化之后
          */
        setContentView(R.layout.activity_uisetting);
        mMapView = (MapView)findViewById(R.id.bmapView);
        /**
         * 获取地图控制器
         */
        mMapController = mMapView.getController();
        /**
         *  设置地图是否响应点击事件  .
         */
        mMapController.enableClick(true);
        /**
         * 设置地图缩放级别
         */
        mMapController.setZoom(12);
        /**
         * 设置地图俯角
         */
        mMapController.setOverlooking(-30);
        /**
         * 将地图移动至天安门
         * 使用百度经纬度坐标,可以通过http://api.map.baidu.com/lbsapi/getpoint/index.html查询地理坐标
         * 如果需要在百度地图上显示使用其他坐标系统的位置,请发邮件至mapapi@baidu.com申请坐标转换接口
         */
        double cLat = 39.945 ;
        double cLon = 116.404 ;
        GeoPoint p = new GeoPoint((int)(cLat * 1E6), (int)(cLon * 1E6));
        mMapController.setCenter(p);
        
    }
    
    /**
     * 是否启用缩放手势
     * @param v
     */
    public void setZoomEnable(View v){
    	//缩放手势
    	mMapController.setZoomGesturesEnabled(((CheckBox) v).isChecked());
    }
    /**
     * 是否启用平移手势
     * @param v
     */
    public void setScrollEnable(View v){
    	//平移
    	mMapController.setScrollGesturesEnabled(((CheckBox) v).isChecked());
    }
    /**
     * 是否启用双击放大
     * @param v
     */
    public void setDoubleClickEnable(View v){
    	//双击
    	mMapView.setDoubleClickZooming(((CheckBox) v).isChecked());
    }
    /**
     * 是否启用旋转手势
     * @param v
     */
    public void setRotateEnable(View v){
    	//旋转
        mMapController.setRotationGesturesEnabled(((CheckBox) v).isChecked());    	
    }
    /**
     * 是否启用俯视手势
     * @param v
     */
    public void setOverlookEnable(View v){
    	//俯视
        mMapController.setOverlookingGesturesEnabled(((CheckBox) v).isChecked());    	
    }
    /**
     * 是否显示内置绽放控件
     * @param v
     */
    public void setBuiltInZoomControllEnable(View v){
    	//缩放控件
        mMapView.setBuiltInZoomControls(((CheckBox) v).isChecked());    	
    }
    
    /**
     * 设置指南针位置,指南针在3D模式下自动显现
     * @param view
     */
    public void setCompassLocation(View view){
        boolean checked = ((RadioButton) view).isChecked();
        switch(view.getId()) {
            case R.id.lefttop:
                if (checked)
                	//设置指南针显示在左上角
                	mMapController.setCompassMargin(100, 100);
                break;
            case R.id.righttop:
                if (checked)
                	mMapController.setCompassMargin(mMapView.getWidth() - 100, 100);
                break;
        }	
    }
    
    @Override
    protected void onPause() {
    	/**
    	 *  MapView的生命周期与Activity同步,当activity挂起时需调用MapView.onPause()
    	 */
        mMapView.onPause();
        super.onPause();
    }
    
    @Override
    protected void onResume() {
    	/**
    	 *  MapView的生命周期与Activity同步,当activity恢复时需调用MapView.onResume()
    	 */
        mMapView.onResume();
        super.onResume();
    }
    
    @Override
    protected void onDestroy() {
    	/**
    	 *  MapView的生命周期与Activity同步,当activity销毁时需调用MapView.destroy()
    	 */
        mMapView.destroy();
        super.onDestroy();
    }
    
    @Override
    protected void onSaveInstanceState(Bundle outState) {
    	super.onSaveInstanceState(outState);
    	mMapView.onSaveInstanceState(outState);
    	
    }
    
    @Override
    protected void onRestoreInstanceState(Bundle savedInstanceState) {
    	super.onRestoreInstanceState(savedInstanceState);
    	mMapView.onRestoreInstanceState(savedInstanceState);
    }
    
}
   4:运行截图:

 

    

   


  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
百度地图iOS SDK v2.10.0 Sample共有23个Demo,每个Demo的说明如下: ------------------------------------------------------------------------------------- 一、 Demo名称:基本地图功能 文件名: MapViewBaseDemoViewController.mm 简介:创建一张百度地图并管理地图的生命周期 详述: (1)创建一张最简单的百度地图; (2)管理地图的生命周期,具体请参看代码部分的相关注释; ------------------------------------------------------------------------------------- 二、 Demo名称:多地图展示功能 文件名: MultiMapViewDemo.mm 简介:在一个页面中创建多个地图 详述: (1)在一个页面内创建多个相互独立的地图 (2)地图Logo位置变更,支持6个位置 ------------------------------------------------------------------------------------- 三、 Demo名称:图层展示功能 文件名: MapViewDemoViewController.mm 简介:展示普通图、卫星图、路况图和路况卫星图 详述: (1)详情请参考代码部分或官网开发指南相关章节; ------------------------------------------------------------------------------------- 四、 Demo名称:地图操作功能 文件名: MapViewControlDemoViewController.mm 简介:介绍平移和缩放地图,双指操作地图,监听地图点击事件 详述: (1)介绍地图缩放级别、旋转度和俯视度的get和set方法; (2)监听单击、双击和长按地图事件; (3)单击、双击或长按地图获取该点的经纬度坐标; (4)对地图显示内容进行截图; ------------------------------------------------------------------------------------- 五、 Demo名称:UI控制功能 文件名: MapViewUISettingDemoViewController.mm 简介:介绍开关手势功能和显示隐藏UI控件 详述: (1)地图操作开关:平移、缩放; (2)控件显示开关:显示/隐藏比例尺控件; (3)指南针位置控制:显示在地图左上角或者右上角(仅举例),开发者可据实际情况任意改变位置; (4)禁用所有手势控制是否一并禁止所有手势。 (5)设置边界区域:给地图增加边界。地图可操作区域和控件显示,都被限制在地图设定的边界内; (6)您还可以参照开发文档控制比例尺的显示位置; ------------------------------------------------------------------------------------- 六、 Demo名称:定位功能 文件名: LocationDemoViewController.mm 简介:介绍定位图层的基本用法 详述: (1)介绍如何开始定位和停止定位; (2)默认定位的状态显示为普通态,v2.0.2版本开始提供定位的跟随态和罗盘态; (3)开发者可以自己修改icon_center_point.png和icon_center_point@2x.png资源修改默认的定位图标; (4)支持开发者自行定义精度圈边框和填充区域的颜色。 ------------------------------------------------------------------------------------- 七、 Demo名称:覆盖物功能 文件名: AnnotationDemoViewController.mm 简介:介绍使用SDK内置方法绘制点线面等几何图形和如何添加标注 详述: (1)内置覆盖物标签: a、使用内置方法绘制几何图形; b、通过BMKMapView的addOverlay接口添加一个覆盖物; c、开发者可以实现BMKMapViewDelegate中mapView:viewForOverlay;接口,提供要添加到地图中的 标注的BMKOverlayView,开发者可以扩展此类丰富更多的功 (2)添加标注标签: a、给标注添加落下的动画效果,点击标注可弹出对话框,还可以拖拽标注; b、通过BMKMapView的addAn
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值