阻止ViewPager中的NestedScrollView处理水平滚动

3
我正在尝试实现一个由CoordinatorLayout和ViewPager组成的视图,每个ViewPager内部都有NestedScrollView。我设法使工具栏在滚动时隐藏,但我遇到了以下问题:
每当我向左或向右滑动以更改视图页面的内容时,手势会转发到NestedScrollView,有时会注册非常小的垂直滚动。虽然很小,但足以令人烦恼。
这应该更好地解释了问题:

Example of behavior

视频:https://youtu.be/BGqynDDL68I

我尝试过扩展NestedScrollView来阻止滚动/快速滑动方法,但没有成功。

有人遇到过同样的问题吗?

编辑 1:代码

Activity:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="main.MainActivity"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--<include layout="@layout/main__activitycontent"/>-->

    <android.support.design.widget.AppBarLayout
        android:id="@+id/id_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/main__toolbar"
            android:fitsSystemWindows="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay"/>

    </android.support.design.widget.AppBarLayout>


    <FrameLayout
        android:id="@+id/main__fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        />

    <android.support.design.widget.TabLayout

        android:id="@+id/main__navigations_tablayout"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_gravity="bottom"
        android:background="@color/main__tabbar_button_color"
        app:layout_behavior="utils.views.TabLayoutBehaviour"
        app:tabIndicatorColor="@android:color/white"
        app:tabSelectedTextColor="@color/main__tabbar_selected_color"
        app:tabTextColor="@color/main__tabbar_normal_color"
        >


    </android.support.design.widget.TabLayout>

</android.support.design.widget.CoordinatorLayout>

带有ViewPager的片段

<android.support.v4.view.ViewPager
    android:id="@+id/meditationpager__pager"

    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    />

内部片段:

<android.support.v4.widget.NestedScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:fillViewport="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="main.MainActivity"
    tools:showIn="@layout/main__activity">

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"

        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        tools:context="domain.screens.readmeditation.MeditationFragment">


        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/large_text"/>

    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

只是一个提醒:底部栏与ViewPager无关,它是导航栏。 - Eduardo Bonet
从我所看到的来看,底部栏有一个“向下的勾”。我是对的吗? - royB
是的,工具栏也会稍微往上移动一点(底部栏的行为取决于工具栏,因此当工具栏移动时,底部栏会朝相反方向移动)。 - Eduardo Bonet
2个回答

2
我找到的最干净的解决方案是扩展 NestedScrollView 并覆盖 onTouch 事件,如下所示:
public class VerticalOnlyNestedScrollView extends NestedScrollView {
    private static final String TAG = "VOnlyNestedScrollView";
    public VerticalOnlyNestedScrollView(Context context) {
        super(context);
    }

    private float startX, startY;

    public VerticalOnlyNestedScrollView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public VerticalOnlyNestedScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }


    @Override
    public boolean onTouchEvent(MotionEvent ev) {

        if (!(ev.getAction()== MotionEvent.ACTION_DOWN)&& ev.getHistorySize() > 0) {


            float yVector = ev.getY() - ev.getHistoricalY(0);
            float xVector = ev.getX() - ev.getHistoricalX(0);
            Log.d(TAG, "onInterceptTouchEvent: " + xVector + "--" + yVector);

            return Math.abs(yVector) <= Math.abs(xVector) || super.onTouchEvent(ev);
        }

        return super.onTouchEvent(ev);
    }
}

这样,只有当yVector大于xVector时,父级onTouch才会被处理。


这段代码在这里运行得非常完美。你能提供更多的上下文吗? - Eduardo Bonet

1
尝试像这样更改您的Activity结构:

<?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.CoordinatorLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        tools:context="main.MainActivity"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <!--<include layout="@layout/main__activitycontent"/>-->

    <android.support.design.widget.AppBarLayout
        android:id="@+id/id_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/main__toolbar"
            android:fitsSystemWindows="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay"/>

    </android.support.design.widget.AppBarLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <android.support.v4.view.ViewPager
            android:id="@+id/meditationpager__pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <android.support.design.widget.TabLayout
            android:id="@+id/main__navigations_tablayout"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:layout_gravity="bottom"
            android:background="@color/main__tabbar_button_color"
            app:tabTextColor="@color/main__tabbar_normal_color"
            app:tabSelectedTextColor="@color/main__tabbar_selected_color"
            app:tabIndicatorColor="@color/white"/>

    </LinearLayout>

这样,您的带有视图翻页器的片段将不再必要,您可以使用以下方式设置视图:
private void setupViewPager() {
    MyAdapter adapter = new MyAdapter(getSupportFragmentManager());

    InnerFragment fragment = new InnerFragment();
    adapter.addFragment(fragment);

    mViewPager.setAdapter(adapter);
}

我相信采用这种方法,您就不需要设置NestedScrollView的layout_behavior。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接