ListView superpone otro diseño al desplazarse

En realidad no sé cómo se llama correctamente – superposición, paralaje o slideUP, lo que sea, tengo una Actividad llamada "cafe details" que presenta un Contenedor (LinearLayout) con información de encabezado (nombre, precio min, tiempo de entrega min etc.) y Otro contenedor (ViewPager) que contiene un ExpandableListView con algo de información (menús y platos) y todo lo que quiero hacer es deslizar mi Viewpager cuando se desplaza listview a la posición Y específica para cubrir (o superponer) la información del encabezado.

Mi foto

Un efecto similar (pero con paralaje que no necesito usar) se parece a esto

Efecto similar

Puedo detectar cuando el usuario que desplaza el listview abajo o para arriba pero cómo puedo mover el contenedor con ViewPager para cubrir el otro contenedor? Por favor, dame ideas, saludos.

UPD He intentado un gran número de maneras de implementarlo y todos ellos desafortunadamente no son adecuados. Así que ahora he venido a la siguiente variante – añadir scroll escucha a ListView, calcular scrollY posición de la vista y luego sobre la base de que mover el viewpager en el eje y llamando a setTranslationY (); Aquí hay algún código

1) fragmento de ViewPager

mListView.setOnScrollListener(new AbsListView.OnScrollListener() { @Override public void onScrollStateChanged(AbsListView absListView, int i) { } @Override public void onScroll(AbsListView absListView, int i, int i1, int i2) { if (getActivity() != null) { ((MainActivity) getActivity()).resizePagerContainer(absListView); } } }); 

2) MainActivity

 //object fields int previousPos; private float minTranslation; private float minHeight; <--------somewhere in onCreate minTranslation = - (llVendorDescHeaders.getMeasuredHeight()+llVendorDescNote.getMeasuredHeight()); //llVendorDescHeaders is linearLayout with headers that should be hidden //lVendorDescNote is a textView on green background; minHeight = llVendorDescriptionPagerContainer.getMeasuredHeight(); //llVendorDescriptionPagerContainer is a container which contains ViewPager ---------> public void resizePagerContainer(AbsListView absListView){ final int scrollY = getScrollY(absListView); if (scrollY != previousPos) { final float translationY = Math.max(-scrollY, minTranslation); llVendorDescriptionPagerContainer.setTranslationY(translationY); previousPos = scrollY; } } private int getScrollY(AbsListView view) { View child = view.getChildAt(0); if (child == null) { return 0; } int firstVisiblePosition = view.getFirstVisiblePosition(); int top = child.getTop(); return -top + firstVisiblePosition * child.getHeight() ; } 

Esta solución sencilla desafortunadamente tiene un problema – está parpadeando y temblando (no sé cómo llamar a la derecha) cuando se desplaza lentamente. Así que en lugar de setTranslationY () he utilizado un objectAnimator:

 public void resizePagerContainer(AbsListView absListView){ ............. ObjectAnimator moveAnim = ObjectAnimator.ofFloat(llVendorDescriptionPagerContainer, "translationY", translationY); moveAnim.start(); .............. } 

No me gusta esta solución porque 1) de todos modos se cambia el tamaño de viewpager con demora, no de forma instantánea 2) No creo que sea buena idea crear objetos ObjectAnimator muchos siempre cada vez que desplazo mi listView. Necesita su ayuda y nuevas ideas. Saludos.

¿Has probado CoordinatorLayout de la nueva biblioteca de soporte de diseño de android? Parece que es lo que necesitas. Compruebe este video desde 3:40 o esta entrada del blog .

Estoy suponiendo que usted está desplazando el encabezado superior (el ImageView es un niño del encabezado) basado en el scrollY del ListView / ScrollView, como se muestra abajo:

 float translationY = Math.max(-scrollY, mMinHeaderTranslation); mHeader.setTranslationY(translationY); mTopImage.setTranslationY(-translationY / 3); // For parallax effect 

Si desea pegar el encabezado / imagen a una determinada dimensión y continuar con el desplazamiento sin moverlo más, entonces puede cambiar el valor de mMinHeaderTranslation para lograr ese efecto.

 //change this value to increase the dimension of header stuck on the top int tabHeight = getResources().getDimensionPixelSize(R.dimen.tab_height); mHeaderHeight = getResources().getDimensionPixelSize(R.dimen.header_height); mMinHeaderTranslation = -mHeaderHeight + tabHeight; 

Los fragmentos de código anteriores están en referencia a mi demo, pero creo que sigue siendo bastante general para usted.

Si estás interesado puedes consultar mi demo https://github.com/boxme/ParallaxHeaderViewPager

  • ¿Cómo capturar eventos onTouch en dos vistas superpuestas?
  • Barra de navegación de Android superpuesta a mi vista
  • Superponer un color sobre una vista
  • ¿Cómo superponer el color del texto del elemento de la lista en una región específica?
  • Cómo forzar mezcla alfa en un videoview
  • Dibujo sobre otras aplicaciones en Android
  • Animación de superposición de Facebook
  • Emular el botón Atrás con superposición en Android
  • Imagen sobre otra imagen Android
  • Android: Combina dos vistas de imagen superpuestas en un bmp con la posición correcta
  • Android: ¿Cómo overlay-a-bitmap / draw-over un mapa de bits?
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.