Android
animatori
Ricerca…
Agitare l'animazione di un ImageView
Nella cartella res, crea una nuova cartella chiamata "anim" per memorizzare le risorse di animazione e inseriscila in quella cartella.
shakeanimation.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="100"
android:fromDegrees="-15"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:toDegrees="15" />
Crea un'attività vuota denominata Landing
activity_landing.xml
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imgBell"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@mipmap/ic_notifications_white_48dp"/>
</RelativeLayout>
E il metodo per animare l'imageview su Landing.java
Context mContext;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mContext=this;
setContentView(R.layout.activity_landing);
AnimateBell();
}
public void AnimateBell() {
Animation shake = AnimationUtils.loadAnimation(mContext, R.anim.shakeanimation);
ImageView imgBell= (ImageView) findViewById(R.id.imgBell);
imgBell.setImageResource(R.mipmap.ic_notifications_active_white_48dp);
imgBell.setAnimation(shake);
}
Animazione di dissolvenza in entrata / uscita
Per ottenere una vista per dissolvenza in ObjectAnimator
o in ObjectAnimator
, utilizzare un ObjectAnimator
. Come visto nel codice sottostante, imposta una durata usando .setDuration(millis)
dove il parametro millis
è la durata (in millisecondi) dell'animazione. Nel codice seguente, le viste si dissolvono in / out per oltre 500 millisecondi o 1/2 secondo. Per avviare ObjectAnimator
di animazione 's, chiamare .start()
. Una volta completata l'animazione, viene chiamato onAnimationEnd(Animator animation)
. Ecco un buon punto per impostare la visibilità della vista su View.GONE
o View.VISIBLE
.
import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.ValueAnimator;
void fadeOutAnimation(View viewToFadeOut) {
ObjectAnimator fadeOut = ObjectAnimator.ofFloat(viewToFadeOut, "alpha", 1f, 0f);
fadeOut.setDuration(500);
fadeOut.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
// We wanna set the view to GONE, after it's fade out. so it actually disappear from the layout & don't take up space.
viewToFadeOut.setVisibility(View.GONE);
}
});
fadeOut.start();
}
void fadeInAnimation(View viewToFadeIn) {
ObjectAnimator fadeIn = ObjectAnimator.ofFloat(viewToFadeIn, "alpha", 0f, 1f);
fadeIn.setDuration(500);
fadeIn.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationStar(Animator animation) {
// We wanna set the view to VISIBLE, but with alpha 0. So it appear invisible in the layout.
viewToFadeIn.setVisibility(View.VISIBLE);
viewToFadeIn.setAlpha(0);
}
});
fadeIn.start();
}
Animazione TransitionDrawable
Questo esempio mostra una transazione per una visualizzazione di immagine con solo due immagini (può usare più immagini una dopo l'altra per le posizioni di primo e secondo livello dopo ogni transazione come un ciclo)
- aggiungi un array di immagini a
res/values/arrays.xml
<resources>
<array
name="splash_images">
<item>@drawable/spash_imge_first</item>
<item>@drawable/spash_img_second</item>
</array>
</resources>
private Drawable[] backgroundsDrawableArrayForTransition;
private TransitionDrawable transitionDrawable;
private void backgroundAnimTransAction() {
// set res image array
Resources resources = getResources();
TypedArray icons = resources.obtainTypedArray(R.array.splash_images);
@SuppressWarnings("ResourceType")
Drawable drawable = icons.getDrawable(0); // ending image
@SuppressWarnings("ResourceType")
Drawable drawableTwo = icons.getDrawable(1); // starting image
backgroundsDrawableArrayForTransition = new Drawable[2];
backgroundsDrawableArrayForTransition[0] = drawable;
backgroundsDrawableArrayForTransition[1] = drawableTwo;
transitionDrawable = new TransitionDrawable(backgroundsDrawableArrayForTransition);
// your image view here - backgroundImageView
backgroundImageView.setImageDrawable(transitionDrawable);
transitionDrawable.startTransition(4000);
transitionDrawable.setCrossFadeEnabled(false); // call public methods
}
ValueAnimator
ValueAnimator
introduce un modo semplice per animare un valore (di un particolare tipo, ad esempio int
, float
, ecc.).
Il solito modo di usarlo è:
- Crea un
ValueAnimator
che animerà un valore damin
amax
- Aggiungi un
UpdateListener
in cui utilizzerai il valore animato calcolato (che puoi ottenere congetAnimatedValue()
)
Esistono due modi per creare ValueAnimator
:
(il codice di esempio anima un float
da 20f
a 40f
in 250ms
)
- Da
xml
(mettilo in/res/animator/
):
<animator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="250"
android:valueFrom="20"
android:valueTo="40"
android:valueType="floatType"/>
ValueAnimator animator = (ValueAnimator) AnimatorInflater.loadAnimator(context,
R.animator.example_animator);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator anim) {
// ... use the anim.getAnimatedValue()
}
});
// set all the other animation-related stuff you want (interpolator etc.)
animator.start();
- Dal codice:
ValueAnimator animator = ValueAnimator.ofFloat(20f, 40f);
animator.setDuration(250);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator anim) {
// use the anim.getAnimatedValue()
}
});
// set all the other animation-related stuff you want (interpolator etc.)
animator.start();
ObjectAnimator
ObjectAnimator
è una sottoclasse di ValueAnimator
con la possibilità aggiunta di impostare il valore calcolato sulla proprietà di una View
target
.
Proprio come in ValueAnimator
, ci sono due modi per creare ObjectAnimator
:
(il codice di esempio anima un alpha
di una View
da 0.4f
a 0.2f
in 250ms
)
- Da
xml
(mettilo in/res/animator
)
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="250"
android:propertyName="alpha"
android:valueFrom="0.4"
android:valueTo="0.2"
android:valueType="floatType"/>
ObjectAnimator animator = (ObjectAnimator) AnimatorInflater.loadAnimator(context,
R.animator.example_animator);
animator.setTarget(exampleView);
// set all the animation-related stuff you want (interpolator etc.)
animator.start();
- Dal codice:
ObjectAnimator animator = ObjectAnimator.ofFloat(exampleView, View.ALPHA, 0.4f, 0.2f);
animator.setDuration(250);
// set all the animation-related stuff you want (interpolator etc.)
animator.start();
ViewPropertyAnimator
ViewPropertyAnimator
è un modo semplificato e ottimizzato per animare le proprietà di una View
.
Ogni singola View
ha un oggetto ViewPropertyAnimator
disponibile tramite il metodo animate()
. Puoi usarlo per animare più proprietà contemporaneamente con una semplice chiamata. Ogni singolo metodo di un oggetto ViewPropertyAnimator
specifica il valore di destinazione di un parametro specifico a cui deve essere animato ViewPropertyAnimator
.
View exampleView = ...;
exampleView.animate()
.alpha(0.6f)
.translationY(200)
.translationXBy(10)
.scaleX(1.5f)
.setDuration(250)
.setInterpolator(new FastOutLinearInInterpolator());
Nota: la chiamata start()
su un oggetto ViewPropertyAnimator
NON è obbligatoria. Se non lo fai, stai semplicemente lasciando che la piattaforma gestisca l'avvio dell'animazione nel momento appropriato (passaggio successivo per la gestione dell'animazione). Se lo fai effettivamente (chiamata start()
) ti stai assicurando che l'animazione sia avviata immediatamente.
Espandi e comprimi l'animazione della vista
public class ViewAnimationUtils {
public static void expand(final View v) {
v.measure(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
final int targtetHeight = v.getMeasuredHeight();
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? LayoutParams.WRAP_CONTENT
: (int)(targtetHeight * interpolatedTime);
v.requestLayout();
}
@Override
public boolean willChangeBounds() {
return true;
}
};
a.setDuration((int)(targtetHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
public static void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation()
{
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if(interpolatedTime == 1){
v.setVisibility(View.GONE);
}else{
v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
v.requestLayout();
}
}
@Override
public boolean willChangeBounds() {
return true;
}
};
a.setDuration((int)(initialHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
}