Android中Activity過(guò)渡動(dòng)畫(huà)的實(shí)例講解
前言
以前Activty之間得跳轉(zhuǎn)非常生硬,自Android.5X后,Google對(duì)Activity的切換設(shè)計(jì)更多豐富的動(dòng)畫(huà)效果。
Android 5.X提供了三種Transition類(lèi)型,具體如下:
✧進(jìn)入:一個(gè)進(jìn)人的過(guò)渡動(dòng)畫(huà)決定Activity中的所有的視圖怎么進(jìn)入屏幕。
✧退出:一個(gè)退出的過(guò)渡動(dòng)畫(huà)決定-個(gè)Activity 中的所有視圖怎么退出屏幕。
✧共享元素:一個(gè)共享元素過(guò)渡動(dòng)畫(huà)決定兩個(gè)Activities 之間的過(guò)渡,怎么共享它們的視圖。
進(jìn)入和退出動(dòng)畫(huà)效果包括如下三種
✧explode (分解)——從屏幕中間進(jìn)或出,移動(dòng)視圖
✧slide (滑動(dòng)) ——從屏 幕邊緣進(jìn)或出,移動(dòng)視圖
✧fade(淡出)——通過(guò)改變屏幕上的視圖的不透明度達(dá)到添加或者移除視圖
共享元素包括:
✧changeBounds——改變目標(biāo)視圖的布局邊界
✧changeClipBounds——裁剪目標(biāo)視圖邊界
✧changeTransform——改變目標(biāo)規(guī)圖的編放比例和能轉(zhuǎn)角度
✧changelmagTransfom——改空目標(biāo)圖片的大小和縮放比例
分解動(dòng)畫(huà)
效果視頻
解析
分解動(dòng)畫(huà)的進(jìn)場(chǎng)動(dòng)畫(huà)為上下向中間擠壓,退出動(dòng)畫(huà)為上下向外散開(kāi)
通過(guò)在跳轉(zhuǎn)Activity的時(shí)候使用ActivityOptions.makeSceneTransitionAnimation( this ).toBundle()
方法進(jìn)行動(dòng)畫(huà)聲明,
startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this ).toBundle() );
然后再另外一個(gè)Activity設(shè)置動(dòng)畫(huà)效果,分解動(dòng)畫(huà)進(jìn)場(chǎng)與退出代碼如下
進(jìn)場(chǎng)效果代碼如下
getWindow().setEnterTransition( new Explode( ) );
退場(chǎng)效果代碼如下
getWindow().setExitTransition( new Explode( ) );
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
滑動(dòng)動(dòng)畫(huà)
效果視頻
解析
滑動(dòng)動(dòng)畫(huà)的進(jìn)場(chǎng)動(dòng)畫(huà)為逐漸向上進(jìn)入,退出動(dòng)畫(huà)為逐漸向下退出
通過(guò)在跳轉(zhuǎn)Activity的時(shí)候使用ActivityOptions.makeSceneTransitionAnimation( this ).toBundle()
方法進(jìn)行動(dòng)畫(huà)聲明,
startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this ).toBundle() );
然后再另外一個(gè)Activity設(shè)置動(dòng)畫(huà)效果,進(jìn)場(chǎng)與退出代碼如下
進(jìn)場(chǎng)效果代碼如下
getWindow().setEnterTransition( new Slide( ) );
退場(chǎng)效果代碼如下
getWindow().setExitTransition( new Slide( ) );
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
淡出動(dòng)畫(huà)
效果視頻
解析
談話動(dòng)畫(huà)的進(jìn)場(chǎng)動(dòng)畫(huà)為由虛到實(shí),由淺到深,退出動(dòng)畫(huà)則相反
通過(guò)在跳轉(zhuǎn)Activity的時(shí)候使用ActivityOptions.makeSceneTransitionAnimation( this ).toBundle()
方法進(jìn)行動(dòng)畫(huà)聲明,
startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this ).toBundle() );
然后再另外一個(gè)Activity設(shè)置動(dòng)畫(huà)效果,進(jìn)場(chǎng)與退出代碼如下
進(jìn)場(chǎng)效果代碼如下
getWindow().setEnterTransition( new Fade( ) );
退場(chǎng)效果代碼如下
getWindow().setExitTransition( new Fade( ) );
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
全部代碼在文章底部會(huì)全部貼出
共享元素
共享單個(gè)元素
效果視頻
解析
共享元素需要再XML布局文件中綁定一個(gè)相同的名稱(chēng),例如再進(jìn)場(chǎng)的Activity XML布局文件中的 android:transitionName="“屬性為share1,那么再另外一個(gè)Activity 的XML布局文件中 android:transitionName=”"屬性也應(yīng)該設(shè)置為share1,保持一致
<Button android:id="@+id/share1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="share1" android:transitionName="share1" android:layout_gravity="center"/>
設(shè)置完布局文件中的屬性之后,我們?cè)貯ctiviy中設(shè)置如下代碼,其中share1是我們申明的Button控件的定義share1 = findViewById( R.id.share1 );
其中字符串"share1"為我們?cè)赬ML文件定義的屬性名稱(chēng)
startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this, Pair.create( (View)share1,"share1" )).toBundle() );
在第一個(gè)Activity中設(shè)置完成之后,我們需要在跳轉(zhuǎn)之后的Activity進(jìn)行接收,如上面所述,需要在XML布局文件中 android:transitionName=""屬性設(shè)置為share1,代碼如圖所示
<ImageView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:src="@drawable/sky" android:transitionName="share1" android:scaleType="fitXY"/>
綁定相同屬性之后,我們就無(wú)需在Activity進(jìn)行任何設(shè)置,即可看到效果
共享多個(gè)元素
效果視頻
多個(gè)元素共享與單個(gè)元素共享原理一樣,在第一個(gè)Activity需要定義多個(gè)不同的名稱(chēng)進(jìn)行綁定,此處以?xún)蓚€(gè)為例
<Button android:id="@+id/share1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="share1" android:transitionName="share1" android:layout_gravity="center"/> <Button android:id="@+id/share2" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="share2" android:transitionName="share2" android:layout_gravity="center"/>
然后再Activity中進(jìn)行屬性傳遞
/*共享多個(gè)元素*/ startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this, Pair.create( (View)share1,"share1" ), Pair.create( (View)share2,"share2" )).toBundle() );
然后,統(tǒng)一再另外一個(gè)Activty的XML布局文件設(shè)置相對(duì)應(yīng)的屬性名稱(chēng)
<ImageView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:src="@drawable/sky" android:transitionName="share1" android:scaleType="fitXY"/> <ImageView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:src="@drawable/ground" android:transitionName="share2" android:scaleType="fitXY"/>
全部代碼
第一個(gè)Activity XML布局文件代碼
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity" android:background="#cc00cc" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="explode" android:onClick="Explode" android:layout_gravity="center"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="slide" android:onClick="Slide" android:layout_gravity="center"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="fade" android:onClick="Fade" android:layout_gravity="center"/> <Button android:id="@+id/share1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="share1" android:transitionName="share1" android:layout_gravity="center"/> <Button android:id="@+id/share2" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="share2" android:transitionName="share2" android:layout_gravity="center"/> <Button android:layout_width="100dp" android:layout_height="50dp" android:text="SingleShare" android:textAllCaps="false" android:onClick="SingleShare" android:layout_gravity="center"/> <Button android:layout_width="100dp" android:layout_height="50dp" android:text="MultShare" android:textAllCaps="false" android:onClick="MultShare" android:layout_gravity="center"/> </LinearLayout>
第一個(gè)Activity 代碼
public class MainActivity extends AppCompatActivity { private Button share1,share2; private Intent intent; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate( savedInstanceState ); setContentView( R.layout.activity_main ); share1 = findViewById( R.id.share1 ); share2 = findViewById( R.id.share2 ); } public void Explode(View view) { ReturnActivity(0); } public void Slide(View view) { ReturnActivity(1); } public void Fade(View view) { ReturnActivity(2); } public void SingleShare(View view) { ReturnActivity(3); } public void MultShare(View view) { ReturnActivity(4); } private void ReturnActivity(int num){ intent = new Intent( this, TransitionActivity.class); switch (num){ case 0: intent.putExtra( "flag",0 ); break; case 1: intent.putExtra( "flag",1 ); break; case 2: intent.putExtra( "flag",2 ); break; case 3: case 4: intent.putExtra( "flag",3 ); break; } if (num < 3){ startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this ).toBundle() ); }else if (num == 3){ /*共享單個(gè)元素*/ startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this, Pair.create( (View)share1,"share1" )).toBundle() ); }else { /*共享多個(gè)元素*/ startActivity( intent, ActivityOptions.makeSceneTransitionAnimation( this, Pair.create( (View)share1,"share1" ), Pair.create( (View)share2,"share2" )).toBundle() ); } } }
第二個(gè)Activity XML布局文件代碼
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".TransitionActivity"> <ImageView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:src="@drawable/sky" android:transitionName="share1" android:scaleType="fitXY"/> <Button android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:layout_gravity="center"/> <ImageView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="3" android:src="@drawable/ground" android:transitionName="share2" android:scaleType="fitXY"/> </LinearLayout>
第二個(gè)Activity 代碼
在第二個(gè)Activity設(shè)置getWindow().requestFeature( Window.FEATURE_CONTENT_TRANSITIONS );
標(biāo)識(shí)符,即可設(shè)置動(dòng)畫(huà)效果
public class TransitionActivity extends AppCompatActivity { @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( ) ); getWindow().setExitTransition( new Explode( ) ); break; case 1: getWindow().setEnterTransition( new Slide( ) ); getWindow().setExitTransition( new Slide( ) ); break; case 2: getWindow().setEnterTransition( new Fade( ) ); getWindow().setExitTransition( new Fade( ) ); break; case 3: break; } setContentView( R.layout.activity_transition ); } }
總結(jié)
到此這篇關(guān)于Android中Activity過(guò)渡動(dòng)畫(huà)的文章就介紹到這了,更多相關(guān)Android Activity過(guò)渡動(dòng)畫(huà)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- Android?進(jìn)入Activity時(shí)如何禁止彈出軟鍵盤(pán)輸入法
- Android中Activity組件實(shí)例介紹
- Android應(yīng)用內(nèi)懸浮窗Activity的簡(jiǎn)單實(shí)現(xiàn)
- Android四大組件之Activity詳細(xì)介紹
- Android?Activity生命周期調(diào)用的理解
- Android Activity活動(dòng)頁(yè)面跳轉(zhuǎn)與頁(yè)面?zhèn)髦?/a>
- Android activity動(dòng)畫(huà)不生效原因及解決方案總結(jié)
- Android入門(mén)教程之組件Activity的生命周期詳解
- Android四大組件之Activity深入解讀生命周期
相關(guān)文章
Android使用Spinner實(shí)現(xiàn)城市級(jí)聯(lián)下拉框
這篇文章主要為大家詳細(xì)介紹了Android使用Spinner實(shí)現(xiàn)城市級(jí)聯(lián)下拉框,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-12-12Android下2d物理引擎Box2d用法簡(jiǎn)單實(shí)例
這篇文章主要介紹了Android下2d物理引擎Box2d用法,實(shí)例分析了在Android平臺(tái)上使用Box2d的基本技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07Android開(kāi)源庫(kù)自定義相機(jī)模塊
這篇文章主要為大家詳細(xì)介紹了Android開(kāi)源庫(kù)自定義相機(jī)模塊,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-05-05Android使用phonegap從相冊(cè)里面獲取照片(代碼分享)
本文主要介紹了使用phonegap從相冊(cè)里面獲取照片的實(shí)現(xiàn)方法代碼。具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-03-03android實(shí)現(xiàn)查詢(xún)公交車(chē)還有幾站的功能
這篇文章主要為大家詳細(xì)介紹了android實(shí)現(xiàn)查詢(xún)公交車(chē)還有幾站的功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05Kotlin類(lèi)對(duì)象class初始化與使用
Kotlin 是一種追求簡(jiǎn)潔的語(yǔ)言,在類(lèi)上也下了不少功夫,放棄了很多c++ 中類(lèi)非常復(fù)雜的概念,其實(shí)對(duì)于類(lèi)可以這樣來(lái)理解,為了復(fù)用的方便性和完整性,我們把變量和函數(shù)組合在一起,形成了類(lèi)的概念2022-12-12Android設(shè)置TextView顯示指定個(gè)數(shù)字符,超過(guò)部分顯示...(省略號(hào))的方法
這篇文章主要介紹了Android設(shè)置TextView顯示指定個(gè)數(shù)字符,超過(guò)部分顯示...(省略號(hào))的方法,涉及Android TextView屬性設(shè)置的相關(guān)技巧,需要的朋友可以參考下2016-02-02Flexbox+ReclyclerView實(shí)現(xiàn)流式布局
這篇文章主要為大家詳細(xì)介紹了Flexbox+ReclyclerView實(shí)現(xiàn)流式布局,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-11-11