postalservice14
postalservice14

Reputation: 2534

Android: LinearLayout addView Animation

I currently have a working Android program that programmatically adds views to a LinearLayout. I would like those views to be animated in and cannot find any good resources on figuring out how to do this.

Could someone point me in the right direction?

Upvotes: 20

Views: 16773

Answers (4)

PEHLAJ
PEHLAJ

Reputation: 10136

Try

1. Add view to linear layout

linearLayout.addView(customView);

2. Add slide_up.xml to res/anim folder

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">

  <translate
    android:duration="500"
    android:fromYDelta="100%"
    android:toYDelta="0%" />
</set>

3. Apply animation right after adding view

Animation animation = AnimationUtils.loadAnimation(context, R.anim.slide_up);
customView.startAnimation(animation);

If you want to animate views one by one, then use following lines

new Handler(Looper.getMainLooper()).postDelayed(new Runnable() {
        @Override
        public void run() {
            linearLayout.addView(customView);
            Animation animation = AnimationUtils.loadAnimation(context, R.anim.slide_up);
           customView.startAnimation(animation);
        }
 }, 500);

Upvotes: 7

azizbekian
azizbekian

Reputation: 62209

That can be done with Scenes and Transitions API.

Framework gives us three Transition types out of the box: Fade, Slide and Explode, but you can also create your custom type of transition extending Visibility class and overriding appropriate methods.

So, having any ViewGroup, we can do this:

viewGroup.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(final View v) {
        Transition t = null;
        if (i == 1) {
            t = new Fade();
        } else if (i == 2) {
            t = new Slide(Gravity.BOTTOM);
        } else if (i == 3) {
            t = TransitionInflater.from(v.getContext())
                                  .inflateTransition(R.transition.my_transition);
        }

        Button button = new Button(v.getContext());
        button.setText("My button " + i++);

        TransitionManager.beginDelayedTransition(customLayout, t);
        viewGroup.addView(button);
    }
});

Where my_transition.xml is following:

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"
               android:duration="3000"
               android:interpolator="@android:interpolator/fast_out_slow_in">

    <fade/>
    <slide android:slideEdge="bottom"/>

</transitionSet>

We'll get this result:

enter image description here

Note, that we have to perform TransitionManager.beginDelayedTransition() before any change to layout has been made (i.e. before addView() is called). Then framework will take care of the rest.

There is also another overload TransitionManager.beginDelayedTransition(ViewGroup), where you do not need to specify what exact transition you want to be applied, and system will perform AutoTransition animation, which basically will fade and change boundaries of animated view.


Update sum up from conversation in comments

Framework's TransitionManager is available from API 19, and fully supported from API 21 (by saying fully I mean e.g. Slide transition is available from API 21). Although there is support package available, but it doesn't backport all the functionality. Alternatively, you can move to TransitionsEverywhere library, which backports everything up to Android 4.0.

Upvotes: 18

Francesco Pez
Francesco Pez

Reputation: 676

It's a very old question, but still interesting: you can use the attribute android:animateLayoutChanges="true"

For example:

<LinearLayout

                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:animateLayoutChanges="true"
               />

Upvotes: 27

Nam Ngo
Nam Ngo

Reputation: 2163

You can use ViewFlipper and set animations from there, you can take a look at this tutorial . Good luck.

Upvotes: -1

Related Questions