8

我希望在活動轉換上的共享元素上實現放大動畫,就像在此link中一樣。如何在活動轉換上的共享元素上實現放大動畫

但找不到任何有關此特定效果的良好參考以及如何實現它。這是自定義過渡還是默認?也許任何人都可以幫助或發佈更詳細的教程,而不是官方文檔。

+1

格紋是真棒。這可能會有幫助。 https://github.com/nickbutcher/plaid – nshmura

+0

試試這個教程:http://www.androidhive.info/2013/06/android-working-with-xml-animations/ –

+1

試試這個https://開頭github上。 COM/lgvalle /材料的動畫 – KrishnaJ

回答

6

讓我給你一個簡短的教程這裏:)

Shared element transition

你真正想要的是一個共享的元素兩項活動之間的過渡。你實際上不會分享任何觀點,兩個活動都會有獨立的觀點樹。但是我們會將有關共享元素的信息(如其視圖和大小)傳遞給新活動。

啓動時,新活動將使其所有視圖都透明,並查找共享視圖。它改變其屬性以匹配從啓動活動傳入的那些 ,並使該單個視圖可見。然後運行動畫將共享視圖從此狀態轉換爲佈局中的自然位置。隨着轉換的進行,窗口背景和其他非共享元素緩慢地褪去,直到它們完全不透明爲止。所有這些都是自動完成的。

現在標記的視圖,作爲共享設置此屬性:在兩個活動佈局

<ImageView 
... 
android:transitionName="@string/transition_photo" /> 

現在同時開始從老年活動新的活動定義一個過渡動畫:

Bundle bundle = ActivityOptions.makeSceneTransitionAnimation(
            this, 
            sharedView, 
            sharedView.getTransitionName()) 
           .toBundle(); 
startActivity(intent,bundle); 

您還可以指定爲過渡多個視圖。你甚至可以轉換不同的應用程序之間共享的看法。

默認使用的動畫舉動

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"> 
<changeBounds/> 
<changeTransform/> 
<changeClipBounds/> 
<changeImageTransform/> 
</transitionSet> 

但你也可以設置自定義動畫在styles.xml:

<style name="AppTheme.Details"> 
    <item name="android:windowSharedElementEnterTransition">@transition/shared_photo</item> 
</style> 

這裏是共享元素過渡的工作示例如上所示: https://github.com/anshchauhan/SharedElementTransition

0

創建XML和使用動畫下面的代碼:

protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    overridePendingTransition(animation_in, animation_out); 
} 

RES /動畫/ in.xml

<?xml version="1.0" encoding="utf-8"?> 
    <set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/linear_interpolator"> 

    <scale 
     android:duration="700" 
     android:fillBefore="false" 
     android:fromXScale="0.0" 
     android:fromYScale="0.0" 
     android:toXScale="1.0" 
     android:toYScale="1.0" /> 
</set> 

RES /動畫/ out.xml

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/linear_interpolator"> 

    <scale 
     android:duration="700" 
     android:fillBefore="false" 
     android:fromXScale="1.0" 
     android:fromYScale="1.0" 
     android:toXScale="0.0" 
     android:toYScale="0.0" /> 
</set> 
+0

的問題是,它應該是什麼樣的動畫具有相同的結果 – Datenshi

+0

@Datenshi,更新我的答案。希望這將幫助你:) – Neo

0

https://www.youtube.com/watch?v=CPxkoe2MraA

此視頻解釋如何實現相同的結果。主要想法是

1)覆蓋自定義默認動畫。這裏0表示默認情況下不播放動畫。

overridePendingTransition(0, 0); 

2)翻譯和第二活動圖像擴展到你的GridView圖像,使其完全蓋過它,然後將動畫應用於活動的imageview的移動原來的位置和規模。

此外看一看共享元素活動轉變 - https://guides.codepath.com/android/Shared-Element-Activity-Transition

0

1:發現視圖規格:

int[] location = new int[2]; 
view.getLocationOnScreen(location); 

int viewHeight = view.getHeight(); 
int viewWidth = view.getWidth(); 

2:建立一個透明的活性,並通過頂部值以新的活動

3:將您的視圖添加到新的活動,並做這樣的事情:

LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) yourView.getLayoutParams(); 
layoutParams.topMargin = location[1]; 
layoutParams.leftMargin = location[0]; 
layoutParams.height = viewHeight; 
layoutParams.width = viewWidth; 
yourView.setLayoutParams(layoutParams); 

4:使用像@ neo的答案的動畫縮放yourView填補屏幕

相關問題