如何在Glide加載圖像時使RecyclerView上的ImageView具有尺寸設置？

Question

我在我的RecyclerView裏面有一些關於ImageView的問題。我正在創建漫畫查看器，並加載非常長的圖像。我把我的圖片切成8部分，所以我的ImageView可以處理它們。問題是在RecyclerView上加載圖像時。

我使用的是Glide，當Glide正在加載分段部件時，會有相當明顯的延遲。由於圖像緩存，這是可取的，並且它工作得很好，但是它留下了不希望的效果。我不能表現出實際的圖像，因爲它正在發生非常快，但我可以用ASCII代表它：

例如，這裏是我RecyclerView在啓動時：

---------------Segment1 
#......................... 
#......................... 
#......................... 
#......................... 
#......................... 
#......................... 
---------------Segment2 
---------------Segment3 
---------------Segment4 
#......................... 
#......................... 
#......................... 
#......................... 
#......................... 
#......................... 

正如你可以在這裏看到，滑翔是尚未完成加載Segment2和Segment3並生效，將Segment1和Segment4拼接在一起。所有突然出現的Segment2和Segment3都不存在，這不太好。

即使我把它放在ScrollView上，並動態地將ImageView添加進去，效果也是一樣的。我無法在ImageView上分配寬度和高度上的常量px/dip，原因很明顯，因爲我需要處理多個屏幕大小。

我ImageView設置是這樣的：

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <ImageView 
     android:id="@+id/imageview_comic" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:scaleType="fitXY" 
     android:adjustViewBounds="true"/> 

</LinearLayout> 

下面是我在做什麼，當我綁定到這個ImageView：

private void bindSegment(ComicViewHolder holder, int position) 
{ 
    File file = mSegments.get(position); 
    Point imageSize = Constants.getImageSize(file); 
    Point screenSize = Constants.getScreenSize(mContext); 

    ImageView imageView = holder.mImageViewComic; 

    Glide.with(imageView.getContext()) 
     .load(file.getAbsolutePath()) 
     .override(imageSize.x , imageSize.y) 
     .crossFade(0) 
     .into(imageView); 
} 

如果我分配基於ImageView恆定像素寬度/高度通過getLayoutParams()，我可以讓它在一部手機上工作，而不是另一部手機上。我不能這樣硬編碼ImageView大小。 Glide.override似乎沒有按照我的預期工作。我需要我的ImageView根據所加載圖像的大小了解其當前尺寸，以便填充已加載段之間的間隙，而不是彈出存在。

有什麼想法？

Answer 1

Glide庫對此問題沒有提供支持。我曾嘗試過很多次。然而，最後我自己得出了一個解決方案。要加載圖片，您必須發送圖片的URL和更多元數據。

解決的辦法是，用這種元數據需要發送這是會在您的ImageView要加載的圖像的尺寸（高度和寬度）。

在圖像加載到imageview之前，您將獲得這些尺寸。現在，您需要使用這些尺寸縮放圖像視圖的高度和寬度，併爲此應用佔位符。

最後，當您的圖片將被加載時，它將代替佔位符。

我假設你要設置你的ImageView的寬度=屏幕的寬度

DisplayMetrics metrics; 
    int width = 0, height = 0; 

metrics = new DisplayMetrics(); 

高度= metrics.heightPixels; width =度量。像素寬度;

現在，

int heightOfImage = 0; 
int widthOfImage = 0; 

float scalingRatio = ((Float.parseFloat(heightOfImage)/Float.parseFloat(widthOfImage)); 

viewHolder.imageLoadingLayout.getLayoutParams().height = Math.round(scalingRatio*width); //imageLoadingLayout is your placeholder 

最後，

Glide.with(activity) 
      .load(imageURL) 
      .diskCacheStrategy(DiskCacheStrategy.NONE) 
      .skipMemoryCache(true) 
      .listener(new RequestListener<String, GlideDrawable>() { 
       @Override 
       public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) { 
        return false; 
       } 
       @Override 
       public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) { 
        viewHolder.imageLoadingLayout.setVisibility(View.GONE); 


        return false; 
       } 
      }) 
      .crossFade() 
      .override(1700, 1700) 
      .diskCacheStrategy(DiskCacheStrategy.ALL) 
      .into(imageView); 

} 

圖片佈局

<ImageView 
    android:id="@+id/imageView" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:adjustViewBounds="true" 
    android:scaleType="fitCenter" 
/> 

Answer 2

newPostHolder.height = DeviceHight; 
int heightOfImage = data.getInt("image_height"); 
        if (heightOfImage > ((newPostHolder.height/100) * 80) || heightOfImage == newPostHolder.height) { 
         heightOfImage = ((newPostHolder.height/100) * 69); 
        } 

        newPostHolder.one_imageview.getLayoutParams().height = heightOfImage;