为什么使用 glide 库加载后我的图像会缩小

Question

您好，当它们第一次被调用到我的片段中时，我正在使用 glide 图像加载器库填充一个 gridview，它们看起来像这样 但是在上下滚动之后，它们会被调整大小，看起来像这样 这是我正在用我的 gridview、glide 库做的事情，还是像我的占位符图像一样？在第二个屏幕截图上，如果我按下图像，它会亮起以显示它实际上填充了整个空间，有人知道我在这里做错了什么吗？我已经尝试在使用 centercrop 等的滑行中更改调用，但似乎没有区别，我不确定如何计算每个单元格的宽度和高度，欢迎提出任何建议

编辑 这是我如何调用滑行

   Glide.with(getActivity())
                .load(mThumbIds[position])
                .placeholder(R.drawable.placeholder)
                .error(R.drawable.ic_drawer)
                .centerCrop()
                .override(500,300)
                .into(imageView);

Answer 1

实际上你必须为你的图像容器（ImageView）提供固定的宽度和高度。

<ImageView
    android:id="@+id/channelImage"
    android:layout_width="65dp"
    android:layout_height="65dp"
    android:layout_centerHorizontal="true"
    android:layout_margin="10dp"
    android:src="@drawable/sama" />

然后，当您调用 glide 时，您必须使用 override 方法动态覆盖您的宽度和高度。这是容器的最大宽度和高度。

Glide.with(getActivity())
                    .load("your url")

                    .placeholder(R.drawable.tv2v_icon)
                    .diskCacheStrategy(DiskCacheStrategy.ALL)
                    .fitCenter()
                    .override(500,500)
                    .into(channelImage);

希望对你有帮助。

Answer 2

使用 .dontAnimate() 方法解决问题。

Glide.with(context)
                .using(新的 FirebaseImageLoader())
                .load（路径参考）
                .dontAnimate()
                .placeholder（R.drawable.place_holder）
                .into(holder.logo);

Answer 3

以下帮助了我：

1) 在 Image View 中使用 adjustViewBounds = "true" -> 这将使图像视图在绘制/重绘/调整大小时根据其图像保持其纵横比

2) 为回收站视图的项目视图 xml 设置 layout_width = match_parent 和 layout_height = wrap_content，也为 Image View 设置。

原因：

假设 Recycler 视图设置有 Grid Layout Manager 垂直方向有 2 列 它将强制回收站视图的项目行的 xml 为屏幕宽度的一半。 由于 item 行的 match_parent 的值和它的 chid 的 (imageview) layout_height 属性，它会导致图像变成屏幕宽度的一半。 现在，由于 adjustViewBounds = true，图像视图会自行调整其高度以保持纵横比。

Answer 4

反正有 .fitCenter() 或 .centerCrop() 之类的方法。试试在

    Glide.with(getApplicationContext())
                            .load("")
                            .centerCrop()
                            .placeholder(R.drawable.ic_launcher)
                            .crossFade()
.override(1000,1000)
                            .into(myImageView); 
           .

Answer 5

对于一个几乎相同的问题我所要做的就是添加 .override(maxItemWidth, maxItemHeight)。这似乎可以防止 Glide 所做的任何导致图像缩小的操作。

注意：maxItemWidth / maxItemHeight 是我用于回收站视图项容器的值，但保存图像的 ImageView 实际上更小（因为边框和标签）。

    Glide
        .with(context)
        .load(categoryItem.getThumbnail())
        .asBitmap()
        .fitCenter()
        .override(itemWidth, itemHeight)
        .into(holder.imgIcon);

如果好奇，这是我的 xml：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:id="@id/item_container"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:layout_gravity="center_vertical"
             android:orientation="vertical"
             android:padding="4dp">


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/rounded_white_rectangle"
        android:padding="2dp"
        >

        <ImageView
            android:id="@+id/icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@android:color/white"
            android:scaleType="fitCenter"
            android:adjustViewBounds="true"
            />

    </FrameLayout>

</FrameLayout>

Answer 6

我找到了适用于 Glide V4 (4.8.0) 版本的解决方案

在gradle中导入'Glide'（目前最新版本为4.8.0）：

    implementation 'com.github.bumptech.glide:glide:4.8.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'

RecycleView 项中的 ImageView 应如下所示：

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/image"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:scaleType="fitCenter"
            android:src="@drawable/ic_launcher_background" />

    </RelativeLayout>

在你的适配器中：

        final Content content = getItem(position);
        ImageViewHolder viewHolder = (ImageViewHolder) holder;

        RequestOptions options = new RequestOptions();
        options.optionalFitCenter();

        Glide.with(Application_News16.getAppContext())
                .load(content.getValue())
                .apply(options)
                .apply(new RequestOptions()
                        .placeholder(R.drawable.img_loading_s)
                        .error(R.drawable.img_error_s))
                .into(viewHolder.image);

Answer 7

覆盖矩形图像可能会导致图像在高度有时较大而宽度有时较大时无法正确显示。

这就是我所做的，以防万一有人想探索。修复了 Glide 在 RecyclerView 上下滚动时图片缩小的问题。

仅供参考：我使用的是 androidx 而不是支持库，但它也应该适用于 ImageView 和 AppCompatImageView 小部件。

这是来自 RecyclerView 的 Item Layout 的 sn-p：

<RelativeLayout...
       <androidx.appcompat.widget.AppCompatImageView
           android:id="@+id/attachment_image"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:layout_centerInParent="true"
           android:adjustViewBounds="true"
           android:background="@drawable/camera_image_preview_default"
           android:minWidth="400dp"
           android:scaleType="centerCrop" />

</RelativeLayout>

这是我的适配器 onBindViewHolder 覆盖中的代码：

@Override
public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
    ....
    ....
    attachmentImage.layout(0, 0, 0, 0);
    Glide.with(context)
        .load(Uri.fromFile(new File(AppGlobals.IMAGES_THUMBNAIL_STORE_PATH + packet.getImageFileName())))
        .placeholder(ResourcesCompat.getDrawable(context.getResources(), R.drawable.image_loading_placeholder, null))
        .centerCrop()
        .error(ResourcesCompat.getDrawable(context.getResources(), R.drawable.missing_thumbnail, null))
        .into(attachmentImage);
    ....
    ....
}

如果你注意到了，

1. 在 Glide 绑定之前，ImageView 已设置为布局 0,0,0,0。这将确保 Glide 将其解释为新的布局膨胀而不使用缓存策略。

2. minWidth 已设置为 400dp，而 layout_width 已设置为 match_parent，layout_height 已设置为 wrap_content。您可以将minWidth 操作到您选择的限制范围内。

3. 绑定将在运行时使用 centerCrop()，因此您在设计时在 xml 布局中设置什么 scaleType 并不重要。

仅供参考：此示例使用从本地设备的公共外部存储目录加载图像。使用其他实现从网络或 URL 加载

致谢：TWiStErRob 在 Glide Github 社区论坛中提到并推荐了将布局设置为全零。

@https://github.com/TWiStErRob

关于问题 #1591

https://github.com/bumptech/glide/issues/1591

附带说明，如果您在 xml 布局中使用绝对 layout_height 和 layout_width 设置 ImageView - 分别为 400dp 和 300dp，Glide 可以完美运行。只有当每张图片的尺寸不同时，才会发现问题。