溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

Android 百度地圖marker中圖片不顯示的解決方法(推薦)

發(fā)布時間:2020-09-21 03:07:35 來源:腳本之家 閱讀:396 作者:ganshenml 欄目:移動開發(fā)

目的:

根據(jù)提供的多個經(jīng)緯度,顯示所在地的marker樣式,如下:

Android 百度地圖marker中圖片不顯示的解決方法(推薦)

問題:

1.發(fā)現(xiàn)marker中在線加載的圖片無法顯示出來;

2.獲取多個對象后,卻只顯示出了一個marker;

以下為官網(wǎng)實現(xiàn)方法:

通過查閱百度官網(wǎng)的文檔,我們可以知道,地圖標注物的實現(xiàn)方法如下:

//定義Maker坐標點 
LatLng point = new LatLng(39.963175, 116.400244); 
//構(gòu)建Marker圖標 
BitmapDescriptor bitmap = BitmapDescriptorFactory 
  .fromResource(R.drawable.icon_marka); 
//構(gòu)建MarkerOption,用于在地圖上添加Marker 
OverlayOptions option = new MarkerOptions() 
  .position(point) 
  .icon(bitmap); 
//在地圖上添加Marker,并顯示 
mBaiduMap.addOverlay(option);

那么想通過更改marker的樣式,也就是option中的.icon(BitmapDescriptor)方法,只需要提供BitmapDescriptor對象即可,獲取BitmapDescriptor的方式有如下幾種:

Android 百度地圖marker中圖片不顯示的解決方法(推薦)

(查詢地址:http://wiki.lbsyun.baidu.com/cms/androidsdk/doc/v4_3_0/index.html)

因為是marker不是簡單的圖片展示,所以這里是需要自定義view給加載進來的,因此使用的是fromView()來加載自定義視圖,視圖內(nèi)容如下:

<?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就已經(jīng)生成了BitmapDescriptor,這個時候就出現(xiàn)了marker無法顯示圖片的問題(這就好比經(jīng)典招數(shù)“猴子偷桃”,桃都還沒有,怎么偷得出來呢)。所以解決的辦法是——>等到圖片加載完畢后再去生成BitmapDescriptor,從而設(shè)置MarkerOptions。

下面為我的解決方案:

以下是在fragment中加載以上的視圖文件:(具體業(yè)務(wù)情況看個人的頁面設(shè)計,所以使用的時候也不一定非得在這個方法里面初始化)

@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:地理用戶數(shù)據(jù)(包含頭像地址、經(jīng)緯度)
   */
  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() {//圖片加載完畢后的回調(diào)方法
          @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,設(shè)置marker傳遞的數(shù)據(jù)
   *
   * @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);//設(shè)置marker從地上生長出來的動畫
      Marker marker = (Marker) baiduMap.addOverlay(overlayOptions);
      Bundle bundle = new Bundle();
      bundle.putSerializable(ConstantValues.User.GEO_USER_ENTITY, geoUserEntityTemp);
      marker.setExtraInfo(bundle);//marker點擊事件監(jiān)聽時,可以獲取到此時設(shè)置的數(shù)據(jù)
      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接口來回調(diào)圖片加載完畢的結(jié)果,從而初始化BitmapDescriptor,進而設(shè)置MarkerOptions。

要點:

GlideCircleTransform是自定義的類,用來設(shè)置圖片為圓形(之后有實現(xiàn)方法);

onResourceReady是Glide框架中監(jiān)聽圖片加載完畢的回調(diào)方法,以上的實現(xiàn)能監(jiān)聽多張圖片加載完畢的事件;

resultListener.onReturnResult(markerView);中的markerView是一開始自定義的marker中要加載的整個布局;

為啥不用SimpleDraweeView來實現(xiàn)圓形圖片并進行圖片下載的監(jiān)聽?

僅個人的使用情況:使用Glide框架無法控制SimpleDraweeView的形狀;而且,SimpleDraweeView無法監(jiān)聽動態(tài)加載同一個view時的多張圖片下載的情況,意味著只能監(jiān)聽到最后最后一張圖片。(也就是,類似于上面的onReturnResult方法只會回調(diào)一次,這也就是本文開頭提到過的問題②:獲取多個對象后,卻只顯示出了一個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();
  }
}

在對未知進行探索時,一點是興奮的,兩點是開心的,三點是積極的,太多太多的點則是痛苦的,而解決了迷惑之后內(nèi)心是舒坦的!

以上這篇Android 百度地圖marker中圖片不顯示的解決方法(推薦)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持億速云。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI