Animate a custom Dialog
I'm trying to have a custom dialog appear as though it's sliding down from a text view. Is this possible? I can't seem to apply any animation to dialog class. I've tried this line in the constructor, but it has no effect:
this.getWindow().setWindowAnimations(R.anim.paranimation);
I'm not even sure if the animation is correct, but I will be able adjust it once I see what it's doing. I'll list it below for the sake of completeness. I'm not looking for help on the actual animation, just the application to the dialog.
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>
Solution 1:
I've been struggling with Dialog animation today, finally got it working using styles, so here is an example.
To start with, the most important thing — I probably had it working 5 different ways today but couldn't tell because... If your devices animation settings are set to "No Animations" (Settings → Display → Animation) then the dialogs won't be animated no matter what you do!
The following is a stripped down version of my styles.xml. Hopefully it is self-explanatory. This should be located in 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>
The windowEnterAnimation
is one of my animations and is located in res\anim
.
The windowExitAnimation
is one of the animations that is part of the Android SDK.
Then when I create the Dialog in my activities onCreateDialog(int id)
method I do the following.
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);
Alternatively you could set the animations the following way instead of using the Dialog constructor that takes a theme.
Dialog dialog = new Dialog(this);
dialog.getWindow().getAttributes().windowAnimations = R.style.PauseDialogAnimation;
Solution 2:
I have created the Fade in and Fade Out animation for Dialogbox using ChrisJD code.
-
Inside 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>
-
Inside 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" />
-
Inside 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" />
-
MainActivity
Dialog imageDiaglog= new Dialog(MainActivity.this,R.style.PauseDialog);