2011-01-27 22 views
232

¿Cómo se debe implementar el tipo de deslizamiento que, por ejemplo, utiliza el cliente Honeycomb Gmail?Android Fragments and animation

Puede TransactionManager manejar esto automáticamente por adición y eliminación de los fragmentos, que es un poco difícil de probar esta debido al emulador ser una presentación de diapositivas :)

Respuesta

346

para animar la transición entre los fragmentos, o para animar el proceso de mostrar u ocultar un fragmento, usa Fragment Manager para crear un Fragment Transaction.

Dentro de cada Fragment Transaction puede especificar las animaciones de entrada y salida que se usarán para mostrar y ocultar respectivamente (o ambas cuando se usa replace).

El siguiente código muestra cómo reemplazar un fragmento deslizando un fragmento y deslizando el otro en su lugar.

FragmentTransaction ft = getFragmentManager().beginTransaction(); 
ft.setCustomAnimations(R.anim.slide_in_left, R.anim.slide_out_right); 

DetailsFragment newFragment = DetailsFragment.newInstance(); 

ft.replace(R.id.details_fragment_container, newFragment, "detailFragment"); 

// Start the animated transition. 
ft.commit(); 

Para lograr lo mismo con ocultar o mostrar un fragmento simplemente llamaría ft.show o ft.hide, que pasa en el fragmento que desea mostrar u ocultar, respectivamente.

Como referencia, las definiciones de animación XML usarían la etiqueta objectAnimator. Un ejemplo de slide_in_left podría ser algo como esto:

<?xml version="1.0" encoding="utf-8"?> 
<set> 
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android" 
    android:propertyName="x" 
    android:valueType="floatType" 
    android:valueFrom="-1280" 
    android:valueTo="0" 
    android:duration="500"/> 
</set> 
+0

impresionante, gracias. – alexanderblom

+56

Cuando probé esto, muestra * RuntimeException: Nombre del animador desconocido: translate *. –

+3

Asegúrese de que las animaciones definidas en slide_in_left y right estén construidas usando un conjunto de definiciones de objectAnimator en lugar de la definición de animación anterior. –

211

Entonces, si usted no tiene que utilizar la biblioteca de soporte echar un vistazo a Roman's respuesta.

Pero si desea utilizar la biblioteca de soporte , tiene que utilizar el antiguo marco de animación como se describe a continuación.

Después de consultar Reto's y blindstuff's respuestas He obtenido el siguiente código en funcionamiento.

Los fragmentos aparecen deslizamiento desde la derecha y deslizante hacia la izquierda cuando se presiona hacia atrás.

FragmentManager fragmentManager = getSupportFragmentManager(); 

FragmentTransaction transaction = fragmentManager.beginTransaction(); 
transaction.setCustomAnimations(R.anim.enter, R.anim.exit, R.anim.pop_enter, R.anim.pop_exit); 

CustomFragment newCustomFragment = CustomFragment.newInstance(); 
transaction.replace(R.id.fragment_container, newCustomFragment); 
transaction.addToBackStack(null); 
transaction.commit(); 

el orden es importante. Esto significa que debe llamar al setCustomAnimations() antes de replace() o ¡la animación no tendrá efecto!

Siguientes estos archivos tienen que ser colocados en el interior del res/carpeta anim.

enter.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set> 
    <translate xmlns:android="http://schemas.android.com/apk/res/android" 
       android:fromXDelta="100%" 
       android:toXDelta="0" 
       android:interpolator="@android:anim/decelerate_interpolator" 
       android:duration="@android:integer/config_mediumAnimTime"/> 
</set> 

exit.xml:

<set> 
    <translate xmlns:android="http://schemas.android.com/apk/res/android" 
       android:fromXDelta="0" 
       android:toXDelta="-100%" 
       android:interpolator="@android:anim/accelerate_interpolator" 
       android:duration="@android:integer/config_mediumAnimTime"/> 
</set> 

pop_enter.xml:

<set> 
    <translate xmlns:android="http://schemas.android.com/apk/res/android" 
       android:fromXDelta="-100%" 
       android:toXDelta="0" 
       android:interpolator="@android:anim/decelerate_interpolator" 
       android:duration="@android:integer/config_mediumAnimTime"/> 
</set> 

pop_exit.xml:

<?xml version="1.0" encoding="utf-8"?> 
<set> 
    <translate xmlns:android="http://schemas.android.com/apk/res/android" 
       android:fromXDelta="0" 
       android:toXDelta="100%" 
       android:interpolator="@android:anim/accelerate_interpolator" 
       android:duration="@android:integer/config_mediumAnimTime"/> 
</set> 

La duración de las animaciones se puede cambiar a cualquiera de los valores por defecto, como @android:integer/config_shortAnimTime o cualquier otro número.

Tenga en cuenta que si entre los reemplazos de fragmentos ocurre un cambio de configuración (por ejemplo, rotación), la acción de retroceso no se anima. Este es un documented bug que todavía existe en el rev 20 de la biblioteca de soporte.

+41

Esto me acaba de salvar. Tenga en cuenta, preste atención a ** el orden es importante **, que, naturalmente, me perdí la primera vez. Esto significa que debe llamar a setCustomAnimations() antes de replace(). –

+3

Intenté implementar en mis fragmentos. Escribí todo lo que mencionas pero Logcat dice: unknow animator name translate ¿Cómo puedo superar este problema? Por cierto estoy llamando a mi fragmento en el Cajón de navegación (Menú deslizante) –

+0

Funciona muy bien, pero resulta que construir esto con las herramientas de compilación 21.1 genera un error que dice "Nombre de archivo inválido: debe contener solo letras minúsculas y dígitos ([a- z0-9_.]) ". Sugiero editar los nombres de archivo en la respuesta a pop_enter.xml y pop_exit.xml. – smichak

5

Mi modificado support library apoya usando ambas Ver animaciones (es decir <translate>, <rotate>) y el objeto animadores (es decir <objectAnimator>) para el fragmento transiciones. Se implementa con NineOldAndroids. Consulte mi documentación en github para más detalles.

1

que resolver esto de la forma A continuación

Animation anim = AnimationUtils.loadAnimation(this, R.anim.slide); 
fg.startAnimation(anim); 
this.fg.setVisibility(View.VISIBLE); //fg is a View object indicate fragment 
7

por favor utilice este. Android Studio Proporciona el valor predeterminado animation.

fragmentTransaction.setCustomAnimations (android.R.anim.slide_in_left, android.R.anim.slide_out_right);

  FragmentManager fragmentManager = getSupportFragmentManager(); 
      FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction(); 
      fragmentTransaction.setCustomAnimations(android.R.anim.slide_in_left, android.R.anim.slide_out_right); 
      fragmentManager.addOnBackStackChangedListener(this); 
      fragmentTransaction.replace(R.id.frame, firstFragment, "h"); 
      fragmentTransaction.addToBackStack("h"); 
      fragmentTransaction.commit(); 

Salida:

enter image description here

+0

Espero que esto sea útil para ustedes. Mi respuesta realmente útil, por favor, respuesta positiva. –

+0

Gracias por los chicos de votacion .... mantener más votos si es útil. –