Android自定義百度地圖縮放圖示
阿新 • • 發佈:2018-12-23
自定義實現Android百度地圖的縮放圖示,需要自定義一個縮放控制元件,實現效果如下:
這裡的縮放效果,實現了點選按鈕可以對地圖的放大縮小,通過手勢放大與縮小也控制縮放圖示的可用狀態。具體實現如下:
首先是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;//放大按鈕
private Button outBtn;//縮小按鈕
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);
//獲取放大按鈕
inBtn=(Button) view.findViewById(R.id.btn_zoom_in);
//獲取縮小按鈕
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();//改變縮放按鈕
break;
case R.id.btn_zoom_out:
//改變地圖狀態
this.baiduMap.setMapStatus(MapStatusUpdateFactory.zoomTo(mapStatus.zoom-1));
controlZoomShow();//改變縮放按鈕
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();//改變縮放按鈕
}
/**
* 控制縮放圖示顯示
*/
private void controlZoomShow(){
//獲取當前地圖狀態
float zoom=this.baiduMap.getMapStatus().zoom;
//如果當前狀態大於等於地圖的最大狀態,則放大按鈕則失效
if(zoom>=maxZoomLevel){
inBtn.setBackgroundResource(R.drawable.zoomin_press);
inBtn.setEnabled(false);
}else{
inBtn.setBackgroundResource(R.drawable.zoom_selector_in);
inBtn.setEnabled(true);
}
//如果當前狀態小於等於地圖的最小狀態,則縮小按鈕失效
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();//銷燬地圖
}
}
這樣就實現了自定義的縮放圖示了