Android篇-Activity共享元素跳转

10次阅读

共计 1954 个字符,预计需要花费 5 分钟才能阅读完成。

Android 篇 Activity 共享元素跳转

什么叫 Activity 共享元素跳转?我们来看看下面的效果,其实就是在这个转场动画中,整个子布局都是共享元素,当然也可以是图片和文字的任何控件,具体怎么实现这种效果呢?

查看效果图

以 MainActivity 跳转到 HomeDetailActivity 为例。

第一步 在需要跳转到 HomeDetailActivity 设置共享的元素设置 transtionName,可以在 xml 中设置android:transitionName

<RelativeLayout
    android:id="@+id/rl_container"
    android:background="@color/white"
    android:layout_width="match_parent"
    android:transitionName="CONTENT"
    android:layout_height="match_parent"/>

或者在 java 代码中用 ViewCompat.setTransitionName(@NonNull View view, String transitionName) 设置

ViewCompat.setTransitionName(mViewBinding.rlContainer, "CONTENT");

第二步 在开始跳转的 MainActivity 增加转场过渡

ActivityOptionsCompat activityOptions = ActivityOptionsCompat.makeSceneTransitionAnimation(this, new Pair<View, String>(v, "CONTENT"));
Intent intent = new Intent(this, HomeDetailActivity.class);
// ActivityCompat 是 android 支持库中用来适应不同 android 版本的
ActivityCompat.startActivity(this, intent, activityOptions.toBundle());

多个控件过渡可以在后面增加多个 Pair<View, String>(View v, String transtionName)
OK 结束啦。试一下可以实现完美的转场啦~~~
那怎么退出来的时候还保持转场回来呢?

第三步 结束转场的 HomeDetailActivity,在按物理返回键,以及返回按钮的地方加上

if (Build.VERSION.SDK_INT >= 21) {finishAfterTransition();
} else {finish();
}

当 HomeDetailActivity 结束转场的过程中,你会发现 出现背景黑屏 的问题,解决办法:在 styles.xml 配置一个透明背景的样式并配置给 HomeDetailActivity。

<style name="DetailActivityStyle" parent="AppTheme">
    <item name="android:windowBackground">@color/tran_white</item>
    <item name="android:windowIsTranslucent">true</item>
</style>

colos.xml 加上<color name="tran_white">#00FFFFFF</color>
AndroidManifest.xml 给注册的 HomeDetailActivity 配置透明背景样式

<activity
    android:name=".HomeDetailActivity"
    android:theme="@style/DetailActivityStyle" />

这种处理方法 在 7.0 及以下的设备还是会出现黑屏情况 。。(QAQ 不知道是不是三星 Galaxy 太强硬嗯。。)
小编采用的终极解决办法是在 HomeDetailActivity 结束时,给 window 设置一个透明背景图片,即 java 代码关闭时更改为

if (Build.VERSION.SDK_INT >= 21) {
   # 给 window 设置透明背景图片
    ColorDrawable colorDrawable = new ColorDrawable();
    colorDrawable.setColor(getResources().getColor(R.color.white));
    colorDrawable.setAlpha(0);
    getWindow().setBackgroundDrawable(colorDrawable);

    finishAfterTransition();} else {finish();
}

原文链接

???? 更多好文欢迎关注我的公众号~

正文完
 0