Activity过渡动画(overridePendingtransition()的使用)

xiaoxiao2021-02-27  210

之前Android中两个Activity之间的跳转主要通过overridePendingtransition(int inId , int outId)来实现 , 但是效果比较生硬 , 视觉效果不理想 . 从Android 5.X开始 , Google丰富了Activity的转场动画效果 . Android 5.X提供了三种Transition类型:

进入 : 一个进入的过渡动画决定Activity中的所有的视图怎么进入屏幕;退出 : 一个退出的过渡动画决定一个Activity中的所有视图怎么退出屏幕;

共享元素 : 一个共享元素过渡动画决定两个Activities之间的过渡 , 怎么共享他们的视图.

其中 , 进入和退出效果包括: ▷explode(分解)—-从屏幕中间进或出 , 移动视图 ▷slide(滑动)—-从屏幕边缘进或出 , 移动视图 ▷fade(淡出)—-通过改变屏幕上视图的不透明度达到添加或者移除视图

共享元素包括: ☆changeBounds—-改变目标视图的布局边界 ☆changeClipBounds—-裁剪目标视图边界 ☆changeTransform—-改变目标视图的缩放比例和旋转角度 ☆changeImageTransform—-改变目标图片的大小和缩放比例

现在开始实验 , 先从最普通的三种过渡动画开始 , 这些动画使用非常简单 , 例如从ActivityA跳转到ActivityB , 只需要在ActivityA中将基本的startActivity(intent)方法改为如下代码即可.

startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());

而在ActivityB中 , 只需要设置下如下所示代码:

getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);

或者在样式文件中设置如下所示代码:

<item name="android:windowContentTransitions">true</item>

那么接下来就可以设置进入ActivityB的具体的动画效果了 , 代码如下所示:

getWindow().setEnterTransition(new Explode()); getWindow().setEnterTransition(new Slide()); getWindow().setEnterTransition(new Fade());

或者通过如下代码来设置离开ActivityB的动画效果:

getWindow().setExitTransition(new Explode()); getWindow().setExitTransition(new Slide()); getWindow().setExitTransition(new Fade());

要想在程序中使用共享元素的动画效果也非常简单 , 首先需要在Activity1的布局文件中设置共享的元素 , 给它增加相应的属性 , 代码如下所示.

android:transitionName="XXX"

同时在Activity2的布局文件中 , 给要实现共享效果的元素也增加相同的属性 , 代码如下所示 .

android:transitionName="XXX"

这里需要注意的是一定要保证命名相同 , 这样系统才能找到共享元素 . 如果只要一个共享元素 , 那么Acitivity1中只需要使用如下代码 .

startActivity(intent, ActivityOptions.makeSceneTransitionAnimation( this, view, "share").toBundle());

如果有多个共享的元素 , 那么可以通过Pair.create()来传建多个共享元素 , 代码如下所示 .

startActivity(intent, ActivityOptions.makeSceneTransitionAnimation( this, //创建多个共享元素 Pair.create(view, "share"), Pair.create(fab, "fab")).toBundle());

下面通过一个实例来演示Activity的过渡动画 , Activity1代码如下所示:

package com.lyx.penddingtransition; import android.app.ActivityOptions; import android.content.Intent; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.util.Pair; import android.view.View; public class MainActivity extends AppCompatActivity{ private Intent intent; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } //设置不同的动画效果 public void explode(View view) { intent = new Intent(this, SecondActivity.class); intent.putExtra("flag", 0); startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle()); } //设置不同的动画效果 public void slide(View view) { intent = new Intent(this, SecondActivity.class); intent.putExtra("flag", 1); startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle()); } //设置不同的动画效果 public void fade(View view) { intent = new Intent(this, SecondActivity.class); intent.putExtra("flag", 2); startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle()); } //设置不同的动画效果 public void share(View view) { View fab = findViewById(R.id.fab_button); intent = new Intent(this, SecondActivity.class); intent.putExtra("flag", 3); //创建单个共享元素 // startActivity(intent, // ActivityOptions.makeSceneTransitionAnimation( // this, view, "share").toBundle()); startActivity(intent, ActivityOptions.makeSceneTransitionAnimation( this, //创建多个共享元素 Pair.create(view, "share"), Pair.create(fab, "fab")).toBundle()); } }

Activity1对应的XML代码如下所示:

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:layout_width="match_parent" android:layout_height="100dp" android:onClick="explode" android:text="explode"/> <Button android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginTop="10dp" android:onClick="slide" android:text="slide"/> <Button android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginTop="10dp" android:onClick="fade" android:text="fade"/> <Button android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginTop="10dp" android:onClick="share" android:text="share" android:transitionName="share"/> <Button android:id="@+id/fab_button" android:layout_width="56dp" android:layout_height="56dp" android:layout_marginTop="10dp" android:background="@drawable/ripple_round" android:elevation="5dp" android:transitionName="fab"/> </LinearLayout>

Activity2代码如下所示:

package com.lyx.penddingtransition; import android.os.Build; import android.os.Bundle; import android.support.annotation.RequiresApi; import android.support.v7.app.AppCompatActivity; import android.transition.Explode; import android.transition.Fade; import android.transition.Slide; import android.view.Window; public class SecondActivity extends AppCompatActivity { @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP) @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS); int flag = getIntent().getExtras().getInt("flag"); //设置不同的动画效果 switch (flag) { case 0: getWindow().setEnterTransition(new Explode()); break; case 1: getWindow().setEnterTransition(new Slide()); break; case 2: getWindow().setEnterTransition(new Fade()); getWindow().setExitTransition(new Fade()); break; case 3: break; } setContentView(R.layout.activity_second); } }

其对应的XML如下所示:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_second" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.lyx.penddingtransition.SecondActivity"> <View android:id="@+id/holder_view" android:layout_width="match_parent" android:layout_height="300dp" android:background="#fadfda" android:transitionName="share"/> <Button android:id="@+id/fab_button" android:layout_width="56dp" android:layout_height="56dp" android:layout_alignParentEnd="true" android:layout_below="@+id/holder_view" android:layout_marginRight="20dp" android:layout_marginTop="-26dp" android:background="@drawable/ripple_round" android:elevation="5dp" android:transitionName="fab"/> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/holder_view" android:paddingTop="100dp"> <Button android:id="@+id/button" android:layout_width="match_parent" android:layout_height="60dp" android:layout_below="@+id/button4" android:layout_marginTop="10dp"/> <Button android:id="@+id/button4" android:layout_width="match_parent" android:layout_height="60dp" android:layout_alignParentStart="true" android:layout_marginTop="10dp"/> </RelativeLayout> </RelativeLayout>

效果如下图所示:

转载请注明原文地址: https://www.6miu.com/read-12340.html

最新回复(0)