阻止FloatingActionButton在ViewPager中滚动

时间:2015-07-04 09:40:05

标签: android android-layout

我有一个ViewPager,其中一个页面有一个FloatingActionButton。工具栏使用带有scroll|enterAlways的CoordinatorLayout,因此当用户滚动时它会消失。

这会导致FloatingActionButton最初不可见,并在用户滚动并且工具栏消失时滚动到视图中。

目的是让FAB始终固定在屏幕上。一个hacky想法是将它移动到包含ViewPager的布局中,但我只希望它在一个页面上。

这是顶级布局:

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent">

        <android.support.v7.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:id="@+id/new_toolbar"
            app:layout_scrollFlags="scroll|enterAlways"
            app:layout_collapseMode="pin"/>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:background="@color/primary"
            app:layout_scrollFlags="scroll|enterAlways"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

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

    <android.support.v4.view.ViewPager
        android:id="@+id/vp_main"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

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

非常简单 - 滚动视线的工具栏(滚动时立即返回)和视图寻呼机。

以下是ViewPager页面的相关布局:

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

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

    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="16dp"
        android:src="@drawable/ic_add_black_48dp"
        app:fabSize="normal"
        android:id="@+id/add" />
</FrameLayout>

我尝试了一些像app:layout_scrollFlags=""app:layout_behavior="android.support.design.widget.FloatingActionButton.Behavior"这样的随机愚蠢,但没有一个帮助 - 我想问题是FrameLayout的大小覆盖了没有工具栏的整个屏幕。什么是解决这个问题的最佳方法?

1 个答案:

答案 0 :(得分:0)

迟了一年,但也许会帮助那些正在寻找答案的人。

您应该将FAB声明移动到ViewPager下面的CoordinatorLayout,就像您提议的那样。然后,在您的主要活动类上,在OnPageChangeListener方法中向您的ViewPager实例添加onCreate

例如:

fab = (FloatingActionButton) findViewById(R.id.add);
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        //positions 0, 1, 2 = first tab, second tab, third tab respectively            
        if (position == 0 && positionOffset == 0)
            fab.show();
        else
            fab.hide();
    }

    @Override
    public void onPageSelected(int position) {

    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
});