您好,登錄后才能下訂單哦!
目的:
根據提供的多個經緯度,顯示所在地的marker樣式,如下:
問題:
1.發現marker中在線加載的圖片無法顯示出來;
2.獲取多個對象后,卻只顯示出了一個marker;
以下為官網實現方法:
通過查閱百度官網的文檔,我們可以知道,地圖標注物的實現方法如下:
//定義Maker坐標點 LatLng point = new LatLng(39.963175, 116.400244); //構建Marker圖標 BitmapDescriptor bitmap = BitmapDescriptorFactory .fromResource(R.drawable.icon_marka); //構建MarkerOption,用于在地圖上添加Marker OverlayOptions option = new MarkerOptions() .position(point) .icon(bitmap); //在地圖上添加Marker,并顯示 mBaiduMap.addOverlay(option);
那么想通過更改marker的樣式,也就是option中的.icon(BitmapDescriptor)方法,只需要提供BitmapDescriptor對象即可,獲取BitmapDescriptor的方式有如下幾種:
(查詢地址:http://wiki.lbsyun.baidu.com/cms/androidsdk/doc/v4_3_0/index.html)
因為是marker不是簡單的圖片展示,所以這里是需要自定義view給加載進來的,因此使用的是fromView()來加載自定義視圖,視圖內容如下:
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="30dp" android:id="@+id/bitmapFl" android:layout_height="44dp"> <ImageView android:layout_width="30dp" android:layout_height="44dp" android:layout_gravity="center" android:src="@mipmap/anchor"/> <ImageView android:id="@+id/picSdv" android:layout_marginTop="1dp" android:layout_width="28dp" android:layout_height="28dp" android:layout_gravity="center_horizontal" /> </FrameLayout>
但是如果此時使用fromView來加載視圖生成BitmapDescriptor就會導致:在圖片未在線加載完畢時,整個view就已經生成了BitmapDescriptor,這個時候就出現了marker無法顯示圖片的問題(這就好比經典招數“猴子偷桃”,桃都還沒有,怎么偷得出來呢)。所以解決的辦法是——>等到圖片加載完畢后再去生成BitmapDescriptor,從而設置MarkerOptions。
下面為我的解決方案:
以下是在fragment中加載以上的視圖文件:(具體業務情況看個人的頁面設計,所以使用的時候也不一定非得在這個方法里面初始化)
@Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { this.inflater = inflater; this.container = container; if (markerView == null) { viewHolder = new ViewHolder(); markerView = (FrameLayout) inflater.inflate(R.layout.layout_bitmap_descriptor, container, true).findViewById(R.id.bitmapFl);//此處一定要find到bitmapFl,否則此處會報錯加載的對象不是要求的布局對象 viewHolder.imageView = (ImageView) markerView.findViewById(R.id.picSdv); markerView.setTag(viewHolder); } return inflater.inflate(R.layout.fragment_main, container, false); } ivate class ViewHolder { ImageView imageView; }
因為涉及到多個marker的加載,意味著要對布局進行多次加載,所以此處使用ViewHolder來處理重復的操作。
然后進行初始化各個marker:
/** * 初始化位置標注信息 * * @param geoUserEntities:地理用戶數據(包含頭像地址、經緯度) */ private void initOverlayOptions(List<GeoUserEntity> geoUserEntities) { baiduMap.clear(); AvatarEntity avatarEntityTemp; for (int i = 0; i < geoUserEntities.size(); i++) { if (geoUserEntities.get(i) == null) { continue; } final Marker[] marker = {null}; final GeoUserEntity geoUserEntityTemp = geoUserEntities.get(i); avatarEntityTemp = geoUserEntityTemp.getAvatar(); final BitmapDescriptor[] pic = {null}; if (avatarEntityTemp != null && !StringUtils.isEmpty(avatarEntityTemp.getImageUrl())) { returnPicView(avatarEntityTemp.getMid(), new ResultListener() {//圖片加載完畢后的回調方法 @Override public void onReturnResult(Object object) { super.onReturnResult(object); pic[0] = BitmapDescriptorFactory.fromView((View) object); putDataToMarkerOptions(pic[0], geoUserEntityTemp); } }); } else if (avatarEntityTemp == null) { pic[0] = BitmapDescriptorFactory.fromResource(R.mipmap.anchor); putDataToMarkerOptions(pic[0], geoUserEntityTemp); } } } /** * 顯示marker,設置marker傳遞的數據 * * @param pic * @param geoUserEntityTemp */ private void putDataToMarkerOptions(BitmapDescriptor pic, GeoUserEntity geoUserEntityTemp) { double[] locationTemp = geoUserEntityTemp.getLocation(); if (locationTemp != null && locationTemp.length == 2) { LatLng point = new LatLng(locationTemp[1], locationTemp[0]); MarkerOptions overlayOptions = new MarkerOptions() .position(point) .icon(pic) .animateType(MarkerOptions.MarkerAnimateType.grow);//設置marker從地上生長出來的動畫 Marker marker = (Marker) baiduMap.addOverlay(overlayOptions); Bundle bundle = new Bundle(); bundle.putSerializable(ConstantValues.User.GEO_USER_ENTITY, geoUserEntityTemp); marker.setExtraInfo(bundle);//marker點擊事件監聽時,可以獲取到此時設置的數據 marker.setToTop(); } } private void returnPicView(String urlTemp, final ResultListener resultListener) { viewHolder = (ViewHolder) markerView.getTag(); Glide.with(getContext()) .load(urlTemp) .asBitmap() .transform(new GlideCircleTransform(getContext())) .into(new SimpleTarget<Bitmap>() { @Override public void onResourceReady(Bitmap bitmap, GlideAnimation glideAnimation) { viewHolder.imageView.setImageBitmap(bitmap); resultListener.onReturnResult(markerView); } } ); }
通過returnPicView方法來進行異步圖片加載,然后用自定義的ResultListener接口來回調圖片加載完畢的結果,從而初始化BitmapDescriptor,進而設置MarkerOptions。
要點:
GlideCircleTransform是自定義的類,用來設置圖片為圓形(之后有實現方法);
onResourceReady是Glide框架中監聽圖片加載完畢的回調方法,以上的實現能監聽多張圖片加載完畢的事件;
resultListener.onReturnResult(markerView);中的markerView是一開始自定義的marker中要加載的整個布局;
為啥不用SimpleDraweeView來實現圓形圖片并進行圖片下載的監聽?
僅個人的使用情況:使用Glide框架無法控制SimpleDraweeView的形狀;而且,SimpleDraweeView無法監聽動態加載同一個view時的多張圖片下載的情況,意味著只能監聽到最后最后一張圖片。(也就是,類似于上面的onReturnResult方法只會回調一次,這也就是本文開頭提到過的問題②:獲取多個對象后,卻只顯示出了一個marker的情況)
然后,附上GlideCircleTransform的類代碼(從其它處拷貝過來的):
public class GlideCircleTransform extends BitmapTransformation { public Context context; public GlideCircleTransform(Context context) { super(context); this.context = context; } @Override protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) { return circleCrop(pool, toTransform); } private static Bitmap circleCrop(BitmapPool pool, Bitmap source) { if (source == null) return null; int size = Math.min(source.getWidth(), source.getHeight()); int x = (source.getWidth() - size) / 2; int y = (source.getHeight() - size) / 2; // TODO this could be acquired from the pool too Bitmap squared = Bitmap.createBitmap(source, x, y, size, size); Bitmap result = pool.get(size, size, Bitmap.Config.ARGB_8888); if (result == null) { result = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888); } Canvas canvas = new Canvas(result); Paint paint = new Paint(); paint.setShader(new BitmapShader(squared, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP)); paint.setAntiAlias(true); float r = size / 2f; canvas.drawCircle(r, r, r, paint); return result; } @Override public String getId() { return getClass().getName(); } }
在對未知進行探索時,一點是興奮的,兩點是開心的,三點是積極的,太多太多的點則是痛苦的,而解決了迷惑之后內心是舒坦的!
以上這篇Android 百度地圖marker中圖片不顯示的解決方法(推薦)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。