android - example - layout_collapsemode

Ocultar barra de herramientas en scroll con recyclerview dentro de fragmento

Question

Estoy tratando de colapsar la barra de herramientas cuando se desplaza una vista de reciclaje dentro de un fragmento. Para empezar, aquí está mi diseño principal:

<DrawerLayout>

     <RelativeLayout
        android:id="@+id/mainRelativeLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

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

            <android.support.design.widget.AppBarLayout
                android:id="@+id/appBarLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                >

                <Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    android:elevation="5dp"
                    app:layout_scrollFlags="scroll|enterAlways"
                    >

                </Toolbar>

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

            <FrameLayout
                android:id="@+id/container"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                />

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

    </RelativeLayout>

<!-- ignore -->
<drawercontents>
</DrawerLayout>

Entonces, como probablemente pueda adivinar, mis fragmentos se están cargando en @id/container . Mi primer fragmento contiene el recyclerview, y configuro app:layout_behavior="@string/appbar_scrolling_view_behavior" en ese recyclerview. Esto funciona, y la barra de herramientas se colapsa en el desplazamiento. El problema es que la barra de herramientas cubre los contenidos superiores del fragmento cuando no está contraído. Al agregar un margen superior al contenedor de fragmentos igual al tamaño de la barra de herramientas solo se deja un espacio en blanco cuando la barra de herramientas se colapsa (obviamente).

¿Qué falta aquí? ¿Algunas ideas?

EDITAR: según se solicitó, aquí está el diseño del fragmento que contiene el recyclerview:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView
    android:id="@+id/feed"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#00000000"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

Answer 1

Aún no he probado esto, pero esto es lo que debes hacer:

• Mueva la app:layout_behavior="@string/appbar_scrolling_view_behavior" al FrameLayout con el container id.
• Agregue android:fitsSystemWindows = "true" a su AppBarLayout .

Esto es exactamente lo que estoy haciendo en mi aplicación, y funciona. Si esto no funciona para usted, intente limpiar (en Android Studio, Build -> Clean Project ) su proyecto y vuelva a ejecutar la aplicación.

Answer 2

Cree un nombre de diseño como toolbar.xml e inclúyalo en su código donde desee usarlo, pero recuerde una cosa, no use ningún otro diseño como Relativelayout, Linearlayout y otros en la parte superior de

Answer 3

Mi amigo, hice esto hoy y trabajando perfectamente, tengo 2 fragmentos, ambos tienen RecyclerView y pueden desplazar la Toolbar . Miré chrisbanes''s CheeseSquare : CheeseSquare

Si MainActivity un vistazo a MainActivity , hay 3 fragmentos en TabLayout y todos ellos pueden desplazar la Toolbar . Así que preparé este diseño, tal vez eche un vistazo a:

mi activity_home.xml :

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <include layout="@layout/content_home"/>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:layout_gravity="start"
        app:menu="@menu/homepage_leftdrawer">


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

</android.support.v4.widget.DrawerLayout>

Y content_home.xml :

<?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/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme3.AppBarOverlay">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:layout_scrollFlags="scroll|enterAlways|snap" />


<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabTextColor="@color/Transparent_few_white"
    app:tabIndicatorColor="@color/White"
    app:tabTextAppearance="@style/TabLayoutTextStyle"
    app:tabIndicatorHeight="3dp"
    app:tabSelectedTextColor="@color/White"
    android:background="@color/ColorPrimary"
    app:tabPaddingStart="0dp"
    app:tabPaddingEnd="0dp"/>

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

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

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

¿Dónde está la clave aquí?

Si le ViewPager un vistazo a mi ViewPager , tiene el app:layout_behavior="@string/appbar_scrolling_view_behavior" es todo. No agregue ningún otro comportamiento en el fragmento. ¡Solo inténtalo así y ven con el resultado por favor!

Answer 4

Necesitas algo similar a la aplicación Play Store. Pegando los diseños aquí. El código para esto es fácil y puedes codificarlo por ti mismo.

1. FrameLayout
   • ImageView
   • ScrollView
     1. LinearLayout
     2. HorizontalScrollView
        • LinearLayout
   • Barra de herramientas

Con la jerarquía de diseño anterior puede lograr algo como esto:

Answer 5

Puede arreglar esto agregando una tercera layout_scrollFlags - snap , a la propiedad layout_scrollFlags .

<Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:elevation="5dp"
    app:layout_scrollFlags="scroll|enterAlways|snap" />

El uso de esta opción determinará qué hacer cuando una vista solo se ha reducido parcialmente. Si el desplazamiento finaliza y el tamaño de la vista se ha reducido a menos del 50% de su original, entonces esta vista volverá a su tamaño original. Si el tamaño es superior al 50% de su tamaño, desaparecerá por completo.

Revisa este link .

Answer 6

Puede utilizar el diseño Colapsar como

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapse_toolbar"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:fitsSystemWindows="true"
            app:contentScrim="@color/zxing_transparent"
            android:paddingBottom="2dip"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:expandedTitleGravity="bottom|center_horizontal"
            app:expandedTitleMarginBottom="50dip"
            app:collapsedTitleGravity="top|center_vertical"
            app:collapsedTitleTextAppearance="@style/collapseTitle">

            <Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    android:elevation="5dp"
                    app:layout_scrollFlags="scroll|enterAlways"
                    >
                </Toolbar>



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

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

  <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            />


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

Answer 7

También se topó con este problema. Pero se encontró una solución. La solución con retrabajo XML no puede ser, por lo que debe hacerlo mediante programación. Todo lo que necesitamos es Inflater . Sí, sí, eso es tan simple. Sobre la marcha cambiar xml para trabajar todo el desplazamiento.

Answer 8

Utilicé un SwipeRefreshLayout o solo un LinearLayout o RelativeLayout como la raíz del diseño del Fragment y está funcionando.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/swipe_refresh_layout_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/mycustomcolor"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.v4.widget.SwipeRefreshLayout>

Con RelativeLayout :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fragment2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view_android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true" 
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</RelativeLayout>

Entonces debería ser bueno para ir.

Answer 9

en su conjunto framelayout

android:layout_below="@+id/appBarLayout"

Si eso no funciona, intente esto:

android:layout_below="@+id/toolbar"

Answer 10

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:contentScrim="?attr/colorPrimary"
        >
        <android.support.v7.widget.Toolbar
            android:id="@+id/appBar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_collapseMode="pin" />

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_below="@+id/app_bar_layout"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:weightSum="1">
    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorAccent"
        >
        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent" 
            android:text="Your recycler view should go here"/>
        </FrameLayout>
</LinearLayout>

Answer 11

<?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:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/tabanim_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/tabanim_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways|snap"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>