Android自己定义百度地图缩放图标

Posted 2020-09-25 cynchanpin

自己定义实现android百度地图的缩放图标，须要自己定义一个缩放控件，实现效果例如以下：

这里的缩放效果，实现了点击button能够对地图的放大缩小，通过手势放大与缩小也控制缩放图标的可用状态。详细实现例如以下：

首先是drawable文件夹下的两个xml配置文件：

zoom_selector_in.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/zoomin_press"/>
    <item android:state_enabled="false" android:drawable="@drawable/zoomin_disable"/>
    <item android:drawable="@drawable/zoomin_normal"/>
</selector>

zoom_selector_out.xml

<?
xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/zoomout_press"/>
    <item android:state_enabled="false" android:drawable="@drawable/zoomout_disable"/>
    <item android:drawable="@drawable/zoomout_normal"/>
</selector>

layout中的zoom_controls_in_out.xml布局文件：

<?xml version="1.0" encoding="utf-8"?
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:orientation="vertical">

    <Button
        android:id="@+id/btn_zoom_in"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:background="@drawable/zoom_selector_in" />

    <Button
        android:id="@+id/btn_zoom_out"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:background="@drawable/zoom_selector_out" />

</LinearLayout>

主配置文件main_activity.xml

<?
xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <com.baidu.mapapi.map.MapView
        android:id="@+id/mv_map"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clickable="true" />
    <com.example.map.view.ZoomControlsView 
        android:id="@+id/zcv_zoom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="10dp"
        android:layout_marginRight="10dp"/>
</RelativeLayout>

相关的xml文件都在这里了。以下是详细实现代码：

自己定义缩放控件类ZoomControlsView.java

package com.example.map.view;
import com.baidu.mapapi.map.BaiduMap;
import com.baidu.mapapi.map.MapStatus;
import com.baidu.mapapi.map.MapStatusUpdateFactory;
import com.baidu.mapapi.map.MapView;
import com.example.map.activity.R;

import android.content.Context;
import android.util.AttributeSet;
import android.widget.Button;
import android.widget.LinearLayout;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;;

public class ZoomControlsView extends LinearLayout implements OnClickListener{
	private Button inBtn;//放大button
	private Button outBtn;//缩小button
	private BaiduMap baiduMap;//百度地图对象控制器
	private MapStatus mapStatus;//百度地图状态
	private float minZoomLevel;//地图最小级别
	private float maxZoomLevel;//地图最大级别

	public ZoomControlsView(Context context, AttributeSet attrs) {
		super(context, attrs, 0);
		init();
	}
	
	public ZoomControlsView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}
	
	/**
	 * 初始化
	 */
	private void init(){
		//获取布局视图
		LinearLayout view=(LinearLayout) LayoutInflater.from(getContext()).inflate(R.layout.zoom_controls_in_out, null);
		//获取放大button
		inBtn=(Button) view.findViewById(R.id.btn_zoom_in);
		//获取缩小button
		outBtn=(Button) view.findViewById(R.id.btn_zoom_out);
		//设置点击事件
		inBtn.setOnClickListener(this);
		outBtn.setOnClickListener(this);
		//加入View
		addView(view);
	}

	@Override
	public void onClick(View v) {
		this.mapStatus=this.baiduMap.getMapStatus();//获取地图状态
		switch (v.getId()) {
		case R.id.btn_zoom_in:
			//改变地图状态
			this.baiduMap.setMapStatus(MapStatusUpdateFactory.zoomTo(mapStatus.zoom+1));
			controlZoomShow();//改变缩放button
			break;
		case R.id.btn_zoom_out:
			//改变地图状态
			this.baiduMap.setMapStatus(MapStatusUpdateFactory.zoomTo(mapStatus.zoom-1));
			controlZoomShow();//改变缩放button
			break;
		default:
			break;
		}
		//又一次获取状态
		mapStatus=this.baiduMap.getMapStatus();
	}
	
	/**
	 * 设置Map视图
	 * @param mapView
	 */
	public void setMapView(MapView mapView){
		//获取百度地图控制器
		this.baiduMap=mapView.getMap();
		//设置地图手势事件
		this.baiduMap.setOnMapStatusChangeListener(onMapStatusChangeListener);
		//获取百度地图最大最小级别
		maxZoomLevel=baiduMap.getMaxZoomLevel();
		minZoomLevel=baiduMap.getMinZoomLevel();
		controlZoomShow();//改变缩放button
	}
	
	/**
	 * 控制缩放图标显示
	 */
	private void controlZoomShow(){
		//获取当前地图状态
		float zoom=this.baiduMap.getMapStatus().zoom;
		//假设当前状态大于等于地图的最大状态，则放大button则失效
		if(zoom>=maxZoomLevel){
			inBtn.setBackgroundResource(R.drawable.zoomin_press);
			inBtn.setEnabled(false);
		}else{
			inBtn.setBackgroundResource(R.drawable.zoom_selector_in);
			inBtn.setEnabled(true);
		}
		
		//假设当前状态小于等于地图的最小状态，则缩小button失效
		if(zoom<=minZoomLevel){
			outBtn.setBackgroundResource(R.drawable.zoomout_press);
			outBtn.setEnabled(false);
		}else{
			outBtn.setBackgroundResource(R.drawable.zoom_selector_out);
			outBtn.setEnabled(true);
		}
	}
	/**
	 * 地图状态改变相关接口实现
	 */
	BaiduMap.OnMapStatusChangeListener onMapStatusChangeListener=new BaiduMap.OnMapStatusChangeListener() {
		
		/**
		 * 手势操作地图，设置地图状态等操作导致地图状态開始改变。 
		 * @param status 地图状态改变開始时的地图状态 
		 */
		@Override
		public void onMapStatusChangeStart(MapStatus arg0) {
			
		}
		
		/**
		 * 地图状态变化结束
		 * @param status 地图状态改变结束时的地图状态 
		 */
		@Override
		public void onMapStatusChangeFinish(MapStatus arg0) {
			
		}
		
		/**
		 * 地图状态变化中
		 * @param status 当前地图状态
		 */
		@Override
		public void onMapStatusChange(MapStatus arg0) {
			controlZoomShow();
		}
	};

}

MainActivity.java:

package com.example.map.activity;
import com.baidu.mapapi.SDKInitializer;
import com.baidu.mapapi.map.BaiduMap;
import com.baidu.mapapi.map.MapView;
import com.example.map.view.ZoomControlsView;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity{
	private MapView mvMap;//百度地图控件
	private BaiduMap baiduMap;//地图对象控制器
	private ZoomControlsView zcvZomm;//缩放控件
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		//必须在setContentView前
		SDKInitializer.initialize(getApplicationContext());
		setContentView(R.layout.main_activity);
		initMap();//初始化
	}
	
	/**
	 * 初始化地图
	 */
	private void initMap(){
		//获取地图控件
		mvMap=(MapView) findViewById(R.id.mv_map);
		mvMap.showZoomControls(false);//隐藏缩放控件
		//获取地图对象控制器
		baiduMap=mvMap.getMap();
		baiduMap.setBuildingsEnabled(true);//设置显示楼体
		baiduMap.setMapStatus(MapStatusUpdateFactory.zoomTo(19f));//设置地图状态
		
		//获取缩放控件
		zcvZomm=(ZoomControlsView) findViewById(R.id.zcv_zoom);
		zcvZomm.setMapView(mvMap);//设置百度地图控件
		
	}
	
	
	
	@Override
	protected void onPause() {
		super.onPause();
		mvMap.onPause();
	}
	
	@Override
	protected void onResume() {
		super.onResume();
		mvMap.onResume();
	}
	@Override
	protected void onDestroy() {
		super.onDestroy();
		mvMap.onDestroy();//销毁地图
	}
	
}

这样就实现了自己定义的缩放图标了