Animation Android-Flip
J'ai besoin de créer une animation-retourner une vue et en montrer une autre.
La largeur de la vue actuellement affichée est réduite lentement à zéro et après cela, la largeur de la vue à afficher doit être augmentée de zéro.
Pendant ce temps, la hauteur passe de la hauteur actuellement affichée à la hauteur légèrement diminuée et revient à nouveau.
Comment puis-je y parvenir... utilisation D'un ViewFlipper.
3 réponses
, Vous pouvez le faire avec ScaleAnimations définie sur ViewFlipper. Je fais une chose similaire sans la deuxième échelle. J'ai deux animations, une pour la vue qui sort et une pour la vue qui arrive. Je vais les poster ici comme point de départ pour vous.
Shrink_to_middle.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:interpolator="@android:anim/linear_interpolator"
android:fromXScale="1.0"
android:toXScale="1.0"
android:fromYScale="1.0"
android:toYScale="0.0"
android:fillAfter="false"
android:duration="200" />
<translate
android:fromYDelta="0"
android:toYDelta="50%"
android:duration="200"/>
</set>
Grow_from_middle.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:interpolator="@android:anim/linear_interpolator"
android:fromXScale="1.0"
android:toXScale="1.0"
android:fromYScale="0.0"
android:toYScale="1.0"
android:fillAfter="false"
android:startOffset="200"
android:duration="200" />
<translate
android:fromYDelta="50%"
android:toYDelta="0"
android:startOffset="200"
android:duration="200"/>
</set>
Ensuite, dans l'application, je les mets au ViewFlipper comme ceci:
mViewFlipper.setInAnimation(context, R.anim.grow_from_middle);
mViewFlipper.setOutAnimation(context, R.anim.shrink_to_middle);
Comme je l'ai dit, ce n'est pas exactement ce que vous avez décrit, mais c'est très proche et obtenir vous avez commencé.
--modifier--
Voici le code utilisant le pivotX et pivotY (Eh bien, juste pivotY dans mon cas):
Shrink_to_middle.xml
<?xml version="1.0" encoding="utf-8"?>
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fromXScale="1.0"
android:toXScale="1.0"
android:fromYScale="1.0"
android:toYScale="0.0"
android:pivotY="50%"
android:fillAfter="false"
android:duration="200" />
Grow_from_middle.xml
<?xml version="1.0" encoding="utf-8"?>
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fromXScale="1.0"
android:toXScale="1.0"
android:fromYScale="0.0"
android:toYScale="1.0"
android:pivotY="50%"
android:fillAfter="false"
android:startOffset="200"
android:duration="200" />
Juste pour notifier que j'ai développé une nouvelle bibliothèque FlipView qui inclut et étend cette animation spécifique (flip) décrite par CaseyB. Je veux dire une bibliothèque entièrement personnalisable où vous pourrez échanger n'importe quel type de vues et de mises en page avec n'importe quel type d'animation et de formes que vous désirez, y compris le retournement de L'image Gmail.
, Veuillez jeter un oeil.
Utilisation de l'animation d'échelle de la réponse de CaseyB avec objectAnimator. Si vous n'avez pas le dossier animator sous res, créez-en un, il faut que la disposition objectAnimator réside dans ce dossier animator.
Res/animateur/shrink_to_middle.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:valueFrom="1.0"
android:valueTo="0.0"
android:propertyName="scaleX"
android:duration="200"/>
</set>
Res/animateur/grow_from_middle.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:valueFrom="0.0"
android:valueTo="1.0"
android:propertyName="scaleX"
android:duration="200"
android:startOffset="200"/>
</set>
Le code:
ImageView iv = (ImageView) findViewById(R.id.my_image);
AnimatorSet shrinkSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.shrink_to_middle);
shrinkSet.setTarget(iv);
shrinkSet.start();
iv.setImageResource(R.drawable.another_image);
AnimatorSet growSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.grow_from_middle);
growSet.setTarget(iv);
growSet.start();