MindOrks
Published in

MindOrks

Material Dialog Android Library Demo

Animated Material Dialog — Android 📱 😍🎨

Screenshot of Google Files App.

👉 About MaterialDialog Library :

👇 Library provides two types of Dialogs :

1️⃣ Material Dialog:

Animated Material Dialog

This is basic material dialog which has two material buttons ( Same as Android’s AlertDialog ) as you can see in the image. For e.g. Here you can see the animated Material Dialog with Animation, Title, Message and two buttons.

2️⃣ Bottom Sheet Material Dialog:

Animated Bottom Sheet Material Dialog

This is Bottom Sheet material dialog which has two material buttons which is created at bottom of device as you can see in the image. For e.g. Here you can see the animated Bottom Sheet Material Dialog with Animation, Title, Message and two buttons.

💻 Getting Started :

* Prerequisite:

i. Gradle

dependencies {    // Material Dialog Library
implementation 'com.shreyaspatil:MaterialDialog:2.1'
// Material Design Library
implementation 'com.google.android.material:material:1.0.0'
// Lottie Animation Library
implementation 'com.airbnb.android:lottie:3.3.6'
}

ii. Set up Material Theme

<resources>
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<!-- Customize your theme here. -->
...
</style>
</resources>

iii. Customize Dialog Theme (Optional)

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="android:fontFamily">@font/montserrat</item>
<!-- Customize your theme here. -->
<item name="material_dialog_background">#FFFFFF</item>
<item name="material_dialog_title_text_color">#000000</item>
<item name="material_dialog_message_text_color">#5F5F5F</item>
<item name="material_dialog_positive_button_color">@color/colorAccent</item>
<item name="material_dialog_positive_button_text_color">#FFFFFF</item>
<item name="material_dialog_negative_button_text_color">@color/colorAccent</item>
</style>

Create Dialog Instance

i. Material Dialog

Creating MaterialDialog and showing it.
Simple Material Dialog

ii. Bottom Sheet Material Dialog

Creating BottomSheetMaterialDialog and showing it.
Simple Bottom Sheet Material Dialog

🎞 Showing Animations:

Animated Material Dialogs. Material Dialog at left and Bottom Sheet Material Dialog at right.

i. Using Resource File

Adding animation using Resource (raw) file.

ii. Using Asset File

Adding animations using the Asset File.

iii. Getting LottieAnimationView

LottieAnimationView animationView = mDialog.getAnimationView();
// Do operations on animationView

◀️ Dialog State Listeners

  • OnShowListener() - Listens for dialog Show event. Its onShow() is invoked when dialog is displayed.
  • OnCancelListener() - Listens for dialog Cancel event. Its onCancel() is invoked when dialog is cancelled.
  • OnDismissListener() - Listens for dialog Dismiss event. Its onDismiss() is dismiss when dialog is dismissed.
  • Website :

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Shreyas Patil

Google Developer Expert for Android, 👨‍💻Engineer @ Paytm Insider❤️ Android & Kotlin 💻Organizer @KotlinMumbai | More info: https://shreyaspatil.dev