title: 百度地圖之——自定義marker樣式
優(yōu)秀資源集錦
如果我比別人看得遠些,那是因為我站在巨人們的肩上
在百度地圖提供的API中，我們可以通過圖片來設置marker的樣式，但是當實現的效果復雜時就不能單單靠圖片解決务漩，我們已經見到了太多太多的marker樣式咱台。就讓我們來實現自己想要的樣式巡蘸。
首先讓我們來看看效果圖奋隶，由這你可以任意發(fā)揮想象，做成你想要的樣式悦荒。
基礎的百度地圖配置請參照 百度地圖開發(fā)指南進行配置
一唯欣、在布局文件添加百度地圖的MapView
<com.baidu.mapapi.map.MapView
android:id="@+id/bmapView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clickable="true" />
然后新建marker.xml布局文件，實現一個marker的樣式搬味。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/cover_nameId"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray"
android:gravity="center"
android:text="名稱：我擦我擦我擦路"
android:textAppearance="?android:attr/textAppearanceSmall" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:orientation="horizontal">
<TextView
android:id="@+id/cover_temptureId"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="溫度：20 C"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="@+id/cover_concentrationId"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="濃度：20 C"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray"
android:orientation="horizontal">
<TextView
android:id="@+id/cover_licquid_levelId"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="液位：200"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="@+id/cover_electricityId"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="電量：20％"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<ImageView
android:layout_marginTop="10dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="@mipmap/marker"/>
</LinearLayout>
二境氢、使用到的變量聲明
MapView mMapView = null;MapStatus
mMapStatus;MapStatusUpdate mMapStatusUpdate;
BaiduMap mBaiduMap;Marker coverMarker;
List<Map<String, String>> coverArray = newArrayList<Map<String, String>>();
三、地圖初始化配置
//在使用SDK各組件之前初始化context信息碰纬，傳入ApplicationContext
//注意該方法要再setContentView方法之前實現
SDKInitializer.initialize(getApplicationContext());
setContentView(R.layout.activity_covermap);
//獲取地圖控件引用
mMapView = (MapView) findViewById(R.id.bmapView);
mBaiduMap = mMapView.getMap();
Intent intent = getIntent();
coverArray = (List<Map<String, String>>) intent.getSerializableExtra("coverArray");
System.out.println("coverArray：" + coverArray.size());
if (coverArray.size() != 0) {
//經緯度 Latitude and longitude
String latitude = coverArray.get(0).get("latitude");
String longitude = coverArray.get(0).get("longitude");
System.out.println("latitude:" + latitude + " longitude:" + longitude);
LatLng cenpt = new LatLng(Double.valueOf(latitude), Double.valueOf(longitude));
mMapStatus = new MapStatus.Builder().target(cenpt).zoom(16).build();
mMapStatusUpdate = MapStatusUpdateFactory.newMapStatus(mMapStatus);
mBaiduMap.setMapStatus(mMapStatusUpdate);
addMarkers(); //添加標注萍聊。
}
四、addMarker()函數
private void addMarkers() {
double[][] coordinates = new double[coverArray.size()][2];
for (int i = 0; i < coverArray.size(); i++) {
coordinates[i][0] = Double.parseDouble(coverArray.get(i).get("longitude"));
coordinates[i][1] = Double.parseDouble(coverArray.get(i).get("latitude"));
}
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.marker, null);
TextView coverNameTv = (TextView) view.findViewById(R.id.cover_nameId);
TextView covertemptureTv = (TextView) view.findViewById(R.id.cover_temptureId);
TextView coverconcentrationTv = (TextView) view.findViewById(R.id.cover_concentrationId);
TextView coverlicquidlevelTv = (TextView) view.findViewById(R.id.cover_licquid_levelId);
TextView coverelectricityTv = (TextView) view.findViewById(R.id.cover_electricityId);
for (int j = 0; j < coverArray.size(); j++) {
LatLng lla = new LatLng(coordinates[j][1], coordinates[j][0]);
coverNameTv.setText(coverArray.get(j).get("covername"));
covertemptureTv.setText("溫度：" + coverArray.get(j).get("temperature") + "℃");
coverconcentrationTv.setText("濃度：" + coverArray.get(j).get("concentration"));
coverlicquidlevelTv.setText("液位：" + coverArray.get(j).get("liquidlevel"));
coverelectricityTv.setText("電量：" + coverArray.get(j).get("electricity") + "%");
if (coverArray.get(j).get("lostflag").equals("1")) {
coverNameTv.setBackgroundColor(Color.RED);
covertemptureTv.setBackgroundColor(Color.RED);
coverconcentrationTv.setBackgroundColor(Color.RED);
coverlicquidlevelTv.setBackgroundColor(Color.RED);
coverelectricityTv.setBackgroundColor(Color.RED);
}
else{
coverNameTv.setBackgroundColor(Color.GRAY);
covertemptureTv.setBackgroundColor(Color.WHITE);
coverconcentrationTv.setBackgroundColor(Color.WHITE);
coverlicquidlevelTv.setBackgroundColor(Color.GRAY);
coverelectricityTv.setBackgroundColor(Color.GRAY);
}
BitmapDescriptor bd1 = BitmapDescriptorFactory.fromBitmap(getBitmapFromView(view));
MarkerOptions ooA = new MarkerOptions().position(lla).icon(bd1).zIndex(9).draggable(true).title(coverArray.get(j).get("coverid"));
coverMarker = (Marker) mBaiduMap.addOverlay(ooA);
}
}
其中最重要的是
BitmapDescriptorFactory.fromBitmap(getBitmapFromView(view))
而在百度地圖的API中悦析，
BitmapDescriptorFactory.fromBitmap(Bitmap bitmap)
傳入的是一個Bitmap的對象脐区，這樣我們就知道要怎么做了。我們就應該把我們的剛才新建的marker.xml 頁面轉換成一個Bitmap對象她按。
新建getBitmapFromView()函數，
將一個view的對象轉換成一個bitmap形的對象炕柔。
private Bitmap getBitmapFromView(View view) {
view.destroyDrawingCache();
view.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.UNSPECIFIED);
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
view.setDrawingCacheEnabled(true);
Bitmap bitmap = view.getDrawingCache();
return bitmap;
}
這樣我們就實現了自定義的marker.其中關鍵的代碼就是
getBitmapFromView() 這個方法酌泰，其他的都是百度API可以解決的。
