Scrolling effect with multiple viewpagers

Question

I have a concept for a view. Please guide me as to how I can achieve it. Please check the wireframe.

Answer 1

I use fragment container layout instead viewpager with FadingActionBar. Also i use MaterialTabs library.

Content layout

Activity

        @Override
            protected void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);

                FadingActionBarHelper helper = new FadingActionBarHelper()
                        .actionBarBackground(R.color.actionbar_background)
                        .headerLayout(R.layout.actionbar_header)
                        .contentLayout(R.layout.content_layout);
                final View root = helper.createView(this);
                setContentView(root);
                helper.initActionBar(this);
 mTabHost = (MaterialTabHost) view.findViewById(R.id.materialTabHost);
        //.......
        }
     @Override
        public void onTabSelected(MaterialTab materialTab) {
            int position = materialTab.getPosition();
            switch (position) {
                case 0:
                    switchFragment(new ProfileFragment(), position);
                    break;
                case 1:
                    switchFragment(new NotificationFragment(), position);
                    break;
            }
            mTabHost.setSelectedNavigationItem(position);
        }

Finally a have this result: link(gif)