共享元素过渡和壁画无法正常工作

时间:2016-01-27 14:25:04

标签: android android-animation android-transitions fresco

我有两个活动,两个活动都包含一个图像。我正在使用Fresco将图像加载到一个活动中,而使用Picasso将图像加载到另一个活动中。以下是我的代码的相关部分:

第一项活动中的图片

<com.facebook.drawee.view.SimpleDraweeView
                android:id="@+id/imageView102"
                android:transitionName="image"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginLeft="9dp"
                android:layout_marginRight="9dp"
                android:layout_marginTop="10dp"
                fresco:actualImageScaleType="centerCrop"
                fresco:placeholderImage="@color/wait_color"
                fresco:placeholderImageScaleType="fitCenter"
                fresco:viewAspectRatio="1.33"
                android:layout_marginBottom="10dp" />

第二项活动中的图片

<uk.co.senab.photoview.PhotoView
        android:id="@+id/zoomable"
        android:transitionName="image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true" />

我在第二个活动中使用PhotoView来放大和缩小图像。

第一项活动

Uri uri = Uri.parse(photoUrl);
        ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
                .setProgressiveRenderingEnabled(true)
                .build();
        DraweeController controller = Fresco.newDraweeControllerBuilder()
                .setImageRequest(request)
                .setOldController(image.getController())
                .build();
        image.setController(controller);
image.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent intent = new Intent(ImageActivity.this, AlternateFullImageActivity.class);
                intent.putExtra("ID", photoId);
                intent.putExtra("photoUrl", photoUrl);
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    ActivityOptionsCompat options = ActivityOptionsCompat.
                            makeSceneTransitionAnimation(ImageActivity.this, (View)image, "image");
                    startActivity(intent, options.toBundle());
                }
                else {
                    startActivity(intent);
                }
            }
        });

第二项活动

Intent intent = getIntent();
        photoId = intent.getExtras().getString("ID");
        photoUrl = intent.getExtras().getString("photoUrl");

        Picasso.with(AlternateFullImageActivity.this)
                .load(photoUrl)
                .into(image);
        mAttacher = new PhotoViewAttacher(image);

问题是,转换不顺畅且非常快。我读了here我需要将转换更改为ChangeBounds。如何将转换更改为该转换以及如何为此转换添加持续时间,例如1000毫秒?

3 个答案:

答案 0 :(得分:6)

在新版本的Fresco中,有一个自定义过渡可以轻松完成。

在他们自己的存储库中查看此示例:

https://github.com/facebook/fresco/tree/master/samples/transition

基本上,您必须在开始活动中调用setSharedElementEnterTransition()并进行相应的转换:

getWindow().setSharedElementEnterTransition(DraweeTransition.createTransitionSet(ScalingUtils.ScaleType.CENTER_CROP,ScalingUtils.ScaleType.FIT_CENTER));
getWindow().setSharedElementReturnTransition(DraweeTransition.createTransitionSet(ScalingUtils.ScaleType.FIT_CENTER,ScalingUtils.ScaleType.CENTER_CROP));

答案 1 :(得分:4)

您可以创建一个扩展TransitionSet的类来指定转换,例如ChangeBounds。例如......

SET ID_STATE = IF(ID_STATE = 7, 8, 9)
WHERE ID_STATE IN (2,3,7,8)

然后将共享元素转换设置到片段或活动/窗口。对于像这样的片段

@TargetApi(Build.VERSION_CODES.LOLLIPOP)
public class DetailTransition extends TransitionSet {
    public DetailsTransition(int duration, int delay) {
        setOrdering(ORDERING_TOGETHER);
        addTransition(new ChangeBounds()).
                addTransition(new ChangeTransform()).
                addTransition(new ChangeImageTransform()).setDuration(duration).setStartDelay(delay).setInterpolator(new AnticipateOvershootInterpolator());
    }
}

或类似的活动

currentFragment.setSharedElementEnterTransition(new DetailsTransition(1000, 400));

答案 2 :(得分:0)

  

最后,我按照以下3个步骤找到了解决方法。

1。在您的项目中添加以下类:

import com.facebook.drawee.generic.GenericDraweeHierarchy;
import com.facebook.drawee.view.SimpleDraweeView;

import android.content.Context;
import android.graphics.Matrix;
import android.util.AttributeSet;

public class TranslateDraweeView extends SimpleDraweeView {
    public TranslateDraweeView(Context context) {
        super(context);
    }

    public TranslateDraweeView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public TranslateDraweeView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public TranslateDraweeView(Context context, GenericDraweeHierarchy hierarchy) {
        super(context, hierarchy);
    }

    public void animateTransform(Matrix matrix) {
        invalidate();
    }
}

2。将XML布局文件中的SimpleDraweeView替换为TranslateDraweeView

3。在您的通话活动中添加代码:

Intent i = new Intent(FirstActivity.this, SecActivity.class);

    String transitionName = "Detail Transition";

    ActivityOptions transitionActivityOptions;
    if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {

//******* THIS IS MORE IMPORTANT *******************
        setExitSharedElementCallback(new SharedElementCallback() {

            @Override
            public void onSharedElementEnd(List<String> sharedElementNames,
                                           List<View> sharedElements,
                                           List<View> sharedElementSnapshots) {

                super.onSharedElementEnd(sharedElementNames, sharedElements,
                        sharedElementSnapshots);

                for (View view : sharedElements) {
                    if (view instanceof SimpleDraweeView) {
                        view.setVisibility(View.VISIBLE);
                    }
                }
            }
        });

//***********************************************

        transitionActivityOptions = ActivityOptions.makeSceneTransitionAnimation(this,
                image, transitionName);
        startActivity(i, transitionActivityOptions.toBundle());
    }

快乐编码...!