如何使用 Glide 将 Image 放入 ImageView答案

【问题标题】：How to fit Image into ImageView using Glide如何使用 Glide 将 Image 放入 ImageView
【发布时间】：2016-03-05 12:03:43
【问题描述】：

我关心的是如何使用 Glide 将使用 android:scaleType="fitXY" 的图像拟合到图像中。

我的ImageView 是

<ImageView
    android:id="@+id/img_pager"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:scaleType="fitXY" />

像这样使用 Glide 加载图像

Glide.with(context).load(url).placeholder(R.drawable.default_image).into(img);

但图像不适合ImageView 它在图像两侧显示空间，如屏幕所示我需要它fitXY

【问题讨论】：

标签： android image android-layout crop android-glide

【解决方案1】：

您可以使用centerCrop() 或fitCenter() 方法：

Glide.with(context)
     .load(url)
     .centerCrop()
     .placeholder(R.drawable.default_image)
     .into(img)

或

Glide.with(context)
     .load(url)
     .fitCenter()
     .placeholder(R.drawable.default_image)
     .into(img)

您还可以在以下位置找到更多信息：https://futurestud.io/tutorials/glide-image-resizing-scaling

【讨论】：

如何设置占位符的 scaletype ？
在 Android 上使用这个：Glide.with(getActivity()).load(imageSourceUrl) .apply(new RequestOptions().centerCrop())
好的，上面的答案显示使用 fitCenter 或 centerCrop 来拟合图像。但是 fitXY 呢？无论如何设置 fitXY 而不是任何其他参数？

【解决方案2】：

您可以使用.centerCrop()、.centerInside() 或.fitCenter()

另一种方法是使用自定义Transformation

【讨论】：

嗨@Empty2k12，您能详细说明自定义转换吗？我有一个自定义遮罩转换，但我无法居中拟合或正确裁剪图像以保持纵横比一致。

【解决方案3】：

在 Glide v4 上，您必须创建一个 RequestOptions 对象，如下所示：

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

Glide.with(fragment)
    .load(url)
    .apply(options)
    .into(imageView);

More info

【讨论】：

options.centerCrop() 的结果被忽略
也作为一个更简洁的选项：Glide.with(fragment).load(url).apply(RequestOptions.centerCropTransform()).into(imageView);

【解决方案4】：

<android.support.v7.widget.AppCompatImageView
    android:id="@+id/ivPhoto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:adjustViewBounds="true"
    android:scaleType="fitXY" />

.....................................

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

AppCompatImageView ivPhoto = findViewById(R.id.ivPhoto);

Glide.with(this)
            .load("https://www.gettyimages.ca/gi-resources/images/Homepage/Hero/UK/CMS_Creative_164657191_Kingfisher.jpg")
            .apply(new RequestOptions()
                    .placeholder(R.drawable.place_holder_gallery)
                    .error(R.drawable.ic_no_image)
            )
            .into(ivPhoto);

【讨论】：

这非常适合我的情况，谢谢。

【解决方案5】：

如果使用 Glide v4 GlideApp 的 Glide 实例：

GlideApp.with(view.getContext())
        .load(url)
        .centerCrop()
        .into(view);

如果使用数据绑定：

@BindingAdapter("glideCropCenter")
public static void setProgress(ImageView view, string url) {
    GlideApp.with(view.getContext())
            .load(url)
            .centerCrop()
            .into(view);
}

在xml中：

       <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:glideCropCenter="@{viewModel.url}" />

【讨论】：

【解决方案6】：

您可以调用 .override(horizontalSize, verticalSize)。这将在 ImageView 中显示之前调整图像大小。

Glide.with(context)
     .load(url)
     .override(horizontalSize, verticalSize)//resizes the image to these dimensions (in pixel).
     .into(img);

【讨论】：

【解决方案7】：

我的解决方案是忽略 FIT_XY 比例类型的 BitmapTransformation。
还将比例类型设置为相应的类型，如下所示，

        val options = RequestOptions()

        mDesignOptions?.bgScaleType?.let {
            mScaleType = it
        }

        if (mScaleType == Settings.SCALE_TYPE_CENTER_CROP) {
            imgView.scaleType = ImageView.ScaleType.CENTER_CROP
            options.transform(CenterCrop())
        } else if (mBgScaleType == Settings.SCALE_TYPE_ORIGINAL) {
            imgView.scaleType = ImageView.ScaleType.FIT_CENTER
            options.transform(FitCenter())
        } else {
            imgView.scaleType = ImageView.ScaleType.FIT_XY
        }


        Glide.with(applicationContext)
            .load(imgPath) // Uri of the Photo
            .apply(options)
            .into(imgView)

【讨论】：