使用SharedElement活动转换与自定义视图

时间:2017-01-11 23:11:27

标签: android android-custom-view android-transitions shared-element-transition

我正在开发一个概念验证,我在TableLayout中有一些自定义视图。单击其中一个视图时,我想要为扩展为新活动的视图设置动画。我想要达到的效果类似于here所见。

从我的研究来看,似乎这样做的方法是使用shared element Transitions。但是,我无法让它正常工作,我想知道是否因为我使用自己的自定义视图。

具体来说,渐弱发生了,但缩放和翻译动作却没有发生。检查下面的GIF,看看我在哪里。在示例中,我单击左上角的圆圈,我想将其转换为新活动中的整个圆圈。按下后退按钮时也会出现此问题。

enter image description here

我认为这是不正确的,因为必须绘制视图,但有没有办法进一步自定义我的视图以使其工作?我发现的这种转换的所有示例都包含ImageViews,Buttons和TextViews。

以下是相关来源。我的自定义视图很大,不包含任何特殊代码,只是覆盖onDraw()和onMeasure()。

MainActivity.java

package com.rscottcarson.circleschedulertest;

import android.app.Activity;
import android.app.ActivityOptions;
import android.content.Intent;
import android.support.v4.app.ActivityOptionsCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.Toast;
public class MainActivity extends Activity {

    private View view1;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        view1 = findViewById(R.id.circle1);

        view1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                Intent intent = new Intent(MainActivity.this, DetailActivity.class);
                // create the transition animation - the images in the layouts
                // of both activities are defined with android:transitionName="profile"
                ActivityOptions options = ActivityOptions
                        .makeSceneTransitionAnimation(MainActivity.this, view1, "profile");
                // start the new activity
                startActivity(intent, options.toBundle());
            }
        });

    }
}

DetailActivity.java

package com.rscottcarson.circleschedulertest;

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;

public class DetailActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_detail);

    }
}

change_image_trans.xml

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
    <changeTransform />
</transitionSet>

styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="android:Theme.Material.Light.DarkActionBar">
        <item name="android:windowActivityTransitions">true</item>
        <item name="android:windowContentTransitions">true</item>

        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>


        <!-- specify shared element transitions -->
        <item name="android:windowSharedElementEnterTransition">
            @transition/change_image_trans</item>
        <!-- specify shared element transitions -->
        <item name="android:windowSharedElementExitTransition">
            @transition/change_image_trans</item>
    </style>

</resources>

2 个答案:

答案 0 :(得分:3)

尝试使用postponeEnterTransition()

中的startPostponedEnterTransition()DetailActivity

postponeEnterTransition()用于暂时延迟转换,直到共享元素得到正确测量和布局。

startPostponedEnterTransition()计划在共享元素被测量并在活动的视图层次结构中布局后立即启动共享元素转换。

DetailActivity.java

@Override
protected void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_detail);
    postponeEnterTransition();
}

private void scheduleStartPostponedTransition(final View sharedElement) {
    sharedElement.getViewTreeObserver().addOnPreDrawListener(
        new ViewTreeObserver.OnPreDrawListener() {
            @Override
            public boolean onPreDraw() {
                sharedElement.getViewTreeObserver().removeOnPreDrawListener(this);
                startPostponedEnterTransition();
                return true;
            }
        });
}

答案 1 :(得分:-1)

我不认为您的问题是您拥有自定义视图...我总是使用自定义视图制作这些转换,并且它们正常工作。

我可以看到这段代码:

ActivityOptions options = ActivityOptions
                        .makeSceneTransitionAnimation(MainActivity.this, view1, "profile");
                // start the new activity 
                startActivity(intent, options.toBundle());

不能做你想做的事。

以下是您需要做的事情:

首先,使用转换创建您的xml:

第一项活动

<YouCustomView
     android:id="@+id/someId"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:transitionName="@string/someTransition">

第二项活动:

<YouCustomView
         android:id="@+id/someOtherId"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:transitionName="@string/someTransition">

第二次,当您开始第二项活动时,请执行以下操作:

        ActivityOptions activityOptions = ActivityOptions.makeSceneTransitionAnimation(
    this, new Pair<>(findViewById(R.id.someId), getString(R.string.someTransition))

startActivity(intent, activityOptions.toBundle());

您忘了添加配对视图和转换名称。添加它,您的过渡将很好地工作。您的视图是自定义视图的事实不会更改动画。

快乐的编码!