CoordinatorLayout滚动和固定

时间:2016-02-01 08:42:43

标签: android android-viewpager android-coordinatorlayout android-appbarlayout android-collapsingtoolbarlayout

我有 1。工具栏, 2。 ViewPager, 3。 TabLayout, 4. 小ViewPager, 5. ViewPager for Fragment具有RecyclerView:)

enter image description here

期望:当滚动下面的 5。 ViewPager中的RecyclerView时,1.Toolbar,3.TabLayout,4.ViewPager必须固定且仅2.ViewPager应该滚动,如下所示:

enter image description here

问题:我不仅可以固定2.ViewPager而不固定1.Toolbar。所以它就像是,我将1.Toolbar和2.ViewPager都固定,或者都没有。

enter image description here

问题:如何在滚动时隐藏2.ViewPager?

代码:

<?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"
    android:id="@+id/coordinatorLayoutFeedNew"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/color_white"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbarLayoutFeedNew"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/color_white"
        android:fitsSystemWindows="true">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbarFeedNew"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@drawable/toolbar_shadow"
            android:gravity="center_horizontal"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

            <ImageView
                android:id="@+id/toolbarLogoFeedNew"
                android:layout_width="wrap_content"
                android:layout_height="32dp"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/fenerbahce_logo" />

        </android.support.v7.widget.Toolbar>

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPagerTopFeedNew"
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:background="@drawable/mavi_bg_gradient"
            app:layout_scrollFlags="scroll|enterAlways" />

        <LinearLayout
            android:id="@+id/layoutTabAndSkor"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/haberler_bg"
            android:orientation="vertical">

            <android.support.design.widget.TabLayout
                android:id="@+id/tabLayoutFeedNew"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/genel_haberler_bant"
                app:tabGravity="fill"
                app:tabMode="scrollable"
                app:tabSelectedTextColor="@color/color_light_gray"
                app:tabTextAppearance="@style/tabLayoutTextAppearance"
                app:tabTextColor="@color/color_white" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="58dp"
                android:background="@null"
                android:orientation="vertical">


                <android.support.v4.view.ViewPager
                    android:id="@+id/viewPagerSkorFeedNew"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_weight="1"
                    android:background="@null" />

                <com.viewpagerindicator.CirclePageIndicator
                    android:id="@+id/circleIndicatorFeedNew"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    android:background="@null"
                    android:paddingBottom="4dp"
                    android:paddingTop="4dp"

                    app:fillColor="@color/color_white"
                    app:pageColor="#bbbbbb"
                    app:strokeColor="#bbbbbb" />
            </LinearLayout>
        </LinearLayout>

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

    <com.pordiva.coreproject.component.NonSwipableViewPager
        android:id="@+id/viewPagerPostsFeedNew"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/color_white"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

2 个答案:

答案 0 :(得分:0)

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbarLayoutFeedNew"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/color_white"
    android:fitsSystemWindows="true">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbarFeedNew"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@drawable/toolbar_shadow"
        android:gravity="center_horizontal"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        <ImageView
            android:id="@+id/toolbarLogoFeedNew"
            android:layout_width="wrap_content"
            android:layout_height="32dp"
            android:layout_gravity="center"
            android:gravity="center"
            android:src="@drawable/fenerbahce_logo" />

    </android.support.v7.widget.Toolbar>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPagerTopFeedNew"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:background="@drawable/mavi_bg_gradient"
        app:layout_scrollFlags="scroll|enterAlways" />      
</android.support.design.widget.AppBarLayout>

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

   <LinearLayout
        android:id="@+id/layoutTabAndSkor"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/haberler_bg"
        android:orientation="vertical">

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayoutFeedNew"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/genel_haberler_bant"
            app:tabGravity="fill"
            app:tabMode="scrollable"
            app:tabSelectedTextColor="@color/color_light_gray"
            app:tabTextAppearance="@style/tabLayoutTextAppearance"
            app:tabTextColor="@color/color_white" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="58dp"
            android:background="@null"
            android:orientation="vertical">


            <android.support.v4.view.ViewPager
                android:id="@+id/viewPagerSkorFeedNew"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@null" />

            <com.viewpagerindicator.CirclePageIndicator
                android:id="@+id/circleIndicatorFeedNew"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:background="@null"
                android:paddingBottom="4dp"
                android:paddingTop="4dp"

                app:fillColor="@color/color_white"
                app:pageColor="#bbbbbb"
                app:strokeColor="#bbbbbb" />
        </LinearLayout>
    </LinearLayout>

<com.pordiva.coreproject.component.NonSwipableViewPager
    android:id="@+id/viewPagerPostsFeedNew"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/color_white" />

答案 1 :(得分:0)

如果我说得不对,你可以CollapsingToolbarLayout使用这个标志:

app:layout_scrollFlags="scroll|exitUntilCollapsed" 

其中说:

  

滚动视图,然后折叠后退出(或者你的目的,隐藏它   倒塌之后。)

以下是一个很好的例子:https://github.com/TheLittleNaruto/SupportDesignExample

只需将您的内容放入其中,然后它就会隐藏或退出该视图。我认为这就是您要找的内容。

编辑:将其与您自己的实施一起使用。

实际上是这样的:

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

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbarFeedNew"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

            <!--Perhaps a ViewPager-->

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

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayoutFeedNew"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:color/darker_gray"
            app:tabMode="scrollable" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="58dp"
            android:background="@null"
            android:orientation="vertical">

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPagerSkorFeedNew"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@null" />

           <com.viewpagerindicator.CirclePageIndicator
                android:id="@+id/circleIndicatorFeedNew"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:background="@null"
                android:paddingBottom="4dp"
                android:paddingTop="4dp"
                app:fillColor="@color/color_white"
                app:pageColor="#bbbbbb"
                app:strokeColor="#bbbbbb" />

        </LinearLayout>

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

希望有所帮助。