Android中轉場動畫的實現(xiàn)與兼容性處理
前言
在 Android 5.0 之前，我們已經(jīng)有了 overridePendingTransition() 方法來實現(xiàn)一些轉場效果。然而，在 Android 5.0 以后，轉場效果更加炫酷。
比如下面的動畫：
一、Android L 中的轉場動畫
實現(xiàn)轉場動畫只需三步：
在 res/ 目錄下創(chuàng)建 transition 文件夾，在該文件夾下定義界面轉場動畫和共享元素的動畫。
在 res/value/style 文件中為每個 Activity 指定轉場動畫的 style ，并在 AndroidManifest.xml 文件中為每個 Activity 設置對應的 android:theme。
在 Activity 調用 startActivity() 切換動畫前，使用 ActivityOptionsCompat 來創(chuàng)建轉場動畫時的共享對象。
下面就來對這三步進行詳細講解。
二、定義轉場動畫
在 res/ 目錄下創(chuàng)建了 transition 資源文件夾后，就可以在該文件夾下對每一種動畫進行定義。
一般來說，對 Activity 定義一個過渡動畫可以寫成下面的形式：
<explode xmlns:android="http://schemas.android.com/apk/res/android"> <targets> <target android:excludeId="@android:id/statusBarBackground"/> <target android:excludeId="@android:id/navigationBarBackground"/> </targets> </explode>
其中， 是動畫效果的名稱，Android 5.0（API 級別 21）支持這些進入與退出轉換：
1、分解（explode）：從場景中心移入或移出視圖。
2、滑動（slide）：從場景邊緣移入或移出視圖。
3、淡入淡出（fade）：通過調整透明度在場景中增添或移除視圖。
而每一種動畫效果，都有額外的屬性。比如滑動 slide，可以使用 android:slideEdge="top" 設置滑動的方向；淡入淡出（fade）可以使用 android:fadingMode="fade_in" 設置具體是淡入（fade_in）還是淡出（fade_out)等。
標簽里面定義需要轉場（或者不需要轉場）的目標 id ，這個 id 可以使系統(tǒng)自帶的，也可以是我們自己視圖中的 view 的 id，每一個 id 需要單獨在 標簽中定義，android:targetId 表示目標ID需要進行過渡轉換的 view，而 android:excludeId 表示我們不需要該 ID 的 view 進行過渡轉場。上面的那段代碼的意思是說，除了狀態(tài)欄和導航欄以外所有的 view，都執(zhí)行 explode 動畫。
如果我們想要在同一個過渡狀態(tài)中實現(xiàn)兩種或多種動畫效果怎么辦？也簡單，將根標簽替換為 ，然后定義每一種動畫效果，最后記得在根標簽中使用 android:transitionOrdering 注明這幾種動畫的演示順序，sequential 表示順序執(zhí)行，而 together 表示同時執(zhí)行。
比如像下面的代碼：
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"> <slide android:slideEdge="bottom"> <targets> <target android:targetId="@id/cardview"/> </targets> </slide> <fade> <targets> <target android:excludeId="@android:id/statusBarBackground"/> <target android:excludeId="@android:id/navigationBarBackground"/> <target android:excludeId="@id/cardview"/> </targets> </fade> </transitionSet>
這段代碼的意思就很簡單了，該 xml 定義了兩個過渡動畫，并且同時執(zhí)行。第一個動畫是針對 id 為 cardView 的 view 進行滑動，第二個動畫將除了狀態(tài)欄、導航欄和 cardview 以外的 view，進行淡入淡出。
三、為每個 Activity 定義轉場樣式
這里的每一種動畫，指的是在進行界面跳轉過渡時，兩個界面的狀態(tài)。比如對于 Activity A 和 Activity B 這兩個界面，可能的狀態(tài)如下：
1、界面 A 跳轉至界面 B ：這時界面 A 是退出（exit ）過渡狀態(tài)，而對應的界面B是進入（enter）過渡狀態(tài)。
2、界面 B 返回到界面 A ：這時界面 A 是重新進入（reenter）過渡，而對應的界面B則是返回（return）過渡。
一般來說，所有的 Activity 過渡動畫都可以定義成如下的形式：
<style name="BaseAppTheme" parent="android:Theme.Material"> <!-- 開啟過渡效果 --> <item name="android:windowContentTransitions">true</item> <!-- 指定界面進入/退出動畫效果 --> <item name="android:windowEnterTransition">@transition/explode</item> <item name="android:windowExitTransition">@transition/explode</item> <!-- 指定共享元素進入/退出的動畫效果 --> <item name="android:windowSharedElementEnterTransition"> @transition/change_image_transform</item> <item name="android:windowSharedElementExitTransition"> @transition/change_image_transform</item> </style>
當然，你可以不用寫全，比如在我的 Demo 中一個界面的轉場動畫文件如下：
<style name="AppTheme.Detail"> <item name="windowActionBar">false</item> <item name="android:windowNoTitle">true</item> <item name="android:windowTranslucentStatus">true</item> <item name="android:windowAllowEnterTransitionOverlap">false</item> <item name="android:windowEnterTransition">@transition/detail_enter</item> </style>
四、調用 ActivityOptionsCompat
轉場動畫是在兩個界面的跳轉返回時發(fā)生的，所以，當使用 intent 跳轉界面時，需要調用 ActivityOptionsCompat來指定動畫的運行。
一般來說，調用 ActivityOptionsCompat 的模板代碼如下：
// 創(chuàng)建一個包含過渡動畫信息的 ActivityOptions 對象 ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, view, getString(R.string.image_transition_name)); // 使用 Intent 跳轉界面，并傳遞共享對象信息 Intent intent = new Intent(this, DetailActivity.class); startActivity(intent, optionsCompat.toBundle());
ActivityOptionsCompat 是在support v4 包里面的，其實它是 ActivityOptions 的一個兼容（ActivityOptions是API 16引入的）。
然后，我們需要在第二個 Activity 中，將轉場的圖片獲取并顯示到界面中。
多個共享元素的過渡實現(xiàn)
有時候我們需要讓多個元素產生動畫效果，可以使用 Pair<> 來實現(xiàn)：
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, Pair.create(view1, "agreedName1"), Pair.create(view2, "agreedName2"));
五、手動實現(xiàn)一個轉場動畫
現(xiàn)在市面上，Android 5.0 以下的手機系統(tǒng)還有一定的市場份額，所以為了照顧這些用戶，我們只能手動實現(xiàn)一下共享元素的轉場動畫效果。
實現(xiàn)的思路也比較簡單，大概的步驟如下：
1、確定第一個界面的共享元素，將其信息傳遞個第二個界面
2、第二個界面接收信息，開始的時候將界面設置為透明，并只顯示共享元素。
3、將第二個界面的共享元素進行動畫處理。
那么我們開始一步步實現(xiàn)上面的步驟。
獲取共享元素位置信息
在第一個界面中，我們需要獲取到共享元素的位置信息，并將其傳遞給下一個界面。于是乎，我們可以在第一個界面元素點擊事件中，這么寫：
public void imageClick(View view) {
Intent intent = new Intent(AnimeActivity.this, AnimeDetailActivity.class);
// 創(chuàng)建一個 rect 對象來存儲共享元素位置信息
Rect rect = new Rect();
// 獲取元素位置信息
view.getGlobalVisibleRect(rect);
// 將位置信息附加到 intent 上
intent.setSourceBounds(rect);
CustomImage customImage = (CustomImage) view;
intent.putExtra(AnimeDetailActivity.EXTRA_IMAGE, customImage.getImageId());
startActivity(intent);
// 屏蔽 Activity 默認轉場效果
overridePendingTransition(0, 0);
}
其中，getGlobalVisibleRect() 方法的含義是，獲取 可見的狀態(tài)欄高度+可見的標題欄高度+Rect左上角到標題欄底部的距離，如果標題欄被隱藏了，那么可見標題欄高度為0。
接下來，就在在第二個界面接收位置信息并將該圖片展示出來了。
模擬轉場動畫
在第二個界面中，我們需要做如下的操作：
1、獲取上共享元素信息。
2、計算共享元素縮放比例和位移距離。
3、調用動畫，完成模擬轉場效果。
我將上面三個步驟的代碼如下。
private void initial() {
// 獲取上一個界面?zhèn)魅氲男畔?
mRect = getIntent().getSourceBounds();
mRescourceId = getIntent().getExtras().getInt(EXTRA_IMAGE);
// 獲取上一個界面中，圖片的寬度和高度
mOriginWidth = mRect.right - mRect.left;
mOriginHeight = mRect.bottom - mRect.top;
// 設置 ImageView 的位置，使其和上一個界面中圖片的位置重合
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(mOriginWidth, mOriginHeight);
params.setMargins(mRect.left, mRect.top - getStatusBarHeight(), mRect.right, mRect.bottom);
mImageView.setLayoutParams(params);
// 設置 ImageView 的圖片和縮放類型
mImageView.setImageResource(mRescourceId);
mImageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
// 根據(jù)上一個界面?zhèn)魅氲膱D片資源 ID，獲取圖片的 Bitmap 對象。
BitmapDrawable bitmapDrawable = (BitmapDrawable) getResources().getDrawable(mRescourceId);
Bitmap bitmap = bitmapDrawable.getBitmap();
// 計算圖片縮放比例和位移距離
getBundleInfo(bitmap);
// 創(chuàng)建一個 Pallette 對象
mImagePalette = Palette.from(bitmap).generate();
// 使用 Palette 設置背景顏色
mContainer.setBackgroundColor(
mImagePalette.getVibrantColor(ContextCompat.getColor(this, android.R.color.black)));
}
在12行，通過設置 Margin 的形式來確定圖片的位置，需要注意的是，由于狀態(tài)欄是在父控件 FramLayout 之外的，因此我們要將 Rect.top 的值減去狀態(tài)欄的高度，這樣才是相對于屏幕的絕對位置。然后，getBundleInfo() 方法的代碼如下：
private void getBundleInfo(Bitmap bitmap) {
// 計算圖片縮放比例，并存儲在 bundle 中
if (bitmap.getWidth() >= bitmap.getHeight()) {
mScaleBundle.putFloat(SCALE_WIDTH, (float) mScreenWidth / mOriginWidth);
mScaleBundle.putFloat(SCALE_HEIGHT, (float) bitmap.getHeight() / mOriginHeight);
} else {
mScaleBundle.putFloat(SCALE_WIDTH, (float) bitmap.getWidth() / mOriginWidth);
mScaleBundle.putFloat(SCALE_HEIGHT, (float) mScreenHeight / mOriginHeight);
}
// 計算位移距離，并將數(shù)據(jù)存儲到 bundle 中
mTransitionBundle.putFloat(TRANSITION_X, mScreenWidth / 2 - (mRect.left + (mRect.right - mRect.left) / 2));
mTransitionBundle.putFloat(TRANSITION_Y, mScreenHeight / 2 - (mRect.top + (mRect.bottom - mRect.top) / 2));
}
動畫處理
最后我們需要使用動畫來模擬轉場效果，代碼如下：
private void runEnterAnim() {
mImageView.animate()
.setInterpolator(DEFAULT_INTERPOLATOR)
.setDuration(DURATION)
.scaleX(mScaleBundle.getFloat(SCALE_WIDTH))
.scaleY(mScaleBundle.getFloat(SCALE_HEIGHT))
.translationX(mTransitionBundle.getFloat(TRANSITION_X))
.translationY(mTransitionBundle.getFloat(TRANSITION_Y))
.start();
}
很簡單，自此，入場動畫效果基本模擬完畢。
而退場動畫就更簡單了，直接上代碼：
private void runExitAnim() {
mImageView.animate()
.setInterpolator(DEFAULT_INTERPOLATOR)
.setDuration(DURATION)
.scaleX(1)
.scaleY(1)
.translationX(0)
.translationY(0)
.withEndAction(new Runnable() {
@Override
public void run() {
finish();
overridePendingTransition(0, 0);
}
})
.start();
}
總結
以上就是Android中實現(xiàn)轉場動畫的全部內容，所以，是不是很簡單？希望這篇文章的內容對各位Android開發(fā)者們能有所幫助，如果有疑問大家可以留言交流。
相關文章
Android畫圖實現(xiàn)MPAndroidchart折線圖示例詳解
這篇文章主要為大家介紹了Android畫圖實現(xiàn)MPAndroidchart折線圖示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
這篇文章主要介紹了Android使用Jsoup解析Html表格的方法,涉及Android中Jsoup的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-12-12
今天小編就為大家分享一篇關于Android實現(xiàn)簡單的文件下載與上傳，小編覺得內容挺不錯的，現(xiàn)在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧2018-12-12
這篇文章主要介紹了基于Android Studio編寫微信頁面提交功能，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03
這篇文章主要介紹了Android自定義播放器控件VideoView的相關資料,需要的朋友可以參考下2016-01-01
淺析Android企業(yè)級開發(fā)數(shù)據(jù)綁定技術
這篇文章通過代碼實例分析了Android企業(yè)級開發(fā)數(shù)據(jù)綁定技術的應用以及相關的原理知識，跟著小編一起學習參考下吧。2017-12-12
這篇文章主要為大家介紹了Android面試Intent采用了什么設計模式解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-03-03
Kotlin Channel處理多個數(shù)據(jù)組合的流
最近項目中對 kotlin 的使用比較多。不得不說 kotlin 確實可以極大的提高 android 的開發(fā)效率，channel用于協(xié)程之間的通訊，使用send和receive往通道里寫入或者讀取數(shù)據(jù)，2個方法為非阻塞掛起函數(shù)，channel是熱流，不管有沒有訂閱者都會發(fā)送2022-11-11
Android通過原生方式獲取經(jīng)緯度與城市信息的方法
這篇文章主要給大家介紹了關于Android通過原生方式獲取經(jīng)緯度與城市信息的相關資料，文中通過示例代碼介紹的非常詳細，對各位Android開發(fā)者們具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧2020-07-07
大家好，本篇文章主要講的是Android11文件管理權限申請詳細介紹，感興趣的同學趕快來看一看吧，對你有幫助的話記得收藏一下，方便下次瀏覽2021-12-12