Vis og skjul en visning med en animation, der glider op/ned

Jeg har et LinearLayout, som jeg ønsker at vise eller skjule med en Animation, der skubber layoutet opad eller nedad, når jeg ændrer synligheden.

I've set et par eksempler derude, men ingen af dem passer til mine behov.

Jeg har oprettet to xml-filer til animationerne, men jeg ved ikke, hvordan jeg skal starte dem, når jeg ændrer synligheden af et LinearLayout.

Løsning

Med den nye animations-API, der blev indført i Android 3.0 (Honeycomb), er det meget nemt at skabe sådanne animationer.

Skub en View nedad med en vis afstand:

view.animate().translationY(distance);

Du kan senere skubbe View tilbage til sin oprindelige position på denne måde:

view.animate().translationY(0);

Du kan også nemt kombinere flere animationer. Følgende animation vil skubbe et View nedad i højden og samtidig blænde det ind:

// Prepare the View for the animation
view.setVisibility(View.VISIBLE);
view.setAlpha(0.0f);

// Start the animation
view.animate()
    .translationY(view.getHeight())
    .alpha(1.0f)
    .setListener(null);

Du kan derefter fade View ud igen og skubbe det tilbage til sin oprindelige position. Vi indstiller også en AnimatorListener, så vi kan sætte synligheden af View tilbage til GONE, når animationen er færdig:

view.animate()
    .translationY(0)
    .alpha(0.0f)
    .setListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            view.setVisibility(View.GONE);
        }
    });
Kommentarer (22)

Du kan starte den korrekte Animation, når synligheden af LinearLayout ændres, ved at oprette en ny underklasse af LinearLayout og overstyre setVisibility() for at starte Animations. Overvej noget som dette:

public class SimpleViewAnimator extends LinearLayout
{
    private Animation inAnimation;
    private Animation outAnimation;

    public SimpleViewAnimator(Context context)
    {
        super(context);
    }

    public void setInAnimation(Animation inAnimation)
    {
        this.inAnimation = inAnimation;
    }

    public void setOutAnimation(Animation outAnimation)
    {
        this.outAnimation = outAnimation;
    }

    @Override
    public void setVisibility(int visibility)
    {
        if (getVisibility() != visibility)
        {
            if (visibility == VISIBLE)
            {
                if (inAnimation != null) startAnimation(inAnimation);
            }
            else if ((visibility == INVISIBLE) || (visibility == GONE))
            {
                if (outAnimation != null) startAnimation(outAnimation);
            }
        }

        super.setVisibility(visibility);
    }
}
Kommentarer (7)
if (filter_section.getVisibility() == View.GONE) {
    filter_section.animate()
            .translationY(filter_section.getHeight()).alpha(1.0f)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationStart(Animator animation) {
                    super.onAnimationStart(animation);
                    filter_section.setVisibility(View.VISIBLE);
                    filter_section.setAlpha(0.0f);
                }
            });
} else {
    filter_section.animate()
            .translationY(0).alpha(0.0f)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    super.onAnimationEnd(animation);
                    filter_section.setVisibility(View.GONE);
                }
            });
}
Kommentarer (5)