Come implementare l'animazione di ridimensionamento su elementi condivisi nella transizione di attività

Question

Desidero implementare l'animazione di ridimensionamento su elementi condivisi nelle transizioni di attività proprio come in questo link.

Ma non è stato possibile trovare alcun riferimento valido per questo effetto specifico e come implementarlo. È una transizione personalizzata o predefinita? Forse qualcuno potrebbe aiutare o pubblicare tutorial più dettagliati su questa documentazione anziché su quella ufficiale.

Answer 1

mi permetta di darle un breve tutorial proprio qui :)

quello che realmente vuole è un elemento in comune transizione tra due attività. Non condividerai effettivamente alcuna vista, entrambe le attività avranno alberi di visualizzazione indipendenti. Ma passeremo le informazioni sull'elemento condiviso come la sua vista e le sue dimensioni alla nuova attività.

Durante l'avvio, la nuova attività renderà tutte le sue viste trasparenti e individuerà la vista condivisa. Altera i suoi attributi per abbinarli a quelli trasferiti dall'attività di avvio e rende visibile quella singola vista. Quindi esegue animazioni per trasferire la vista condivisa da questo stato alla sua posizione naturale nel layout. Mentre la transizione procede, lo sfondo della finestra e il resto degli elementi non condivisi lentamente si dissolvono fino a renderli completamente opachi. Tutto questo viene fatto automaticamente.

Ora per marcare una vista come condiviso impostare questa proprietà:

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

in entrambi i layout di attività.

Ora, mentre iniziare la vostra nuova attività da antica attività definiscono un'animazione della transizione:

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

È inoltre possibile specificare più viste per la transizione. Puoi persino trasferire le viste condivise tra diverse applicazioni.

Per impostazione predefinita l'animazione utilizzata è mossa:

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

ma è anche possibile impostare le animazioni personalizzate in styles.xml:

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

Ecco un esempio di lavoro di transizione elemento condiviso come mostrato sopra: https://github.com/anshchauhan/SharedElementTransition

Answer 2

Creare l'animazione in XML e l'uso seguente codice:

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

res/anim/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/anim/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> 

Answer 3

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

Questo video spiega come ottenere lo stesso risultato. L'idea principale è

1) Per sovrascrivere l'animazione predefinita personalizzata. Qui 0 significa che nessuna animazione è riprodotta per impostazione predefinita.

overridePendingTransition(0, 0); 

2) Tradurre e scalare l'immagine seconda attività alla vostra immagine GridView in modo che si sovrapponga completamente e quindi applicare l'animazione al ImageView propria attività a muoversi nella sua posizione originale e la scala.

anche dare un'occhiata alla Shared Element attività di transizione - https://guides.codepath.com/android/Shared-Element-Activity-Transition

Answer 4

1: trovare view spec:

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

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

2: creare un'attività trasparente e passare i valori superiori a nuova attività

3: aggiungi yourView a una nuova attività e fai qualcosa del genere:

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: usare un'animazione come @Neo risposta per il ridimensionamento yourView per riempire schermo