使用 listview 滚动动态更改 viewpager 和 viewpager 项目大小

Question

我在viewpager 下方有一个listview，在初始状态（没有滚动任何内容时），viewpager 仅显示一个项目，其下一个和上一个项目的“预览”为 10dp（我有通过设置负页边距来实现这一点：viewPager.setPageMargin(-48);)。我想做的是，向下滚动listview：

1) listview 应该向上“推”viewpager，将其高度降低到某个点。到达该点时（viewpager 的一些 minHeight），listview 应该正常滚动，其上方是较小尺寸的viewpager。

2) viewpager 中的下一个和上一个项目应该拉到里面（朝向中心项目）并且在最终状态下，viewpager 的 三个 项目应该完全显示。 （下面的图片来说明这一点）

向上滚动列表视图应该相反。

我已成功完成任务的第 (1) 部分。这是代码

我的viewpager 和listview 在FrameLayout 中，如下所示：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:showIn="@layout/activity_main" tools:context=".MainActivity">

<ListView
    android:id="@+id/listView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:dividerHeight="1dp"
    android:divider="#000000"
    android:scrollbars="none" />


<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:background="#FFFFFF"/>

</FrameLayout>

我通过将transaprent 标题视图添加到listview 并使headeview 和viewpager 的高度相同，“伪造”listview 低于viewpager。这是代码的sn-p：

screenWidth = // Screen width of the phone
headerHeight = // Required height of the viewpager and the headerview

headerView = inflater.inflate(R.layout.fake_list_header, listView, false);
headerView.getLayoutParams().height = headerHeight;
headerView.getLayoutParams().width = screenWidth;
viewPager.getLayoutParams().height = headerHeight;
viewPager.getLayoutParams().width = screenWidth;
viewPager.setPageMargin(negativeMargin);
listView.addHeaderView(headerView, null, false);

// Other initializations and stuff

fake_list_header 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

</LinearLayout>

最后，我的listview OnScrollListener 负责根据listview 的滚动量调整viewpager 的高度，并在达到@ 的最小高度时停止987654352@:

    OnScrollListener() {
        @Override
        public void onScrollStateChanged(AbsListView absListView, int i) {


        }

        @Override
        public void onScroll(AbsListView absListView, int i, int i1, int i2) {

            if (listview.getFirstVisiblePosition() == 0) {
                View firstChild = listview.getChildAt(1);   // 0th element is the fake headerview itself
                int topY = 0;
                if (firstChild != null) {
                    topY = firstChild.getTop();

                    FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(
                            RelativeLayout.LayoutParams.MATCH_PARENT,
                            RelativeLayout.LayoutParams.WRAP_CONTENT);

                    layoutParams.width = screenWidth;
                    layoutParams.height = topY;

                    if (topY < headerHeight && topY >= minHeight) {
                        // minHeight is the minimum height the viewpager takes, after this point it stops getting smaller 
                        //And vice-versa with headerHeight taking care of the maximum height the viewpager can take

                        viewpager.setLayoutParams(layoutParams);                          
                    }
                }


            }

        }
    }

我任务的第 (2) 部分是我卡住的地方（并且没有想法），我尝试使用滚动更改 pageMargin 的 viewpager，但结果并不好（也不要认为这是实现此类目标的正确方法）。通过使用滚动调用 setTranslationX 在寻呼机中设置下一个（或上一个）视图的 X 位置也不起作用。

以下是我想要达到的目标的一些模拟：

初始状态（无滚动）

最终状态（viewpager 达到的 minHeight）

正在使用viewpager 和listview 实现这样的事情的正确方法吗？我曾想过使用水平的recyclerview 而不是viewpager，但我需要viewpager 的“逐页”滚动行为来水平滚动/滑动项目。欢迎任何建议

Answer 1

在你的主布局中试试这个

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:showIn="@layout/activity_main" tools:context=".MainActivity">

    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:dividerHeight="1dp"
        android:layout_below="@+id/pager"
        android:divider="#000000"
        android:scrollbars="none" />


    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:clipToPadding="false"
        android:background="#FFFFFF"/>

</RelativeLayout>