1. 为每个Scene定义1个布局文件,并准备好包含这些布局的parent ViewGroup
例如,res/layout/activity_transition_manager.xml 为 Activity 的content view,其中,id为sceneRoot的ViewGroup 用来包含多个Scene的布局
http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
...
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/sceneRoot”> // 这货就是各个 Scene 对应的布局 的parent ViewGroup
// include一个Scene的布局文件。
// 可以去掉这行,然后在onCreate()中使用 mScene1.enter()
为parent ViewGroup 设置初始的布局,有两种方法:
第1种是像上面一样,include 一个Scene对应的布局
第2种是在 onCreate() 中,使用 mScene1.enter(),将mScene1对应的布局添加到parent ViewGroup中
差异是,对前者,parent ViewGroup 没有 current Scene,对后者,parent ViewGroup 有current Scene 是mScene1,
current Scene 是 parent ViewGroup 中当前正在使用的Scene,即正在显示这个Scene对应的布局
使用 Scene.getCurrentScene(View) 和 Scene.setCurrentScene(View, Scene) 方法获取和设置 current Scene
3个Scene,对应3个布局文件,分别是
res/layout/activity_transition_manager_scene1.xml
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/container">
android:layout_width="100dip"
android:layout_height="50dip"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:background="#f00"
android:id="@+id/view1”/> // 在3个布局中的id相同
android:layout_width="100dip"
android:layout_height="50dip"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:background="#0f0"
android:id="@+id/view2”/>// 在3个布局中的id相同
res/layout/activity_transition_manager_scene2.xml
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/container">
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:background="#f00"
android:id="@+id/view1”/>// 在3个布局中的id相同
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#0f0"
android:id="@+id/view2”/>// 在3个布局中的id相同
res/layout/activity_transition_manager_scene3.xml
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/container">
android:layout_width="100dip"
android:layout_height="50dip"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:background="#f00"
android:id="@+id/view1”/>// 在3个布局中的id相同
android:layout_width="100dip"
android:layout_height="50dip"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:background="#0f0"
android:id="@+id/view2”/>// 在3个布局中的id相同
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="vertical"
android:id="@+id/grayscaleContainer”>// 只有这个Scene中才存在该子View,因此该Scene和其他Scene切换时,需要单独为这个子View添加transition,例如fade,slide,explode
android:layout_width="match_parent"
android:layout_height="10dip"
android:background="#000"
android:id="@+id/gray1"/>
其实,这只是定义Scene对应的布局的一种方法而已,还可以直接把1个View对象设置给Scene,Scene对应的布局即为该View对象
在此之所以这么做,一是因为用xml定义布局比较普遍,
二是在用xml定义TransitionManager时,Scene的布局(用android:fromScene和android:toScene指定)也必须是xml格式
2. 在Activity 的 onCreate() 中 定义多个Scene 和 TransitionManager
例如:
publicclassActivityTransitionManagerextendsActivity {
ScenemScene1,mScene2,mScene3;// 前面的3个布局,每个对应1个Scene
ViewGroupmSceneRoot;// 用来包含Scene对应布局的parent ViewGroup
TransitionManagermTransitionManager;// 用来管理Scene切换的对象
@Override
protectedvoidonCreate(BundlesavedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_transition_manager);
mSceneRoot= (ViewGroup) findViewById(R.id.sceneRoot);// 必须找到包含Scene的parent ViewGroup,后续很多地方都要用到它
TransitionInflaterinflater= TransitionInflater.from(this);
// 将 Scene,Scene对应的布局,包含布局的parent ViewGroup 关联起来
// 注意,有多种方法用来创建Scene对象,这只是其中一种而已,前面已经描述过
mScene1= Scene.getSceneForLayout(mSceneRoot, R.layout.activity_transition_manager_scene1,this);
mScene2= Scene.getSceneForLayout(mSceneRoot, R.layout.activity_transition_manager_scene2,this);
mScene3= Scene.getSceneForLayout(mSceneRoot, R.layout.activity_transition_manager_scene3,this);
// 从 res/transition/transitions_mgr 文件中inflate出 TransitionManager 对象,需要给定 parent ViewGroup
mTransitionManager=inflater.inflateTransitionManager(R.transition.transitions_mgr,mSceneRoot);
}
}
3. 在xml 中定义 TransitionManager 对象
res/transition/transitions_mgr.xml
http://schemas.android.com/apk/res/android">
// 从 mScene1 切换到 mScene2
android:toScene="@layout/activity_transition_manager_scene2"
android:transition="@transition/changebounds"/>
// 从 mScene2 切换到 mScene1
android:toScene="@layout/activity_transition_manager_scene1"
android:transition="@transition/changebounds"/>
// 从其他 Scene 切换到 mScene3
android:transition="@transition/changebounds_slidein_together"/>
// 从 mScene3 切换到 mScene1
android:toScene="@layout/activity_transition_manager_scene1"
android:transition="@transition/changebounds_fadeout_sequential"/>
// 从 mScene3 切换到 mScene2
android:toScene="@layout/activity_transition_manager_scene2"
android:transition="@transition/changebounds_fadeout_sequential"/>
其中,包含多个,每个定义了一次Scene切换时用到的过渡动画,
android:fromScene表示切换前的布局
android:toScene表示切换后的布局
android:transition表示切换过程中用到的过渡动画
android:fromScene和android:toScene可以同时给出,也可以只给出后者,不允许只给出前者
同时给出时,表示从一个Scene切换到另一个Scene,即一个布局切换到另一个布局
只给出android:toScene时,表示从其他Scene切换到某一个Scene,即从其他布局切换到某一个布局
在 transitions_mgr.xml 中用到的过渡动画分别为
res/transition/changebounds.xml
// 平滑地改变id相同的View的位置和大小
res/transition/changebounds_fadein_together.xml
http://schemas.android.com/apk/res/android">
// 平滑地改变id相同的View的位置和大小
// 对id为 grayscaleContainer 的View,使用特定的过渡动画,这里是淡入的效果
// 这个view 只有 mScene3 中才有,因此 mScene3 和其他Scene切换时,有必要单独为这货单独指定过渡动画
res/transition/changebounds_fadeout_together.xml
http://schemas.android.com/apk/res/android"
android:transitionOrdering="sequential">
// 平滑地改变id相同的View的位置和大小
// 对id为 grayscaleContainer 的View,使用特定的过渡动画,这里是淡出的效果
// 这个view 只有 mScene3 中才有,因此 mScene3 和其他Scene切换时,有必要单独为这货单独指定过渡动画
需要指出的是,上面的 changebounds_fadein_together.xml 和 changebounds_fadeout_together.xml 还有一个差异,
后者指定了android:transitionOrdering值为"sequential",而前者使用的是默认值"together"
即为 TransitionSet 对象,其中包含了一系列的Transition子类,每个代表一个过渡动画,
"sequential"表示各个过渡动画依次运行
"together"表示各个过渡动画同时运行
如果把上面的 fade 替换成 slide 或 explode,你可以看到不同的效果
在 TransitionManager.getTransition() 中可以看出,如果你没有指定过渡动画,TransitionManager 会使用默认的过渡动画,AutoTransition,
在 AutoTransition 中,指定了android:transitionOrdering值为"sequential”, 具体行为:
先为不再存在的子View执行 淡出 的过渡动画
后为 共同的子View执行changeBounds 的过渡动画
最后为新添加的子View执行 淡入 的过渡动画
4. 启动Scene切换,即布局切换
一般,用户点击了某个按钮,在按钮的事件处理函数中,启动Scene切换
publicclassActivityTransitionManagerextendsActivity {
...
// 4个按钮的 事件处理函数
publicvoidselectScene(Viewview) {
switch(view.getId()) {
caseR.id.button1:// 按下第1个按钮,显示 mScene1,即切换到 mScene1 对应的布局
mTransitionManager.transitionTo(mScene1);
break;
caseR.id.button2:// 按下第2个按钮,显示 mScene2,即切换到 mScene2 对应的布局
mTransitionManager.transitionTo(mScene2);
break;
caseR.id.button3:// 按下第3个按钮,显示 mScene3,即切换到 mScene3 对应的布局
mTransitionManager.transitionTo(mScene3);
break;
caseR.id.button4:// 按下第4个按钮,我们改变子View的大小,TransitionManager 会自动帮我们做过渡动画
// scene4 is not an actual 'Scene', but rather a dynamic change in the UI,
// transitioned to using beginDelayedTransition() to tell the TransitionManager
// to get ready to run a transition at the next frame
// 这里没有给定具体的过渡动画,则使用默认的过渡动画 AutoTransition
TransitionManager.beginDelayedTransition(mSceneRoot);
setNewSize(R.id.view1, 150, 25);
setNewSize(R.id.view2, 150, 25);
break;
}
}
}
5. 使用 TransitionManager.beginDelayedTransition() 类,为布局中子View的移动,新增,删除,改变大小等增加过渡动画
注意:子View必须有相同的id和相同的层级结构,但是并不要求是同一种View,例如可以由Button变为ImageView
并且,如果有嵌套,子View的parent的id也必须相同