Pager centrado de la visión con la previsualización siguiente y anterior y pagetransformer
Estoy implementando un ViewPager que muestra los elementos siguientes y anteriores y también anima las transiciones de página usando ViewPager.PageTransformer. Tiene un efecto de zoom out y fade out. Para mostrar el siguiente y el anterior, estoy usando el PageMargin negativo, el relleno en el viewpager y el clipToPadding como falso. Así es como se ve
- No se puede cambiar la etiqueta del fragmento
- Actualizar imágenes en FragmentStatePagerAdapter al reanudar la actividad
- Añadiendo drawable a CirclePageIndicator
- Viewpager vertical en la más reciente biblioteca de soporte técnico de Android da errores
- ViewPager Actividad para notificar un fragmento de un evento específico
Que es lo que quiero. El problema es que PageTransform utiliza el borde izquierdo como referencia, es decir, muestra el zoom máximo cuando la imagen toca el borde izquierdo en lugar de cuando está en el centro. Para corregir esto, he utilizado un desplazamiento en el código de la siguiente manera
viewPager.setPageTransformer(false, new ViewPager.PageTransformer() { @Override public void transformPage(View page, float position) { if (position < -1) { page.setAlpha(0); } else if (position <= 1) { float scaleFactor = Math.max(0.7f, 1 - Math.abs(position - 0.14285715f)); page.setScaleX(scaleFactor); page.setScaleY(scaleFactor); page.setAlpha(scaleFactor); } else { page.setAlpha(0); } } });
He registrado el valor de posición cuando la imagen está en el centro y encontré el desplazamiento. Pero esta compensación sólo funciona en dispositivos xxhdpi. En xxxhdpi, el valor sale a 0.12068965f. Además, el desplazamiento cambia cuando cambio el relleno en ViewPager. Además, el tamaño de vista previa de los cambios siguientes y anteriores con dpi.
Pregunta
¿Cómo puedo calcular el relleno, el margen y sobre todo compensado para mantener un comportamiento coherente a través de diferentes dpis?
Código
Aquí está mi diseño donde estoy agregando viewpager y su relleno
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="400dp" android:clipToPadding="false" android:paddingLeft="40dp" android:paddingRight="40dp"> </android.support.v4.view.ViewPager> <Button android:id="@+id/swiper" android:text="Animate" android:layout_centerInParent="true" android:layout_below="@id/viewPager" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </RelativeLayout>
Aquí está el código de inicialización de viewpager:
final ViewPager viewPager = ((ViewPager) findViewById(R.id.viewPager)); Resources r = getResources(); float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 120, r.getDisplayMetrics()); viewPager.setPageMargin((int) (-1 * px)); viewPager.setOffscreenPageLimit(5);
- Cómo personalizar PagerTabStrip con stripDrawable y el espaciado
- ¿Cuál es la mejor manera de hacer imágenes deslizantes en cardview dentro de reciclador?
- Viewpager no funciona correctamente en lollipop 5.0 cuando uso otros fragmentos
- Deslizar un elemento a la vez
- ViewPager con múltiples instancias de fragmentos de la misma clase
- Edittext obtiene automáticamente el foco cuando se mueve entre páginas en un paginador de vista
- Despliegue de la disposición de la barra de herramientas con Viewpager dentro de NestedScrollView
- Indicación visual de sobre desplazamiento en android
Esto es lo que terminé con:
public class ZoomFadeTransformer implements ViewPager.PageTransformer { private float offset = -1; private float paddingLeft; private float minScale; private float minAlpha; public ZoomFadeTransformer(float paddingLeft, float minScale, float minAlpha) { this.paddingLeft = paddingLeft; this.minAlpha = minAlpha; this.minScale = minScale; } @Override public void transformPage(View page, float position) { if (offset == -1) { offset = paddingLeft / page.getMeasuredWidth(); } if (position < -1) { page.setAlpha(0); } else if (position <= 1) { float scaleFactor = Math.max(minScale, 1 - Math.abs(position - offset)); page.setScaleX(scaleFactor); page.setScaleY(scaleFactor); float alphaFactor = Math.max(minAlpha, 1 - Math.abs(position - offset)); page.setAlpha(alphaFactor); } else { page.setAlpha(0); } } }
Y lo pongo como
viewPager.setPageTransformer(false, new ZoomFadeTransformer(viewPager.getPaddingLeft(), MIN_SCALE, MIN_ALPHA));
- Cómo activar Internet continuamente en modo doze Marshmallow and Nougat
- ¿Dónde está la documentación del elemento `<attr>` de XML de recursos de Android?