Android實(shí)現(xiàn)Reveal圓形Activity轉(zhuǎn)場(chǎng)動(dòng)畫的完整步驟
前言
Activity的轉(zhuǎn)場(chǎng)動(dòng)畫很早就有,但是太過于單調(diào),樣式也不好看,本文將給大家介紹了關(guān)于Android實(shí)現(xiàn)Reveal圓形Activity轉(zhuǎn)場(chǎng)動(dòng)畫的相關(guān)內(nèi)容,分享出來供大家參考學(xué)習(xí),下面話不多說了,來一起看看詳細(xì)的介紹吧
一、效果
二、知識(shí)點(diǎn)
CircularReveal動(dòng)畫、透明主題、轉(zhuǎn)場(chǎng)動(dòng)畫(非必須)
三、方案
假設(shè)有兩個(gè)Activity A和B。Reveal圓形Activity轉(zhuǎn)場(chǎng)動(dòng)畫效果先從A到B,那么基本方案如下:
- 確定要顯示的圓形動(dòng)畫中心起點(diǎn)位置
- 通過Intent將起點(diǎn)位置從Activity A傳遞B
- Activity B主題需要是透明的,同時(shí)先隱藏布局視圖
- 在Activity A中啟動(dòng)Activity B,Activity A先不銷毀
- Activity B啟動(dòng)之后開始動(dòng)畫,在動(dòng)畫啟動(dòng)時(shí)顯布局視圖
- 銷毀Activity A,如果需要返回則不銷毀
四、實(shí)現(xiàn)
4.1 初始界面Activity A
在Activity A中需要定義好主題、布局以及啟動(dòng)Activity B的方法。因?yàn)楫?dāng)不需要執(zhí)行返回動(dòng)畫的時(shí)候,要把Activity A銷毀,這時(shí)候一定是在后臺(tái)銷毀的,所以要把主題相關(guān)設(shè)置為透明,不然會(huì)在Activity B中顯示Activity A銷毀界面。
<style name="FullScreen" parent="@style/Theme.AppCompat.Light.NoActionBar"> <item name="android:windowFullscreen">true</item> <item name="android:windowContentOverlay">@null</item> <item name="android:windowIsTranslucent">true</item> <item name="android:windowBackground">@android:color/transparent</item> <item name="android:backgroundDimEnabled">false</item> <item name="android:windowTranslucentNavigation">true</item> <item name="android:windowTranslucentStatus">true</item> <item name="android:windowDrawsSystemBarBackgrounds">true</item> </style>
然后是布局設(shè)置,這一步比較簡(jiǎn)單,這里以啟動(dòng)界面為例,顯示一張鋪滿全屏的圖片,下面覆蓋一個(gè)進(jìn)度條。
<?xml version="1.0" encoding="utf-8"?> <FrameLayout 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" tools:context=".SplashActivity"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="fitXY" android:src="@mipmap/wallace" /> <ProgressBar android:id="@+id/progressbar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|center_horizontal" android:layout_marginBottom="180dp" /> </FrameLayout>
在Activity A中啟動(dòng)Activity B代碼如下,使用轉(zhuǎn)場(chǎng)動(dòng)畫API執(zhí)行,當(dāng)然也可以使用ActivityCompat.startActivity(this, intent, null); overridePendingTransition(0, 0);這種方式。在這段代碼中,把Activity A中開始執(zhí)行Reveal圓形動(dòng)畫的坐標(biāo)點(diǎn)傳遞給Activity B,因?yàn)閯?dòng)畫是在Activity B中執(zhí)行的。
public void presentActivity(View view) { ActivityOptionsCompat options = ActivityOptionsCompat. makeSceneTransitionAnimation(this, view, "transition"); int revealX = (int) (view.getX() + view.getWidth() / 2); int revealY = (int) (view.getY() + view.getHeight() / 2); Intent intent = new Intent(this, MainActivity.class); intent.putExtra(MainActivity.EXTRA_CIRCULAR_REVEAL_X, revealX); intent.putExtra(MainActivity.EXTRA_CIRCULAR_REVEAL_Y, revealY); ActivityCompat.startActivity(this, intent, options.toBundle()); //ActivityCompat.startActivity(this, intent, null); overridePendingTransition(0, 0); }
4.2 動(dòng)畫界面Activity B
在Activity B中同樣需要定義好主題、布局以及執(zhí)行動(dòng)畫的方法。上面方案中也說到,Activity B需要是透明主題,而且布局文件不能為透明,隨便設(shè)置一個(gè)背景即可。因?yàn)閯?dòng)畫效果是從Activity A過度到Activity B,也就是啟動(dòng)Activity B一切準(zhǔn)備就緒之后,顯示其布局。同時(shí)開始執(zhí)行ViewAnimationUtils.createCircularReveal動(dòng)畫,createCircularReveal會(huì)把根布局慢慢展開。這樣就形成了上面的動(dòng)畫效果。
主題設(shè)置如下:
<style name="AppTheme.Transparent" parent="AppTheme"> <item name="android:windowIsTranslucent">true</item> <item name="android:windowBackground">@android:color/transparent</item> <item name="android:windowDrawsSystemBarBackgrounds">true</item> </style>
布局設(shè)置如下,注意根布局背景設(shè)置:
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout 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:id="@+id/root_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/holo_blue_dark" tools:context=".MainActivity"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" /> </android.support.constraint.ConstraintLayout>
最后就是執(zhí)行動(dòng)畫的代碼,先把根據(jù)不設(shè)置為不可見,然后在跟布局測(cè)量完畢之后開始執(zhí)行動(dòng)畫。
if (savedInstanceState == null && Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP && intent.hasExtra(EXTRA_CIRCULAR_REVEAL_X) && intent.hasExtra(EXTRA_CIRCULAR_REVEAL_Y)) { rootLayout.setVisibility(View.INVISIBLE); revealX = intent.getIntExtra(EXTRA_CIRCULAR_REVEAL_X, 0); revealY = intent.getIntExtra(EXTRA_CIRCULAR_REVEAL_Y, 0); ViewTreeObserver viewTreeObserver = rootLayout.getViewTreeObserver(); if (viewTreeObserver.isAlive()) { viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { revealActivity(revealX, revealY); rootLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this); } }); } } else { rootLayout.setVisibility(View.VISIBLE); }
protected void revealActivity(int x, int y) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { float finalRadius = (float) (Math.max(rootLayout.getWidth(), rootLayout.getHeight()) * 1.1); // create the animator for this view (the start radius is zero) Animator circularReveal = ViewAnimationUtils.createCircularReveal(rootLayout, x, y, 0, finalRadius); circularReveal.setDuration(400); circularReveal.setInterpolator(new AccelerateInterpolator()); // make the view visible and start the animation rootLayout.setVisibility(View.VISIBLE); circularReveal.start(); } else { finish(); } }
最后實(shí)現(xiàn)效果如下:
五、參考:
- https://android.jlelse.eu/a-little-thing-that-matter-how-to-reveal-an-activity-with-circular-revelation-d94f9bfcae28
- https://codesnipps.simolation.com/post/android/create-circular-reveal-animation-when-starting-activitys/
好了,以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,如果有疑問大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
- Android轉(zhuǎn)場(chǎng)動(dòng)畫深入分析探究
- Android?Flutter實(shí)現(xiàn)頁(yè)面切換轉(zhuǎn)場(chǎng)動(dòng)畫效果
- Android工具欄頂出轉(zhuǎn)場(chǎng)動(dòng)畫的實(shí)現(xiàn)方法實(shí)例
- Android5.0之Activity的轉(zhuǎn)場(chǎng)動(dòng)畫的示例
- 詳解Android(共享元素)轉(zhuǎn)場(chǎng)動(dòng)畫開發(fā)實(shí)踐
- Android中轉(zhuǎn)場(chǎng)動(dòng)畫的實(shí)現(xiàn)與兼容性處理
- Android轉(zhuǎn)場(chǎng)效果實(shí)現(xiàn)示例淺析
相關(guān)文章
Android編程使用Intent傳遞對(duì)象的方法分析
這篇文章主要介紹了Android編程使用Intent傳遞對(duì)象的方法,結(jié)合實(shí)例形式詳細(xì)分析了Android使用Intent實(shí)現(xiàn)傳遞對(duì)象的相關(guān)技巧與注意事項(xiàng),需要的朋友可以參考下2016-01-01Android實(shí)現(xiàn)網(wǎng)易云推薦歌單界面
大家好,本篇文章主要講的是Android實(shí)現(xiàn)網(wǎng)易云推薦歌單界面,感興趣的同學(xué)趕快來看一看吧,對(duì)你有幫助的話記得收藏一下2022-02-02Android中Java instanceof關(guān)鍵字全面解析
instanceof關(guān)鍵字用于判斷一個(gè)引用類型變量所指向的對(duì)象是否是一個(gè)類(或接口、抽象類、父類)的實(shí)例.這篇文章主要介紹了Android中Java instanceof關(guān)鍵字全面解析的相關(guān)資料,需要的朋友可以參考下2016-07-07Android EditText默認(rèn)不彈出輸入法的實(shí)現(xiàn)方法
下面小編就為大家分享一篇Android EditText默認(rèn)不彈出輸入法的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01Android黑科技之讀取用戶短信+修改系統(tǒng)短信數(shù)據(jù)庫(kù)
這篇文章主要介紹了Android黑科技之讀取用戶短信+修改系統(tǒng)短信數(shù)據(jù)庫(kù) 的相關(guān)資料,需要的朋友可以參考下2015-12-12Android實(shí)現(xiàn)仿美團(tuán)、順豐快遞數(shù)據(jù)加載效果
本片文章教給大家用Android實(shí)現(xiàn)美團(tuán)和順豐快遞APP的數(shù)據(jù)加載的動(dòng)畫效果,有興趣的朋友跟著學(xué)習(xí)嘗試下吧。2017-12-12Android使用動(dòng)畫設(shè)置ProgressBar進(jìn)度的方法
這篇文章主要為大家詳細(xì)介紹了Android使用動(dòng)畫設(shè)置ProgressBar進(jìn)度的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-01-01