翻看了一些網(wǎng)上的文章,踩了很多坑.在這紀(jì)念下我逝去的時(shí)間吧.希望對(duì)各位有所幫助.

1. 設(shè)置 GapStrategy 為 GAP_HANDLING_NONE:這樣可以防止圖片在上下滑動(dòng)的時(shí)候移動(dòng).

   layoutManager = new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL);
   layoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
   recyclerView.setLayoutManager(layoutManager);
   

2. 提前 設(shè)置 imageView 大小

   分兩種情況:

   1. 已知圖片的大小,在請(qǐng)求圖片之前要先設(shè)置 ImageView 的大小.

   @Override
   public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
       final ImageEntity.ListBean listBean = listBeans.get(position);
       Resources resources = mContext.getResources();
       DisplayMetrics dm = resources.getDisplayMetrics();
       int width = dm.widthPixels/3;
       int height = (int) (width*(Float.parseFloat(listBean.getHeight())/Float.parseFloat(listBean.getWidth())));
       RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) holder.imageView.getLayoutParams();
       layoutParams.height = height;
       holder.imageView.setLayoutParams(layoutParams);
       Glide.with(mContext).load(listBeans.get(position).getImg()).into(holder.imageView);
       holder.imageView.setOnClickListener(new View.OnClickListener() {
           @Override
           public void onClick(View v) {
               Intent intent = new Intent(mContext, ImageActivity.class);
               intent.putExtra("imageSrc",listBean.getImg());
               mContext.startActivity(intent);
           }
       });
   }
   

   2. 不知道圖片大小.這種情況就需要在 onBindViewHolder 之前設(shè)置圖片的大小.因?yàn)槿绻?onBindViewHolder 中使用 Glide 異步的獲取圖片的大小會(huì)導(dǎo)致圖片因?yàn)闆]有及時(shí)獲取高度而出現(xiàn)空白.可以在 setList 處添加,比如這樣:

      public void setGirlBeans(List<GirlBean> girlBeans) {
          this.girlBeans = girlBeans;
          setImageScale();
      }
      
      private void setImageScale() {
          for (final GirlBean girlBean : girlBeans) {
              if(girlBean.getScale() == 0){
                  Glide.with(mContext).load(girlBean.getUrl()).into(new SimpleTarget<Drawable>() {
                      @Override
                      public void onResourceReady(@NonNull Drawable resource, @Nullable Transition<? super Drawable> transition) {
                          float scale = resource.getIntrinsicWidth() / (float) resource.getIntrinsicHeight();
                          girlBean.setScale(scale);
                          notifyDataSetChanged();
                      }
                  });
              }else {
                  notifyDataSetChanged();
              }
          }
      }
      

      在 onBindviewHolder 中:

      @Override
      public void onBindViewHolder(@NonNull final ViewHolder holder, int position) {
          GirlBean girlBean = girlBeans.get(position);
          final ViewGroup.LayoutParams layoutParams = holder.imageView.getLayoutParams();
          layoutParams.width = DisplayUtils.getScreenWidth((Activity) mContext) / 2 - DisplayUtils.dp2px(mContext,8);
          if(girlBean.getScale()!=0){
              layoutParams.height = (int) (layoutParams.width/ girlBean.getScale());
          }
          holder.imageView.setBackgroundColor(Color.BLUE);
          GlideApp.with(mContext)
                  .load(girlBeans.get(position).getUrl())
                  .transition(new DrawableTransitionOptions().crossFade())
                  .into(holder.imageView);
      }
      

      這樣就可以如你所愿的顯示圖片了.

      
      
      ImageTestDemo

javagankio

源碼地址:

1. 已知圖片大小: https://github.com/heinika/ImageTestDemo

2. 未知圖片大小: https://github.com/heinika/JavaGankIO