Create custom dialog with animation android

    It’s very easy to create a custom dialog with animation Android. here are some of the steps to create customize dialog in Android. In This tutorial, I am going to create a custom dialog with animation android shows how to replace the associated on and off screen transitions of an alert dialog with your own XML animation set.

Steps to create custom dialog with Animation

  • Create Dialog object & Import Dialog.
  • set the separate layout for the dialog window.by dialog.setContentView(R.layout.about_layout).
  • Then declare the Textview and button you have added in the dialog layout.
  • Then finally display the dialog by calling dialog.show().

MainActivity.Java

final TextView txt_about_details=(TextView)dialog.findViewById(R.id.txt_about_details);
final TextView txt_about_text=(TextView)dialog.findViewById(R.id.txt_about_text);
final Button btn_back=(Button)dialog.findViewById(R.id.btn_back);
Button btn_feedback=(Button)dialog.findViewById(R.id.btn_feedback);
txt_about_text.setTextColor(Color.WHITE); dialog.setCancelable(true);
dialog.show();

// if you want to hide dialog call dialog.dismiss();

R.style.animation.xml

//Here i have set my style for the dialog window to show the in and out animations.

<style name="animation">
<item name="android:windowEnterAnimation">@anim/in_animation</item>
<item name="android:windowExitAnimation">@anim/out_animation</item>
</style>

R.anim.in_animation.xml

This is the animation for show dialog after clicking the show dialog button. the dialog will appear from the right side of the screen.

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/accelerate_decelerate_interpolator"
   >
<scale  xmlns:android="http://schemas.android.com/apk/res/android"
  android:fromXScale="0"
  android:toXScale="1"
  android:fromYScale="0"
  android:toYScale="1"
  android:pivotX="50%"
  android:pivotY="50%"
  android:duration="400"
  android:fillAfter="true">
</scale>
</set>

R.anim.out_animation.xml

This is the animation for hiding dialog after clicking the hide dialog button. The dialog will disappear to the left side of the screen.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/accelerate_decelerate_interpolator">
<scale  xmlns:android="http://schemas.android.com/apk/res/android"
  android:fromXScale="1"
  android:toXScale="0"
  android:fromYScale="1"
  android:toYScale="0"
  android:pivotX="50%"
  android:pivotY="50%"
  android:duration="400"
  android:fillAfter="true">
</scale>
</set>

Download

Leave a Reply

Your email address will not be published. Required fields are marked *