共享元素过渡中动画到单击的项目

时间:2018-06-28 21:02:12

标签: android android-animation shared-element-transition

我已经成功实现了共享元素过渡,但是我希望对Recyclerview的单击项视图具有动画效果。

Here is the link for the desired animation。当用户单击调用活动上的项目时,应先将其缩小,然后再导航至被调用活动。

Here is the link of the current transition。还有一个问题。当我单击第一项时,第二项闪烁。

ListActivity.java

     @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_list);

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            Fade fade = new Fade();
            fade.excludeTarget(R.id.appbar, true);
            fade.excludeTarget(android.R.id.navigationBarBackground, true);

            getWindow().setEnterTransition(fade);
            getWindow().setExitTransition(fade);
        } 
        adapter.setOnItemClickListener(new OnItemClickListener() {
            @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
            @Override
            public void onItemClick(final View view, final int position, final Post post, final View sharedImageView) {
                final Animation anim = AnimationUtils.loadAnimation(BlogsActivity.this, R.anim.shrink);
                view.startAnimation(anim);

                anim.setAnimationListener(new Animation.AnimationListener() {
                    @Override
                    public void onAnimationStart(Animation animation) {
                    }

                    @Override
                    public void onAnimationEnd(Animation animation) {
                        startSharedImageView(position, post, sharedImageView);
                    }

                    @Override
                    public void onAnimationRepeat(Animation animation) {
                    }
                });
            }
        });
}

 private void startSharedImageView(int position, Post post, View sharedImageView) {

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        Intent intent = new Intent(this, DetailActivity.class);
        intent.putExtra("post", Parcels.wrap(post));
        intent.putExtra("post_image_transiion_name", ViewCompat.getTransitionName(sharedImageView));

        ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(
                this,
                (View) sharedImageView,
                ViewCompat.getTransitionName(sharedImageView));

        startActivity(intent, options.toBundle());
    }
}

DetailActivity.java

public class DetailActivity extends AppCompatActivity {
AdjustableImageView ivDetailedImage;
ImageView fabClose;
WebView webview;
TextView tvTitle, tvAuthor;

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

    supportPostponeEnterTransition();

    Post post = Parcels.unwrap(getIntent().getParcelableExtra("post"));

    ivDetailedImage = findViewById(R.id.ivDetailedImage);
    webview = findViewById(R.id.webview);
    fabClose = findViewById(R.id.fabClose);
    tvTitle = findViewById(R.id.tvTitle);
    tvAuthor = findViewById(R.id.tvAuthor);

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        Fade fade = new Fade();
        fade.excludeTarget(android.R.id.navigationBarBackground, true);

        getWindow().setEnterTransition(fade);
        getWindow().setExitTransition(fade);
    }

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        String imageTransitionName = getIntent().getStringExtra("post_image_transiion_name");
        ivDetailedImage.setTransitionName(imageTransitionName);
    }

    Glide.with(this)
            .load(post.getPostMedia().get(0).getMediaUrl())
            .apply(new RequestOptions().diskCacheStrategy(DiskCacheStrategy.ALL))
            .listener(new RequestListener<Drawable>() {
                @Override
                public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {

                    supportStartPostponedEnterTransition();
                    return false;
                }

                @Override
                public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                    supportStartPostponedEnterTransition();
                    return false;
                }
            })
            .into(ivDetailedImage);
    tvTitle.setText(post.getPostTitle());
    if(post.getPostAuthor()!=null) {
        tvAuthor.setText("By "+post.getPostAuthor());
        tvAuthor.setVisibility(View.VISIBLE);
    }else {
        tvAuthor.setVisibility(View.GONE);
    }
    if (post.getPostContent() != null) {
        String formattedText = post.getPostContent();
        webview.loadData(formattedText, "text/html", null);

    }
    fabClose.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            supportFinishAfterTransition();
        }
    });
}

shrink.xml

<?xml version="1.0" encoding="utf-8"?>

<scale
    android:fromXScale = "1"
    android:toXScale = "0.94"
    android:fromYScale = "1"
    android:toYScale = "0.94"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration = "50">
</scale>

  

使用shirk.xml进行动画制作。但是在导航到调用的活动时会出现一些故障。我希望使用所需动画链接中所示的相同动画进行平滑过渡。

请帮助!

0 个答案:

没有答案