Oleg
Tengo un diseño como el siguiente:
(Barra de herramientas, Vista de encabezado, Vista de texto, RecyclerView)
Necesito que el encabezado se contraiga cuando me desplazo por los elementos de recyclerview. Para que la vista “Elegir elemento” y la vista del reciclador queden en la pantalla.
Vi ejemplos cuando la barra de herramientas está colapsada, pero necesito que la barra de herramientas esté presente siempre.
¿Qué diseños/comportamiento debo usar para hacer este trabajo?
Konstantin Loginov
Puedes lograrlo teniendo este diseño:
<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:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!-- HEADER -->
<RelativeLayout
...
app:layout_collapseMode="parallax">
.....
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
<!-- IF YOU WANT TO KEEP "Choose Item" always on top of the RecyclerView, put this TextView here
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="choose item" />
-->
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Fijas tu barra de herramientas haciendo que el app:layout_collapseMode="pin"
conjunto de propiedades Tú haces RecyclerView
correctamente desplazable configurando app:layout_behavior="@string/appbar_scrolling_view_behavior"
y eso es todo.
¡NÓTESE BIEN! Posición de “Elegir elemento” TextView
depende del comportamiento particular que desee lograr:
- puedes incluirlo como primer elemento de tu
RecyclerView
‘sAdapter
para desplazarlo, una vez que el usuario comience a desplazarse por elRecyclerView
; - puedes agregarlo a
AppBarLayout
para que siempre se pegue encima delRecyclerView
siempre que lo desplaces o no;
Puede leer más aquí Biblioteca de soporte de diseño de Android y aquí Biblioteca de soporte de diseño (III): diseño del coordinador
¡Espero que ayude!
-
¿Seguirá funcionando si agregamos una vista de desplazamiento o NestedScrollView en lugar de una vista de reciclaje en la parte inferior? También estoy pensando en tener varias vistas de recicladores dentro de la vista de desplazamiento con encabezados fijos. ¿Eso funcionará?
– VeeyaaR
15 de julio de 2021 a las 7:30
-
Ojalá hubiera encontrado esta solución pronto, está funcionando perfectamente. todavía ahorras mi tiempo. Gracias 🙂
– Rucha Bhat Joshi
27 de julio a las 9:55
maní
El código a continuación funciona, pero no es fácil comparar el desplazamiento con la vista del reciclador regular, pensé.
<?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"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<com.sliderbanner.views.BannerSlider
android:id="@+id/banner_slider1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:animateIndicators="true"
app:defaultIndicators="dash"
app:interval="5000"
app:loopSlides="true"
/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize">
<ImageView
android:id="@+id/image_github"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_gravity="right"
android:layout_marginRight="8dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fontFamily="sans-serif-bold"
android:gravity="center_vertical|left"
android:text="Banner Slider"
android:textColor="@android:color/black"
android:textSize="18sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
</android.support.v7.widget.RecyclerView>
</android.support.design.widget.CoordinatorLayout>