web-dev-qa-db-de.com

Wie animiere ich das Recycling als Google Plus/Google-Kiosk?

Wie animiere ich die RecyclerView, wenn die Elemente zum ersten Mal angezeigt werden und wenn der Benutzer einen Bildlauf durchführt, genau wie dies für die Google Plus-App oder die Google News Stand-App der Fall ist?.

Ich habe auch irgendwo gelesen, dass RecyclerView keine Animation direkt unterstützt, wenn der Benutzer einen Bildlauf durchführt. Wenn dies wahr ist, können wir es trotzdem tun?

29
T_C

Ich habe es so gemacht. Könnte jemandem helfen Ich weiß nicht, ob es der beste Weg ist, aber es funktioniert gut für mich.

UPDATE: Um das schnelle Scrollen zu verhindern, überschreiben Sie die onViewDetachedFromWindow-Methode des Adapters und rufen Sie clearAnimation in der animierten Ansicht (in diesem Fall holder.itemView.clearAnimation()).

@Override
public void onViewDetachedFromWindow(ViewHolder holder) {
    super.onViewDetachedFromWindow(holder);
    holder.itemView.clearAnimation();
}

up_from_bottom.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:Android="http://schemas.Android.com/apk/res/Android"
 Android:shareInterpolator="@Android:anim/decelerate_interpolator">
<translate
    Android:fromXDelta="0%" Android:toXDelta="0%"
    Android:fromYDelta="100%" Android:toYDelta="0%"
    Android:duration="400" />
</set>

down_from_top.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:Android="http://schemas.Android.com/apk/res/Android"
 Android:shareInterpolator="@Android:anim/decelerate_interpolator">
<translate
    Android:fromXDelta="0%" Android:toXDelta="0%"
    Android:fromYDelta="-100%" Android:toYDelta="0%"
    Android:duration="400" />
</set>

Und zum Schluss diesen Code in onBindViewHolder von recyclerView setzen. Erstellen Sie ein Feld mit dem Namen lastPosition und initialisieren Sie es mit -1.

Animation animation = AnimationUtils.loadAnimation(context,
            (position > lastPosition) ? R.anim.up_from_bottom
                    : R.anim.down_from_top);
    holder.itemView.startAnimation(animation);
    lastPosition = position;
73
Vineet Ashtekar

Für down_from_top.xml sollte es sein 

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:Android="http://schemas.Android.com/apk/res/Android"
 Android:shareInterpolator="@Android:anim/decelerate_interpolator">
<translate
    Android:fromXDelta="0%" Android:toXDelta="0%"
    Android:fromYDelta="-100%" Android:toYDelta="0%"
    Android:duration="400" />
</set>
2
Arade

https://github.com/wasabeef/recyclerview-animators

In meinem Code steht ungefähr so:

import jp.wasabeef.recyclerview.animators.adapters.AlphaInAnimationAdapter;

....

public function populate() {
   // Get your recicleview
   rv = (RecyclerView)findViewById(R.id.rv);
   rv.setHasFixedSize(true);

   // Populate your cursor with your own method...
   Cursor myRecycleItems= null;
   myRecycleItems= mDbHelper.getItems();

   //create your 
   itemsAdapter= new ItemsAdapter(myRecycleItems, getApplicationContext());


   //Finnaly apply your adapter to RV with AlphaInAnimationAdapter:
   rv.setAdapter(new AlphaInAnimationAdapter(itemsAdapter));

}

Sie müssen Abhängigkeiten zu Ihrem Gradle hinzufügen

dependencies {
  // jCenter
  ...... 
  your curent dependencies 
  ....
  compile 'jp.wasabeef:recyclerview-animators:2.0.0'
}

Lesen Sie das Dokumentformular https://github.com/wasabeef/recyclerview-animators , um es zu installieren.

1
catalin87

Ohne externe Bibliotheken in RecycleView.Adapter on method onBindViewHolder verwenden Sie die Animation wie im Beispiel:

       if (position>lastAnimatedPosition) {


        //set init transitionY to animate from it
        holder.itemView.setTranslationY(holder.itemView.getHeight());

        //animate to orginal position
        holder.itemView.animate().translationYBy(-  holder.itemView.getHeight()).start();


        lastAnimatedPosition=position;
    }

Der obige Code wird jede Zeile in der Liste von unten animieren. Die Animation wird nur einmal ausgeführt, aber onBindViewHolder wird beim Scrollen ausgeführt, so dass der erste Bildlauf der Liste mit Animationseffekt erfolgt.

Sehr wichtig ist es, die Ansicht zu Beginn der Animation zu initialisieren. In diesem Beispiel habe ich Folgendes festgelegt:

  holder.itemView.setTranslationY( + Y change);

dann geht die Animation zur ursprünglichen Position zurück:

 holder.itemView.animate().translationYBy(- Y change).start();

Wenn Sie Alpha benötigen, machen Sie das so:

 holder.itemView.setAlpha(0);
 holder.itemView.animate().apha(1).start();
0
Maciej Sikora