Android 百度地图开发（三）

实现比例尺功能和替换自带的缩放组件

ScaleView是比例尺控件。ZoomControlView是缩放控件，MainActivity就是我们的主界面了

先看下ZoomControlView类。代码例如以下

[java] view
plaincopy

1. package com.example.baidumapdemo;
2. import com.baidu.mapapi.map.MapView;
3. import android.content.Context;
4. import android.util.AttributeSet;
5. import android.view.LayoutInflater;
6. import android.view.View;
7. import android.widget.Button;
8. import android.widget.RelativeLayout;
9. import android.view.View.OnClickListener;
10. public class ZoomControlView extends RelativeLayout implements OnClickListener{
11. private Button mButtonZoomin;
12. private Button mButtonZoomout;
13. private MapView mapView;
14. private int maxZoomLevel;
15. private int minZoomLevel;
16. public ZoomControlView(Context context, AttributeSet attrs) {
17. this(context, attrs, 0);
18. }
19. public ZoomControlView(Context context, AttributeSet attrs, int defStyle) {
20. super(context, attrs, defStyle);
21. init();
22. }
23. private void init() {
24. View view = LayoutInflater.from(getContext()).inflate(R.layout.zoom_controls_layout, null);
25. mButtonZoomin = (Button) view.findViewById(R.id.zoomin);
26. mButtonZoomout = (Button) view.findViewById(R.id.zoomout);
27. mButtonZoomin.setOnClickListener(this);
28. mButtonZoomout.setOnClickListener(this);
29. addView(view);
30. }
31. @Override
32. public void onClick(View v) {
33. if(mapView == null){
34. throw new NullPointerException("you can call setMapView(MapView mapView) at first");
35. }
36. switch (v.getId()) {
37. case R.id.zoomin:{
38. mapView.getController().zoomIn();
39. break;
40. }
41. case R.id.zoomout:{
42. mapView.getController().zoomOut();
43. break;
44. }
45. }
46. }
47. /**
48. * 与MapView设置关联
49. * @param mapView
50. */
51. public void setMapView(MapView mapView) {
52. this.mapView = mapView;
53. // 获取最大的缩放级别
54. maxZoomLevel = mapView.getMaxZoomLevel();
55. // 获取最大的缩放级别
56. minZoomLevel = mapView.getMinZoomLevel();
57. }
58. /**
59. * 依据MapView的缩放级别更新缩放button的状态。当达到最大缩放级别，设置mButtonZoomin
60. * 为不能点击，反之设置mButtonZoomout
61. * @param level
62. */
63. public void refreshZoomButtonStatus(int level){
64. if(mapView == null){
65. throw new NullPointerException("you can call setMapView(MapView mapView) at first");
66. }
67. if(level > minZoomLevel && level < maxZoomLevel){
68. if(!mButtonZoomout.isEnabled()){
69. mButtonZoomout.setEnabled(true);
70. }
71. if(!mButtonZoomin.isEnabled()){
72. mButtonZoomin.setEnabled(true);
73. }
74. }
75. else if(level == minZoomLevel ){
76. mButtonZoomout.setEnabled(false);
77. }
78. else if(level == maxZoomLevel){
79. mButtonZoomin.setEnabled(false);
80. }
81. }
82. }

这个类封装好了地图的缩放功能，里面主要是两个button，一个button是放大MapView。当放大到了MapView的最大缩放级别，设置此button的Enable为false，还有一个button缩小MapView，当缩小到了MapView最小的缩放级别，设置此button的Enable为false。refreshZoomButtonStatus()方法就是实现了此功能，我们依据MapView的缩放级别来更新button的状态，我们还必须调用setMapView(MapView
mapView)方法来设置ZoomControlView与MapView关联，ZoomControlView的布局文件zoom_controls_layout我就不贴出来了，里面就两个button，然后给button设置背景选择器seletor

ScaleView类的代码例如以下

[java] view
plaincopy

1. <span style="font-family:System;font-size:12px;">package com.example.baidumapdemo;
2. import com.baidu.mapapi.map.MapView;
3. import com.baidu.platform.comapi.basestruct.GeoPoint;
4. import android.annotation.SuppressLint;
5. import android.content.Context;
6. import android.graphics.Bitmap;
7. import android.graphics.BitmapFactory;
8. import android.graphics.Canvas;
9. import android.graphics.Color;
10. import android.graphics.NinePatch;
11. import android.graphics.Paint;
12. import android.graphics.Rect;
13. import android.graphics.Typeface;
14. import android.util.AttributeSet;
15. import android.view.View;
16. public class ScaleView extends View {
17. private Paint mPaint;
18. /**
19. * 比例尺的宽度
20. */
21. private int scaleWidth;
22. /**
23. * 比例尺的高度
24. */
25. private int scaleHeight = 4;
26. /**
27. * 比例尺上面字体的颜色
28. */
29. private int textColor = Color.BLACK;
30. /**
31. * 比例尺上边的字体
32. */
33. private String text;
34. /**
35. * 字体大小
36. */
37. private int textSize = 16;
38. /**
39. * 比例尺与字体间的距离
40. */
41. private int scaleSpaceText = 8;
42. /**
43. * 百度地图最大缩放级别
44. */
45. private static final int MAX_LEVEL = 19;
46. /**
47. * 各级比例尺分母值数组
48. */
49. private static final int[] SCALES = {20, 50, 100, 200, 500, 1000, 2000,
50. 5000, 10000, 20000, 25000, 50000, 100000, 200000, 500000, 1000000,
51. 2000000 };
52. /**
53. * 各级比例尺上面的文字数组
54. */
55. private static final String[] SCALE_DESCS = { "20米", "50米", "100米", "200米",
56. "500米", "1公里", "2公里", "5公里", "10公里", "20公里", "25公里", "50公里",
57. "100公里", "200公里", "500公里", "1000公里", "2000公里" };
58. private MapView mapView;
59. /**
60. * 与MapView设置关联
61. * @param mapView
62. */
63. public void setMapView(MapView mapView) {
64. this.mapView = mapView;
65. }
66. public ScaleView(Context context) {
67. this(context, null);
68. }
69. public ScaleView(Context context, AttributeSet attrs) {
70. this(context, attrs, 0);
71. }
72. public ScaleView(Context context, AttributeSet attrs, int defStyle) {
73. super(context, attrs, defStyle);
74. mPaint = new Paint();
75. }
76. /**
77. * 绘制上面的文字和以下的比例尺，由于比例尺是.9.png，我们须要利用drawNinepath方法绘制比例尺
78. */
79. @SuppressLint("DrawAllocation")
80. @Override
81. protected void onDraw(Canvas canvas) {
82. super.onDraw(canvas);
83. int width = scaleWidth;
84. mPaint.setColor(textColor);
85. mPaint.setAntiAlias(true);
86. mPaint.setTextSize(textSize);
87. mPaint.setTypeface(Typeface.DEFAULT_BOLD);
88. float textWidth = mPaint.measureText(text);
89. canvas.drawText(text, (width - textWidth) / 2, textSize, mPaint);
90. Rect scaleRect = new Rect(0, textSize + scaleSpaceText, scaleWidth, textSize + scaleSpaceText + scaleHeight);
91. drawNinepath(canvas, R.drawable.icon_scale, scaleRect);
92. }
93. /**
94. * 手动绘制.9.png图片
95. * @param canvas
96. * @param resId
97. * @param rect
98. */
99. private void drawNinepath(Canvas canvas, int resId, Rect rect){
100. Bitmap bmp= BitmapFactory.decodeResource(getResources(), resId);
101. NinePatch patch = new NinePatch(bmp, bmp.getNinePatchChunk(), null);
102. patch.draw(canvas, rect);
103. }
104. /**
105. * 測量ScaleView的方法。
106. */
107. @Override
108. protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
109. super.onMeasure(widthMeasureSpec, heightMeasureSpec);
110. int widthSize = getWidthSize(widthMeasureSpec);
111. int heightSize = getHeightSize(heightMeasureSpec);
112. setMeasuredDimension(widthSize, heightSize);
113. }
114. /**
115. * 測量ScaleView的宽度
116. * @param widthMeasureSpec
117. * @return
118. */
119. private int getWidthSize(int widthMeasureSpec){
120. return MeasureSpec.getSize(widthMeasureSpec);
121. }
122. /**
123. * 測量ScaleView的高度
124. * @param widthMeasureSpec
125. * @return
126. */
127. private int getHeightSize(int heightMeasureSpec){
128. int mode = MeasureSpec.getMode(heightMeasureSpec);
129. int height = 0;
130. switch (mode) {
131. case MeasureSpec.AT_MOST:
132. height = textSize + scaleSpaceText + scaleHeight;
133. break;
134. case MeasureSpec.EXACTLY:{
135. height = MeasureSpec.getSize(heightMeasureSpec);
136. break;
137. }
138. case MeasureSpec.UNSPECIFIED:{
139. height = Math.max(textSize + scaleSpaceText + scaleHeight, MeasureSpec.getSize(heightMeasureSpec));
140. break;
141. }
142. }
143. return height;
144. }
145. /**
146. * 依据缩放级别，得到相应比例尺在SCALES数组中的位置（索引）
147. * @param zoomLevel
148. * @return
149. */
150. private static int getScaleIndex(int zoomLevel) {
151. return MAX_LEVEL - zoomLevel;
152. }
153. /**
154. * 依据缩放级别。得到相应比例尺
155. *
156. * @param zoomLevel
157. * @return
158. */
159. public static int getScale(int zoomLevel) {
160. return SCALES[getScaleIndex(zoomLevel)];
161. }
162. /**
163. *  依据缩放级别，得到相应比例尺文字
164. * @param zoomLevel
165. * @return
166. */
167. public static String getScaleDesc(int zoomLevel) {
168. return SCALE_DESCS[getScaleIndex(zoomLevel)];
169. }
170. /**
171. * 依据地图当前中心位置的纬度。当前比例尺，得出比例尺图标应该显示多长（多少像素）
172. * @param map
173. * @param scale
174. * @return
175. */
176. public static int meterToPixels(MapView map, int scale) {
177. // 得到当前中心位置对象
178. GeoPoint geoPoint = map.getMapCenter();
179. // 得到当前中心位置纬度
180. double latitude = geoPoint.getLatitudeE6() / 1E6;
181. // 得到象素数，比方当前比例尺是1/10000。比方scale=10000，相应在该纬度应在地图中绘多少象素
182. // 參考http://rainbow702.iteye.com/blog/1124244
183. return (int) (map.getProjection().metersToEquatorPixels(scale) / (Math
184. .cos(Math.toRadians(latitude))));
185. }
186. /**
187. * 设置比例尺的宽度
188. * @param scaleWidth
189. */
190. public  void setScaleWidth(int scaleWidth) {
191. this.scaleWidth = scaleWidth;
192. }
193. /**
194. * 设置比例尺的上面的 text 比如 200公里
195. * @param text
196. */
197. private void setText(String text) {
198. this.text = text;
199. }
200. /**
201. * 设置字体大小
202. * @param textSize
203. */
204. public void setTextSize(int textSize) {
205. this.textSize = textSize;
206. invalidate();
207. }
208. /**
209. * 依据缩放级别更新ScaleView的文字以及比例尺的长度
210. * @param level
211. */
212. public void refreshScaleView(int level) {
213. if(mapView == null){
214. throw new NullPointerException("you can call setMapView(MapView mapView) at first");
215. }
216. setText(getScaleDesc(level));
217. setScaleWidth(meterToPixels(mapView, getScale(level)));
218. invalidate();
219. }
220. }</span>

ScaleView是比例尺控件类，主要是提供比例尺的绘制功能，在onDraw(Canvas canvas)的方法中绘制上面的距离和以下的比例尺长度。这里面要说下drawNinepath()方法，由于我们的比例尺图片是.9.png格式的，保证图片拉伸状态下不变形，假设用寻常绘制一般图片的方法会报ClassCastException。所以我们能够利用drawNinepath()来手动绘制.9.png格式的图片。我们比例尺的长度是变化的。我们须要将以米为计量单位的距离（沿赤道）在当前缩放水平下转换到一个以像素（水平）为计量单位的距离，meterToPixels()方法依据我们MapView当前的缩放级别，得出比例尺图标应该显示多长。refreshScaleView()是用来更新ScaleView的，更新上面的字符串和以下比例尺的长度，当然我们也必须调用setMapView(MapView
mapView)方法来设置ScaleView与MapView关联

接下来我们就来使用我们的比例尺控件和缩放控件了，先看下布局

[html] view
plaincopy

1. <?

   xml version="1.0" encoding="utf-8"?

   >

2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent" >
5. <com.baidu.mapapi.map.MapView
6. android:id="@+id/bmapView"
7. android:layout_width="fill_parent"
8. android:layout_height="fill_parent"
9. android:clickable="true" />
10. <com.example.baidumapdemo.ZoomControlView
11. android:id="@+id/ZoomControlView"
12. android:layout_width="wrap_content"
13. android:layout_height="wrap_content"
14. android:layout_alignParentBottom="true"
15. android:layout_alignParentRight="true"
16. android:layout_marginBottom="20.0dip"
17. android:layout_marginRight="5.0dip"/>
18. <com.example.baidumapdemo.ScaleView
19. android:id="@+id/scaleView"
20. android:layout_width="wrap_content"
21. android:layout_height="wrap_content"
22. android:layout_alignParentBottom="true"
23. android:layout_alignParentLeft="true"
24. android:layout_marginBottom="40dp"
25. android:layout_marginLeft="20dp" />
26. </RelativeLayout>

主界面MainActivity的代码例如以下

[java] view
plaincopy

1. package com.example.baidumapdemo;
2. import android.app.Activity;
3. import android.graphics.Bitmap;
4. import android.os.Bundle;
5. import android.widget.Toast;
6. import com.baidu.mapapi.BMapManager;
7. import com.baidu.mapapi.MKGeneralListener;
8. import com.baidu.mapapi.map.MKEvent;
9. import com.baidu.mapapi.map.MKMapViewListener;
10. import com.baidu.mapapi.map.MapController;
11. import com.baidu.mapapi.map.MapPoi;
12. import com.baidu.mapapi.map.MapView;
13. import com.baidu.platform.comapi.basestruct.GeoPoint;
14. public class MainActivity extends Activity{
15. private BMapManager mBMapManager;
16. /**
17. * MapView 是地图主控件
18. */
19. private MapView mMapView = null;
20. /**
21. * 用MapController完毕地图控制
22. */
23. private MapController mMapController = null;
24. private ScaleView mScaleView;
25. private ZoomControlView mZoomControlView;
26. @Override
27. protected void onCreate(Bundle savedInstanceState) {
28. super.onCreate(savedInstanceState);
29. //使用地图sdk前需先初始化BMapManager，这个必须在setContentView()先初始化
30. mBMapManager = new BMapManager(this);
31. //第一个參数是API key,
32. //第二个參数是经常使用事件监听，用来处理通常的网络错误，授权验证错误等，你也能够不加入这个回调接口
33. mBMapManager.init("CC61ac7527b65c95899608810873b173", new MKGeneralListener() {
34. //授权错误的时候调用的回调函数
35. @Override
36. public void onGetPermissionState(int iError) {
37. if (iError ==  MKEvent.ERROR_PERMISSION_DENIED) {
38. Toast.makeText(getApplication(), "API Key错误。请检查。",
39. Toast.LENGTH_LONG).show();
40. }
41. }
42. //一些网络状态的错误处理回调函数
43. @Override
44. public void onGetNetworkState(int iError) {
45. if (iError == MKEvent.ERROR_NETWORK_CONNECT) {
46. Toast.makeText(getApplication(), "您的网络出错啦！",
47. Toast.LENGTH_LONG).show();
48. }
49. }
50. });
51. setContentView(R.layout.activity_main);
52. mMapView = (MapView) findViewById(R.id.bmapView);
53. //隐藏自带的地图缩放控件
54. mMapView.setBuiltInZoomControls(false);
55. mScaleView = (ScaleView) findViewById(R.id.scaleView);
56. mScaleView.setMapView(mMapView);
57. mZoomControlView = (ZoomControlView) findViewById(R.id.ZoomControlView);
58. mZoomControlView.setMapView(mMapView);
59. //地图显示事件监听器。 该接口监听地图显示事件，用户须要实现该接口以处理对应事件。
60. mMapView.regMapViewListener(mBMapManager, new MKMapViewListener() {
61. @Override
62. public void onMapMoveFinish() {
63. refreshScaleAndZoomControl();
64. }
65. @Override
66. public void onMapLoadFinish() {
67. }
68. /**
69. * 动画结束时会回调此消息.我们在此方法里面更新缩放button的状态
70. */
71. @Override
72. public void onMapAnimationFinish() {
73. refreshScaleAndZoomControl();
74. }
75. @Override
76. public void onGetCurrentMap(Bitmap arg0) {
77. }
78. @Override
79. public void onClickMapPoi(MapPoi arg0) {
80. }
81. });
82. //获取地图控制器
83. mMapController = mMapView.getController();
84. //设置地图是否响应点击事件  .
85. mMapController.enableClick(true);
86. //设置地图缩放级别
87. mMapController.setZoom(14);
88. refreshScaleAndZoomControl();
89. //保存精度和纬度的类,
90. GeoPoint p = new GeoPoint((int)(22.547923 * 1E6), (int)(114.067368 * 1E6));
91. //设置p地方为中心点
92. mMapController.setCenter(p);
93. }
94. private void refreshScaleAndZoomControl(){
95. //更新缩放button的状态
96. mZoomControlView.refreshZoomButtonStatus(Math.round(mMapView.getZoomLevel()));
97. mScaleView.refreshScaleView(Math.round(mMapView.getZoomLevel()));
98. }
99. @Override
100. protected void onResume() {
101. //MapView的生命周期与Activity同步，当activity挂起时需调用MapView.onPause()
102. mMapView.onResume();
103. super.onResume();
104. }
105. @Override
106. protected void onPause() {
107. //MapView的生命周期与Activity同步。当activity挂起时需调用MapView.onPause()
108. mMapView.onPause();
109. super.onPause();
110. }
111. @Override
112. protected void onDestroy() {
113. //MapView的生命周期与Activity同步。当activity销毁时需调用MapView.destroy()
114. mMapView.destroy();
115. //退出应用调用BMapManager的destroy()方法
116. if(mBMapManager != null){
117. mBMapManager.destroy();
118. mBMapManager = null;
119. }
120. super.onDestroy();
121. }
122. }

主界面的代码还是比較简单的。主要是利用MapView的regMapViewListener()来注冊地图显示事件监听器。

该接口监听地图显示事件。用户须要实现该接口以处理对应事件，分别在回调方法onMapAnimationFinish()和onMapMoveFinish()来更新ZoomControlView和ScaleView的一些状态

在执行之前须要在Manifest中增加相相应的权限问题

[java] view
plaincopy

1. <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
2. <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
3. <uses-permission android:name="android.permission.INTERNET" />
4. <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
5. <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
6. <uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
7. <uses-permission android:name="android.permission.READ_PHONE_STATE" />

执行结果

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveGlhYW5taW5n/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" width="240" height="400" hspace="10" alt="" style="border:none; max-width:100%">

好了，今天的解说到此结束。有疑问的朋友请在以下留言！