Binoy Babu
Binoy Babu

Reputation: 17139

ViewPropertyAnimator - animation wouldn't happen the first time

I'm using the following code for a slide in / slide out toggle for an AppBarLayout.

public void showToolbar(boolean show) {
    if (appBar == null) {
        Log.e(TAG, "showToolbar: Toolbar is null");
        return;
    }
    boolean toolbarShown = Utils.isViewVisible(appBar);
    Log.d(TAG, "showToolbar: shown:" +shown);
    boolean changed = (show != toolbarShown);
    if (changed) {
        if (show) {
            Log.d(TAG, "showToolbar: showing");
            appBar.setVisibility(View.VISIBLE);
            appBar.animate()
                    .translationY(0)
                    .setInterpolator(new DecelerateInterpolator())
                    .setListener(new Animator.AnimatorListener() {
                        @Override
                        public void onAnimationStart(Animator animator) {
                            appBar.setVisibility(View.VISIBLE);
                        }

                        @Override
                        public void onAnimationEnd(Animator animator) { }

                        @Override
                        public void onAnimationCancel(Animator animator) { }

                        @Override
                        public void onAnimationRepeat(Animator animator) { }
                    })
                    .start();
        } else {
            Log.d(TAG, "showToolbar: hiding");
            appBar.animate()
                    .translationY(-toolbar.getBottom())
                    .setInterpolator(new DecelerateInterpolator())
                    .setListener(new Animator.AnimatorListener() {
                        @Override
                        public void onAnimationStart(Animator animator) { }

                        @Override
                        public void onAnimationEnd(Animator animator) {
                            appBar.setVisibility(View.INVISIBLE);
                        }

                        @Override
                        public void onAnimationCancel(Animator animator) { }

                        @Override
                        public void onAnimationRepeat(Animator animator) { }
                    })
                    .start();
        }
    } else {
        Log.d(TAG, "showToolbar: no change");
    }
}

The animation works perfectly except for the first time showToolbar(true) is called to show the toolbar. The view just shows up without animation the first time. I have scoured the site and found similar questions but the solutions doesn't seem to be working for me.

It might be worth noting that this happens only when we want the appBar to be hidden first. My guess is that maybe for the animation to

Update 1:

public static boolean isViewVisible(View view) {
    if (View.VISIBLE == view.getVisibility()) return true;
    else return false;
}

Update 2

I have removed isViewWithinScreenBounds() method because that check isn't really needed.

Upvotes: 3

Views: 1168

Answers (2)

Bartek Lipinski
Bartek Lipinski

Reputation: 31468

Be sure to set the initial values for visibility and translationY.

If you want your toolbar to be initially hidden and show up with the first animation, be sure to set android:visibility="invisible" and NOT "gone", and negative android:translationY like -56dp.

Upvotes: 1

Rzodkiewka
Rzodkiewka

Reputation: 410

Try with this

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:translationY="-120dp"
    android:layout_height="120dp">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="SOME TEXT HERE" />
    </android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>

Activity code

@BindView(R.id.app_bar)
AppBarLayout appBar;
@BindView(R.id.toolbar)
Toolbar toolbar;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.some_layout);
    ButterKnife.bind(this);

    setSupportActionBar(toolbar);

    new Handler().postDelayed(new Runnable() {
        @Override
        public void run() {
            animateToolbar(false); //Just for testing purpose - delay execute of function animateToolbar() for 4 seconds
        }
    }, 4000);

}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    animateToolbar(true);
    return super.onCreateOptionsMenu(menu);
}

private void animateToolbar(boolean show) {

    if (show) {
        // As you can see in the xml layout initial position of the appBar is translated by its height to the top of the screen "-" sign
        // Slide int from out of the screen to initial position -> from -120 dp (height of the app bar, see xml) to 0 dp 
        appBar.animate()
                .translationY(0)
                .setDuration(1000)
                .start(); 

    } else {
        // Slide out from initial position to the top of the screen -> from 0 dp to -120 dp (height of the app bar, see xml)
        appBar.animate()
                .translationY(-appBar.getHeight())
                .setDuration(1000)
                .start();
    }
}

Upvotes: 1

Related Questions