Animar un diálogo personalizado

97

Estoy tratando de que aparezca un cuadro de diálogo personalizado como si se deslizara hacia abajo desde una vista de texto. es posible? Parece que no puedo aplicar ninguna animación a la clase de diálogo. Probé esta línea en el constructor, pero no tiene ningún efecto:

this.getWindow (). setWindowAnimations (R.anim.paranimation);

Ni siquiera estoy seguro de si la animación es correcta, pero podré ajustarla una vez que vea lo que está haciendo. Lo enumeraré a continuación en aras de la integridad. No busco ayuda sobre la animación real, solo la aplicación al diálogo.

paranimation.xml:

<?xml version="1.0" encoding="utf-8"?>
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="-200%"
    android:toXDelta="0%"
    android:fromYDelta="200%"
    android:toYDelta="0%"
    android:duration="3000"
    android:zAdjustment="top">
</translate>
FMLDev
fuente
4
Necesito saber esto también. Parece posible animar casi cualquier cosa, aparte de esto. ¡¿O me equivoco ?!
andy_spoo

Respuestas:

215

Hoy he estado luchando con la animación de diálogo, finalmente lo hice funcionar usando estilos, así que aquí hay un ejemplo.

Para empezar, lo más importante: probablemente lo hice funcionar de 5 maneras diferentes hoy, pero no podía decirlo porque ... Si la configuración de animación de su dispositivo está configurada en "Sin animaciones" (Configuración → Pantalla → Animación), entonces los diálogos ganaron. ¡No te animes, no importa lo que hagas!

La siguiente es una versión simplificada de mi styles.xml. Con suerte, se explica por sí mismo. Este debe estar ubicado en res/values.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="PauseDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowAnimationStyle">@style/PauseDialogAnimation</item>
    </style>

    <style name="PauseDialogAnimation">
        <item name="android:windowEnterAnimation">@anim/spin_in</item>
        <item name="android:windowExitAnimation">@android:anim/slide_out_right</item>
    </style>
</resources>

El windowEnterAnimationes uno de mis animaciones y se encuentra en res\anim. El windowExitAnimationes una de las animaciones que es parte del SDK de Android.

Luego, cuando creo el Diálogo en mi onCreateDialog(int id)método de actividades , hago lo siguiente.

Dialog dialog = new Dialog(this, R.style.PauseDialog);

// Setting the title and layout for the dialog
dialog.setTitle(R.string.pause_menu_label);
dialog.setContentView(R.layout.pause_menu);

Alternativamente, puede configurar las animaciones de la siguiente manera en lugar de usar el constructor Dialog que toma un tema.

Dialog dialog = new Dialog(this);
dialog.getWindow().getAttributes().windowAnimations = R.style.PauseDialogAnimation;
ChrisJD
fuente
2
Ese fue solo un nombre que inventé para este ejemplo, en realidad nunca creé esa animación.
ChrisJD
2
Muchas gracias por esta respuesta, está muy mal documentada, aunque encontré esta publicación a través de una pista del grupo de desarrolladores de Android .
David Snabel-Caunt
3
+1 Para "Si la configuración de animación de sus dispositivos está establecida en" Sin animaciones "(Configuración → Pantalla → Animación), ¡los cuadros de diálogo no se animarán sin importar lo que haga!". Me había olvidado de comprobarlo.
Vincent Mimoun-Prat
Dialog dialog = new Dialog(this, R.style.PauseDialog);es para API 11 pero esto es generalDialog dialog = new Dialog(Context context);
mehmet
2
El problema al que me enfrento en esto es que cuando minimizo la aplicación cuando se muestra el cuadro de diálogo y nuevamente restauro la aplicación, el cuadro de diálogo se anima nuevamente, cómo evitar eso, descansa perfecto. +1
Parth Anjaria
56

He creado la animación Fade in y Fade Out para Dialogbox usando el código ChrisJD.

  1. Dentro de res / style.xml

    <style name="AppTheme" parent="android:Theme.Light" />
    <style name="PauseDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowAnimationStyle">@style/PauseDialogAnimation</item>
    </style>
    
    <style name="PauseDialogAnimation">
        <item name="android:windowEnterAnimation">@anim/fadein</item>
        <item name="android:windowExitAnimation">@anim/fadeout</item>
    </style>

  2. Dentro de anim / fadein.xml

    <alpha xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="500" />
  3. Dentro de anim / fadeout.xml

    <alpha xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@android:anim/anticipate_interpolator"
        android:fromAlpha="1.0" android:toAlpha="0.0" android:duration="500" />
  4. Actividad principal

    Dialog imageDiaglog= new Dialog(MainActivity.this,R.style.PauseDialog);
Akshay Taru
fuente
11
Puede usar las animaciones de desvanecimiento de Android predeterminadas '@android: anim / fade_in' '@android: anim / fade_out'
Marek
19

De derecha a izquierda (animación de entrada) y de izquierda a derecha (animación de salida):

styles.xml:

<style name="CustomDialog" parent="@android:style/Theme.Dialog">
    <item name="android:windowAnimationStyle">@style/CustomDialogAnimation</item>
</style>

<style name="CustomDialogAnimation">
    <item name="android:windowEnterAnimation">@anim/translate_left_side</item>
    <item name="android:windowExitAnimation">@anim/translate_right_side</item>
</style>

Crea dos archivos en res / anim /:

translate_right_side.xml:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0%" android:toXDelta="100%"
    android:fromYDelta="0%" android:toYDelta="0%"
    android:duration="600"/>

translate_left_side.xml:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="600"
    android:fromXDelta="100%"
    android:toXDelta="0%"/>

En tu Fragmento / Actividad:

Dialog dialog = new Dialog(getActivity(), R.style.CustomDialog);
vasanth
fuente
13

Me encuentro con el mismo problema, pero, por fin, resuelvo el problema de la siguiente manera

((ViewGroup)dialog.getWindow().getDecorView())
.getChildAt(0).startAnimation(AnimationUtils.loadAnimation(
context,android.R.anim.slide_in_left));
youshuang
fuente
4
No es una respuesta sensata. Las vistas dentro del cuadro de diálogo se animan
DJphy
12

Primero, debe crear dos recursos de animación en res / anim dir

slide_up.xml

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

slide_bottom.xml

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

entonces tienes que crear un estilo

<style name="DialogAnimation">
    <item name="android:windowEnterAnimation">@anim/slide_up</item>
    <item name="android:windowExitAnimation">@anim/slide_bottom</item>
</style>

y agrega esta línea a tu clase

dialog.getWindow().getAttributes().windowAnimations = R.style.DialogAnimation; //style id

Basado en http://www.devexchanges.info/2015/10/showing-dialog-with-animation-in-android.html

Argel Ortiz Arenas
fuente
La URL de referencia es útil.
ahmednabil88
2

Pruebe el siguiente código:

public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

        getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));// set transparent in window background

        View _v = inflater.inflate(R.layout.some_you_layout, container, false);

        //load animation
        //Animation transition_in_view = AnimationUtils.loadAnimation(getContext(), android.R.anim.fade_in);// system animation appearance
        Animation transition_in_view = AnimationUtils.loadAnimation(getContext(), R.anim.customer_anim);//customer animation appearance

        _v.setAnimation( transition_in_view );
        _v.startAnimation( transition_in_view );
        //really beautiful
        return _v;

    }

Cree la animación personalizada: res / anim / customer_anim.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="500"
        android:fromYDelta="100%"
        android:toYDelta="-7%"/>
    <translate
        android:duration="300"
        android:startOffset="500"
        android:toYDelta="7%" />
    <translate
        android:duration="200"
        android:startOffset="800"
        android:toYDelta="0%" />

</set>
amiron
fuente