Efecto de cabecera de Parallax con RecyclerView

Quiero cambiar mi ListView que tengo actualmente para usar RecyclerView así que puedo hacer uso de StaggeredGridLayoutManager pero RecyclerView no tiene la capacidad de agregar una cabecera como ListView.

Normalmente con un ListView establezco una vista vacía en el encabezado y pongo la imagen debajo de la vista de lista y traduce la imagen inferior con el desplazamiento de la lista para crear el efecto Parallax .

Así que con un encabezado ¿cómo puedo crear el mismo efecto de paralaje con RecyclerView ?

Así que hoy he intentado archivar ese efecto en un RecyclerView . Yo era capaz de hacerlo, pero como el código es demasiado me pego aquí mi proyecto github y voy a explicar algunos de los puntos clave del proyecto.

https://github.com/kanytu/android-parallax-recyclerview

Primero tenemos que mirar getItemViewType en la clase RecyclerView.Adapter . Este método define el tipo de vista con el que estamos tratando. Ese tipo será pasado encendido onCreateViewHolder y allí podemos inflar diversas visiónes. Así que lo que hice fue: comprobar si la posición es la primera. Si es así entonces infle la cabecera, si no infla una fila normal.

También he añadido un CustomRelativeLayout que CustomRelativeLayout la vista para que no tengamos problemas con los divisores y con las filas encima de la cabecera.

A partir de este punto parecen saber el resto de la lógica detrás de él.

El resultado final fue:

Introduzca aquí la descripción de la imagen

EDITAR:

Si necesita insertar algo en el adaptador, asegúrese de notificar la posición correcta agregando 1 en el método notifyItemChanged/Inserted . Por ejemplo:

 public void addItem(String item, int position) { mData.add(position, item); notifyItemInserted(position + 1); //we have to add 1 to the notification position since we don't want to mess with the header } 

Otra edición importante que he hecho es la lógica de desplazamiento. El sistema mCurrentOffset que estaba utilizando no funcionó con la inserción de elementos ya que el desplazamiento cambiará si agrega un elemento. Así que lo que hice fue:

 ViewHolder holder = findViewHolderForPosition(0); if (holder != null) ((ParallaxRecyclerAdapter) getAdapter()).translateHeader(-holder.itemView.getTop() * 0.5f); 

Para probar esto he añadido un postDelayed postDelayed, iniciado la aplicación, desplazado hasta el final, añadir el elemento en la posición 0, y desplácese hacia arriba de nuevo. El resultado fue:

Introduzca aquí la descripción de la imagen

Si alguien está buscando otros efectos de paralaje pueden comprobar mi otro repo:

https://github.com/kanytu/android-parallax-listview

La manera más fácil de hacerlo, está usando debajo onScrollListener sin depender de ninguna biblioteca.

 View view = recyclerView.getChildAt(0); if(view != null && recyclerView.getChildAdapterPosition(view) == 0) { view.setTranslationY(-view.getTop() / 2);// or use view.animate().translateY(); } 

Asegúrese de que su segundo elemento viewHolder tenga un color de fondo que coincida con el fondo del cajón / actividad. Por lo que el desplazamiento parece paralaje.

Esta respuesta es para aquellos curiosos sobre la adición de un encabezado de paralaje a un GridLayoutManager o un StaggeredGridLayoutManager

Deberá agregar el código siguiente a su adaptador en onBindViewHolder o onCreateViewHolder

 StaggeredGridLayoutManager.LayoutParams layoutParams = (StaggeredGridLayoutManager.LayoutParams) holder.itemView.getLayoutParams(); layoutParams.setFullSpan(true); 

Para kotlin, puede configurar la vista del reciclador como a continuación

 //setting parallax effects recyclerView.addOnScrollListener(object :RecyclerView.OnScrollListener(){ override fun onScrolled(recyclerView: RecyclerView?, dx: Int, dy: Int) { super.onScrolled(recyclerView, dx, dy) val view = recyclerView?.getChildAt(0) if (view != null && recyclerView?.getChildAdapterPosition(view) === 0) { val imageView = view.findViewById(R.id.parallaxImage) imageView.translationY = -view.top / 2f } } }) 
  • No hay animación en la eliminación de artículos en RecyclerView
  • ¿Cómo tener un ListView / RecyclerView dentro de un RecyclerView padre?
  • Coloque el elemento de la lista del titular como facebook para cargar contenido
  • RecyclerVer elementoClickListener en Kotlin
  • ¿Cuál es el equivalente listview.setSelection en caso de Recycler View
  • Reemplazar ListView con RecyclerView
  • Cómo redimensionar el visor en un RecyclerView
  • Recyclerview Sin adaptador conectado; Saltar el diseño
  • Detectar clic en RecyclerView fuera de los elementos
  • RecyclerView no se muestra
  • RecyclerView cortar el último artículo
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.