<a target="_blank" href="http://blog.51cto.com/attachment/201208/155654448.png"></a>
其實Google Map中的地标(或者說圖示更貼切)就是位于地圖圖層上的一個新圖層,我們隻需要簡單的将自己的圖示(或者是圖示集合)添加到Google Map内置的圖示圖層裡去即可。
以上文中的HelloGoogleMap為例
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<com.google.android.maps.MapView
android:id="@+id/mapview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:apiKey="你所獲得的API KEY"
android:clickable="true" />
</RelativeLayout>
package com.billhoo.study.hellogooglemaps;
import java.util.List;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import com.google.android.maps.GeoPoint;
import com.google.android.maps.MapActivity;
import com.google.android.maps.MapView;
import com.google.android.maps.Overlay;
import com.google.android.maps.OverlayItem;
public class MainActivity extends MapActivity {
MapView mMapView = null; //Google Map 對象
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mMapView = (MapView) findViewById(R.id.mapview);
mMapView.setBuiltInZoomControls(true); // 使用內置放大縮小控制按鈕
protected boolean isRouteDisplayed() {
return false;
}
}
上述代碼能夠在MainActivity中顯示GoogleMap,接下來我們将編寫自定義的圖示類HelloItemizedOverlay,本類維護一個圖示集合,并在需要時由使用者将本類對象添加進GoogleMap内置的圖示集合中去,進而實作地圖上圖示的顯示以及其他相關操作。代碼如下:
import java.util.ArrayList;
import android.app.AlertDialog;
import android.content.Context;
import com.google.android.maps.ItemizedOverlay;
@SuppressWarnings("rawtypes")
public class HelloItemizedOverlay extends ItemizedOverlay {
private ArrayList<OverlayItem> mOverlayItems = new ArrayList<OverlayItem>(); // 由本類維護的自定義圖示集合和
private Context mContext = null;
public HelloItemizedOverlay(Drawable defaultMarker) {
super(boundCenter(defaultMarker)); // 使用預設圖示初始化父類
public HelloItemizedOverlay(Drawable defaultMarker, Context context) {
super(boundCenter(defaultMarker));
mContext = context;
protected OverlayItem createItem(int i) {
return mOverlayItems.get(i);
public int size() {
return mOverlayItems.size();
/**
* 當圖示被點選時
*/
protected boolean onTap(int index) {
OverlayItem item = mOverlayItems.get(index);
AlertDialog.Builder dialog = new AlertDialog.Builder(mContext);
dialog.setTitle(item.getTitle());
dialog.setMessage(item.getSnippet());
dialog.show();
return true;
* 在本類維護的圖示集合中添加一個新的圖示
*
* @param overlay
public void addOverlay(OverlayItem overlay) {
mOverlayItems.add(overlay);
populate();
上述代碼算是一個固定結構,期間重載了父類ItemizedOverlay的createItem(int i)、size()以及onTap(int index)方法,并且新增了一個用于添加新圖示的addOverlay(OverlayItem overlay)方法(今後可以根據自己的需要增加諸如clear()、remove()等常用方法)。
接下來需要做的事情便是利用上述工具類進行圖示的添加了,修改後的MainActivity如下:
private MapView mMapView = null; // Google Map 對象
List<Overlay> mapOverlays = mMapView.getOverlays(); // 擷取GoogleMap内置的圖示集合
Drawable drawable = this.getResources().getDrawable(
R.drawable.cur_location);
HelloItemizedOverlay itemizedOverlays = new HelloItemizedOverlay(
drawable, this); // 使用cur_location這個圖示初始化我們的工具類HelloItemizedOverlay
GeoPoint point1 = new GeoPoint((int) (35.422006 * 1E6),
(int) (104.084095 * 1E6)); // 建構一個GeoPoint位置對象,經度35.422006,緯度104.084095
OverlayItem overlayItem1 = new OverlayItem(point1, "我的第一個地标", "随便找個點"); // 建構我們的第一個自定義圖示,位于point1處
GeoPoint point2 = new GeoPoint((int) (35.4 * 1E6), (int) (139.46 * 1E6)); // 同上
OverlayItem overlayItem2 = new OverlayItem(point2, "這是第二個圖示", "随便找的地點"); // 同上
itemizedOverlays.addOverlay(overlayItem1); // 将我們的第一個圖示添加進自定義圖示集合
itemizedOverlays.addOverlay(overlayItem2); // 将我們的第二個圖示添加進該集合
mapOverlays.add(itemizedOverlays); // 将我們的自定義圖示集itemizedOverlays添加到GoogleMap内置的圖示集合中去
到此為止,在GoogleMap上顯示自定義圖示的基礎部分已經全部完工,運作模拟器看看效果吧。
<a target="_blank" href="http://blog.51cto.com/attachment/201208/163001801.png"></a>
依次點選第一個以及第二個氣泡,便會彈出我們之前設定好的提示資訊
<a target="_blank" href="http://blog.51cto.com/attachment/201208/164936507.png"></a>
<a target="_blank" href="http://blog.51cto.com/attachment/201208/163001169.png"></a>
細心的朋友會發現,氣泡的陰影部分怎麼沒有正确顯示?别忙,請在代碼段中加入如下處理
...
// 使圖示陰影正确顯示
Drawable marker = this.getResources().getDrawable(
int w = marker.getIntrinsicWidth();
int h = marker.getIntrinsicHeight();
marker.setBounds(-w / 2, -h, w / 2, 0);
overlayItem1.setMarker(marker); // 将overlayItem1的圖示重新設定成marker
// overlayItem2.setMarker(marker); //為了示範差別,第二個點不重新設定
再次運作,發現第一個點的陰影已經正确顯示了。
<a target="_blank" href="http://blog.51cto.com/attachment/201208/164328727.png"></a>
到此,bill已經将圖示的添加介紹完畢,其中還包括了自己遇到的陰影錯位問題的修正方法。但是,Android Google Map的陷阱還有很多,這也是bill這段時間以來一直在折騰的原因。接下來的文章,bill将一一向大家分享這些陷阱的解決方案,希望能夠幫到那些像bill之前那樣,對其中各種莫名其妙的異常或錯誤百思不得其解的朋友。
本文轉自Bill_Hoo 51CTO部落格,原文連結:http://blog.51cto.com/billhoo/970811,如需轉載請自行聯系原作者