Synchronizing Toolbar Height with ViewPager

Question

I have an activity with Toolbar and ViewPager, in the ViewPager there are three Fragments, every Fragment should set different height to the Toolbar which means when the 1st Fragment is the selected Fragment the Toolbar's height should be x and when the 2nd Fragment is selected toolbar height should be y and so.

Now I want the changing of toolbar height to be synchronized with ViewPager scrolling, any advice to do that?

Answer 1

Here is Output ..

For Sample Code https://github.com/msquare097/MFlex-toolbar ,....

First of all nice question and very interesting... and for implement it.
I have used toolbar minimum height by changing on viewpager scroll.

First of All just declare all Toolbar height respect to fragments in your activity where ViewPager is implemented.

I have just take it directly as Integer. You load it from dimen as DP and convert it to PX. In my ViewPager I have taken 4 fragment. So declaring 4 toolbar's height.

int heightForPage0 = 150;
int heightForPage1 = 400;
int heightForPage2 = 300;
int heightForPage3 = 600;

After setting up the adapter just add the listener

mViewPager.addOnPageChangeListener(this);

and override this all three method and write the below code..

@Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        Log.d(TAG,positionOffset+"");

        int currentHeight;
        int nextHeight;

        switch (position) {
            case 0:
                currentHeight = heightForPage0;
                nextHeight = heightForPage1;
                calculateHeightAndApply(currentHeight, nextHeight, positionOffset);
                break;
            case 1:
                currentHeight = heightForPage1;
                nextHeight = heightForPage2;
                calculateHeightAndApply(currentHeight, nextHeight, positionOffset);
                break;
            case 2:
                currentHeight = heightForPage2;
                nextHeight = heightForPage3;
                calculateHeightAndApply(currentHeight, nextHeight, positionOffset);
                break;
            case 3:
                // for last page we don't have to worry about it.
                // bcoz there is no next page available;
                break;
        }
    }

    @Override
    public void onPageSelected(int position) {}

    @Override
    public void onPageScrollStateChanged(int state) {}

and here is that magical method which i have called in onPageScrolled..

private void calculateHeightAndApply(int currentHeight, int nextHeight, float positionOffset) {
    if (positionOffset==0) {
        return;
    }
    int diff = nextHeight - currentHeight;
        int newHeight = (int) ((positionOffset*diff));
        mToolbar.setMinimumHeight(currentHeight+newHeight);
}