Android Glide 库不适用于共享元素转换 [英] Android Glide library not working with shared element transitions

问题描述

我希望采用 Glide 库 代替 Universal Image Loader 但我在共享元素转换方面遇到了问题.

I'm looking to adopt the Glide library in place of Universal Image Loader but I'm running into a problem with regards to shared element transitions.

在我的简单沙箱中，我使用 UIL 创建了以下转换:https://dl.dropboxusercontent.com/u/97787025/device-2015-06-18-113333.mp4

In my simple Sandbox I've created the following transition using UIL: https://dl.dropboxusercontent.com/u/97787025/device-2015-06-18-113333.mp4

很简单，而且效果很好.但是当我使用 Glide 时，它​​看起来不太好:https://dl.dropboxusercontent.com/u/97787025/device-2015-06-18-114508.mp4

Pretty simple, and it works fine. But when I used Glide, it doesn't look so nice: https://dl.dropboxusercontent.com/u/97787025/device-2015-06-18-114508.mp4

这是我正在使用的代码

第一个活动:

public class MainActivity extends BaseActivity {

    @Override
    public void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        setContentView(R.layout.main);

        final ImageView iv = (ImageView) findViewById(R.id.main_image);

        displayImageGlide(BaseActivity.IMAGE_URL, iv, true);

        Button button = (Button) findViewById(R.id.main_button);
        button.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Intent intent = new Intent(getApplicationContext(), DifferentActivity.class);
                startActivity(intent, iv);
            }

        });
    }

}

第二个:

public class DifferentActivity extends BaseActivity {

    @Override
    public void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        setContentView(R.layout.different);

        ImageView imageView = (ImageView) findViewById(R.id.diff_image);

        displayImageGlide(BaseActivity.IMAGE_URL, imageView, false);
    }

}

BaseActivity 只包含 displayImageGlide

BaseActivity just contains displayImageGlide

public void displayImageGlide(String url, ImageView imageView) {
    Glide.with(this).load(url)
            .asBitmap().transform(new CustomTransformation(this))
            .skipMemoryCache(true)
            .diskCacheStrategy(DiskCacheStrategy.SOURCE)
            .into(imageView);
}

private static class CustomTransformation extends BitmapTransformation {

    public CustomTransformation(Context context) {
        super(context);
    }

    @Override
    protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
        return bitmapChanger(toTransform, outWidth, outHeight);
    }

    @Override
    public String getId() {
        return "some_id_1";
    }

}

private static Bitmap bitmapChanger(Bitmap bitmap, int desiredWidth, int desiredHeight) {
    float originalWidth = bitmap.getWidth();
    float originalHeight = bitmap.getHeight();

    float scaleX = desiredWidth / originalWidth;
    float scaleY = desiredHeight / originalHeight;

    //Use the larger of the two scales to maintain aspect ratio
    float scale = Math.max(scaleX, scaleY);

    Matrix matrix = new Matrix();

    matrix.setScale(scale, scale);

    //If the scaleY is greater, we need to center the image
    if(scaleX < scaleY) {
        float tx = (scale * originalWidth - desiredWidth) / 2f;
        matrix.postTranslate(-tx, 0f);
    }

    Bitmap result = Bitmap.createBitmap(desiredWidth, desiredHeight, bitmap.getConfig() != null ? bitmap.getConfig() : Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(result);
    canvas.drawBitmap(bitmap, matrix, new Paint());
    return result;
}

我尝试从 Glide 构建器中删除缓存行(用于防止它缓存我试图调整的内容)，但这没有帮助.很想采用 Glide，但如果这行不通，那就有点麻烦了.如果有人提供一些意见，我将不胜感激，谢谢！

I've tried removing the cache lines from the Glide builder (used to prevent it from caching what I'm trying to tweak) but that didn't help. Would love to adopt Glide, but it's kind of a deal breaker if this won't work. If anyone has some input I'd appreciate it, thanks!

推荐答案

我尝试了你的代码并得到了相同的结果，然后我尝试了另一个实现:https://github.com/codepath/android_guides/wiki/Shared-Element-Activity-Transition

I tried your code and got the same result, then I tried another implementation following this: https://github.com/codepath/android_guides/wiki/Shared-Element-Activity-Transition

并进行了一些更改，我认为这是这里的关键:

And made some changes, which I think are the key here:

应该在 ImageView 上设置 centerCrop，如果我们用 Glide 设置它会导致同样的错误.activity_main.xml

The centerCrop should be set on the ImageView, if we set it with Glide it causes the same bug. activity_main.xml

    <ImageView
      android:id="@+id/ImageView"
      android:layout_width="match_parent"
      android:layout_height="150dp"
      android:layout_centerInParent="true"
      android:transitionName="detail_image"
      android:scaleType="centerCrop"
    />

BaseActivity.java在 MainActivity dontTransform 应该为 true，在 DifferentActivity 上为 false.

BaseActivity.java On the MainActivity dontTransform should be true and on DifferentActivity false.

    public void displayImageGlide(String url, ImageView imageView, Boolean dontTransform) {
    if (dontTransform) {
        Glide.with(this).load(url)
                .skipMemoryCache(true)
                .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                .dontTransform()
                .into(imageView);
        return;
    }

        Glide.with(this).load(url)
                .skipMemoryCache(true)
                .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                .into(imageView);
   }

编辑，看看它的样子: https://www.dropbox.com/s/30s5l8awxogltls/device-2015-06-23-153153.mp4?dl=0

这篇关于Android Glide 库不适用于共享元素转换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！