animations - shared transition android

Fragmentos de ViewPager: transiciones de elementos compartidos

Question

Una aplicación que estoy desarrollando muestra una grilla de imágenes. Cuando toca una imagen, entra en la vista de detalles. La vista de detalles contiene una ViewPager que le permite deslizar entre cada imagen en la grilla. Esto se hace pasando una lista de rutas (que contiene cada imagen en la cuadrícula), junto con un desplazamiento de la imagen que se ha tocado para que ViewPager se pueda configurar para mostrar esa página inicialmente.

¿Cuál es la mejor manera de tener una transición de elementos compartidos dentro del Fragmento de la página de compensación actual en ViewPager? La imagen de cuadrícula (RecyclerView) debe expandirse a la imagen de pantalla completa en la página actual. Vi la posibilidad de posponer y reanudar las transiciones de actividad, por lo que la aplicación esperaría para mostrar la transición del elemento compartido hasta que la imagen se cargue desde el disco. Pero quiero poder animar a la página correcta en el buscapersonas y también salir a lo que sea que sea la página actual cuando el usuario retroceda (ya que puede pasar de una página a otra). Si desliza el dedo a una página diferente ahora, la página inicial es lo que se vuelve a anotar en la cuadrícula.

Actualmente, asigno cada imagen en los Fragmentos del buscapersonas con un transitionName en el formato "image_ [index]". Cuando comienzo la actividad de detalles, uso el mismo transitionName con el índice siendo el desplazamiento.

Relacionado con esto, también me preguntaba cómo hacer que las ondulaciones funcionen con presiones largas. Cuando cambias el estado activado de una vista, parece cancelar la onda. Quiero un efecto similar a Gmail, donde la onda expansiva comienza de nuevo y termina rápidamente después de que se completa una pulsación larga y desencadena el estado activado.

Answer 1

Supongo que está utilizando Transiciones de Fragmentos y que no está animando entre Actividades. Es posible tanto en las transiciones de actividad como en las transiciones de fragmentos, pero el código específico es un poco diferente. Sin embargo, el posponer no está disponible en Transiciones de Fragmentos.

AddSharedElement toma un segundo parámetro. Si conoce el nombre específico en el fragmento de destino cuando lo llama, puede simplemente elegir el nombre en el fragmento de detalles para usar. Si no lo hace, puede elegir el nombre que desee y reasignarlo con SharedElementCallback establecido en el Fragmento.

fragment.setEnterSharedElementCallback(new SharedElementCallback() {
@Override
public void onMapSharedElements(List<String> names, Map<String, View> sharedElements) {
sharedElements.put("detailView", mTargetDetailView);
}
});

Si no coincide en el camino de regreso, se realiza la misma llamada para reasignarlo. Es probable que esto ocurra tanto en el fragmento de llamada como en el fragmento llamado: en el fragmento de llamada, utiliza setExitSharedElementCallback. Espero que este sea el caso en tu aplicación.

Del mismo modo, en Transiciones de actividad, establece el mismo SharedElementCallback y usa el mismo mapeo, pero lo hace en la actividad.

Answer 2

Por lo que puedo decir (y corrígeme si estoy equivocado), lo que estás tratando de lograr es básicamente algo como esto: supongamos que tienes una MainActivity , una actividad de detalles y un conjunto arbitrario de imágenes. MainActivity muestra el conjunto de imágenes en una cuadrícula y DetailsActivity muestra el mismo conjunto de imágenes en una ViewPager horizontal. Cuando el usuario selecciona una imagen en MainActivity , esa imagen debe pasar de su posición en la cuadrícula a la página correcta en la segunda actividad de ViewPager .

El problema que queremos resolver es "¿y si el usuario cambia de página dentro de DetailsActivity "? Si esto sucede, queremos cambiar la imagen compartida que se utilizará durante la transición de devolución. De forma predeterminada, el marco de transición de actividad usará el elemento compartido que se utilizó durante la transición de entrada ... pero la página del buscapersonas ha cambiado, por lo que obviamente queremos anular este comportamiento de alguna manera. Para hacerlo, necesitaremos establecer SharedElementCallback en sus MainActivity y MainActivity onCreate() y anular el método onMapSharedElements() manera:

private final SharedElementCallback mCallback = new SharedElementCallback() {
@Override
public void onMapSharedElements(List<String> names, Map<String, View> sharedElements) {
if (mCurrentImagePosition != mOriginalImagePosition) {
View sharedView = getImageAtPosition(mCurrentImagePosition);
names.clear();
sharedElements.clear();
names.add(sharedView.getTransitionName());
sharedElements.put(sharedView.getTransitionName(), sharedView);
}
}
/**
* Returns the image of interest to be used as the entering/returning
* shared element during the activity transition.
*/
private View getImageAtPosition(int position) {
// ...
}
};

Para una solución más completa, he creado un proyecto de muestra en GitHub que logrará este efecto (hay demasiado código para publicar en una sola respuesta de ).