B4A Library afollestad material-dialogs

Firstly, this is a work in progress but I thought I would share to get some feedback from the B4A community. Not all dialogs types are implemented yet.

This is a B4A wrapper library of Aidan Follestads Material Dialogs library on GitHub

mdshowcase.png


His library supports material style dialogs all the way back to API level 8. If you would like to see examples of the library Aidan has an app on the Play Store (well worth downloading). The library is updated frequently.

Secondly this is similar to thedesolatesoul's MSMaterialDialogs library. He has provided great advice on the road to getting this library working. So thanks thedesolatesoul!

Thirdly, as with thedesolatesoul's MSMaterialDialogs library these dialogs are not modal and use callbacks (see the example project).

To get this running you need;

1) The wrapper library (download from here)
2) android-support-v4.jar (must be version 22.1 or later, use Android SDK-Manager to update your copy)
3) android-support-v7-appcompat.jar
4) android-support-v7-recyclerview.jar
5) The android.support.v7.appcompat additional resources
6) The afollestad_material-dialogs additional resources
7) All additional libraries must be in your B4A additional libraries folder
8) See note 1 below regarding dialog text colours (and themes).
9) Make sure that you reference a android.jar with platform version 21 or above in the IDE under the "Tools/Configure Paths" menu. (Thanks to corwin42)

Please refer to the sample project to see where to place the additional resources. The sample project uses a menu to initiate the dialogs.

NOTE 1: When using the library in your own app the dialog colours may not be the correct "Material" colours. The example app defines the correct colours via a theme under ..\MDTest\Objects\res\values\theme.xml (this file must be made read only otherwise it will be overwritten). Read this forum post for more info on themes.
NOTE 2: Please, please, please make sure you have version 22.1 or later of the support libraries and that the 3 libraries are copied to your additional libraries folder for B4A.

B4X:
<resources>
    <!-- http://www.google.com/design/spec/style/color.html#color-color-palette -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">#3F51B5</item>
        <item name="colorPrimaryDark">#3949AB</item>
        <item name="colorAccent">#E91E63</item>
    </style>
</resources>

Whats New?

06/05/2015
  • Updated to 0.7.3.1 of afollestad material-dialogs library
  • Split out dialogs into seperate objects (all have MD_ prefix)
  • Added/tidied up documentation (including events)
  • Included progress dialogs and folder selection dialog
15/05/2015
  • Updated to 0.7.4.1 of afollestad material-dialogs library

Documentation

MaterialDialogs
Comment:
This is a B4A wrapper library of Aidan Follestads Material Dialogs library on GitHub

MD_BasicDialog is a basic dialog
MD_InputDialog is an input dialog
MD_ListDialog is a list dialog showing items
MD_MultiChoiceDialog is a choice dialog showing items and allowing multiple selections
MD_SingleChoiceDialog is a choice dialog showing items and allowing a single selections
MD_FolderSelectorDialog is a folder selection dialog
MD_ProgressDialog is a progress dialog

Author: Trevor Hart
Version: 0.731
  • MD_BasicDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • Show
    Methods:
    • Initialize (EventName As String)
    • Show (title As String, content As String, positiveText As String, negativeText As String, neutralText As String, icon As Bitmap, limitIconToDefaultSize As Boolean, forceStacking As Boolean)
    Permissions:
    • android.permission.READ_EXTERNAL_STORAGE
  • MD_FolderSelectorDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • FolderSelection (Result As String)
    • Show
    Methods:
    • Initialize (EventName As String)
    • Show (InitialFolder As String)
  • MD_InputDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • Input (Result As String)
    • Show
    Methods:
    • Initialize (EventName As String)
    • Show (title As String, content As String, hint As String, prefill As String, allowEmptyInput As Boolean, inputMaxLength As Int, positiveText As String, negativeText As String, neutralText As String, icon As Bitmap, limitIconToDefaultSize As Boolean, forceStacking As Boolean)
  • MD_ListDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • ItemSelected (Index As Int, Text As String)
    • Show
    Methods:
    • Initialize (EventName As String)
    • Show (title As String, items As List, positiveText As String, negativeText As String)
  • MD_MultiChoiceDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • MultiChoice (Result As Map)
    • Show
    Methods:
    • Initialize (EventName As String)
    • Show (title As String, items As Map, positiveText As String, negativeText As String)
  • MD_ProgressDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • Show
    Methods:
    • CurrentProgress As Int
    • Dismiss
    • IncrementProgress (Increment As Int)
    • Initialize (EventName As String)
    • Show (title As String, content As String, negativeText As String, Indeterminate As Boolean, Max As Int, showMinMax As Boolean)
  • MD_SingleChoiceDialog
    Events:
    • ButtonPress (Result As Int)
    • Cancel
    • Dismiss
    • Show
    • SingleChoice (Index As Int, Text As String)
    Methods:
    • Initialize (EventName As String)
    • Show (title As String, items As List, selectedIndex As Int, positiveText As String, negativeText As String)
 
Last edited:

shashkiranr

Active Member
Licensed User
Longtime User
Hi All,

To apply different background colors for the dialog and to also change the colors of title,content,positive,negative and neutral text, use the Global theming mentioned in the GitHub.

I have pasted it below for reference. Just copy paste the items in your theme.xml file and change the colors accordingly.

B4X:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

    <!--
        All dialogs will default to Theme.DARK with this set to true.
    -->
    <item name="md_dark_theme">true</item>

    <!--
        This overrides the default dark or light dialog background color.
        Note that if you use a dark color here, you should set md_dark_theme to
        true so text and selectors look visible
    -->
    <item name="md_background_color">#37474F</item>

    <!--
        Applies an icon next to the title in all dialogs.
    -->
    <item name="md_icon">@drawable/ic_launcher</item>

    <!--
        Limit icon to a max size.
    -->
    <attr name="md_icon_max_size" format="dimension" />

    <!--
        Limit the icon to a default max size (48dp).
    -->
    <attr name="md_icon_limit_icon_to_default_size" format="boolean" />

    <!--
        By default, the title text color is derived from the
        ?android:textColorPrimary system attribute.
    -->
    <item name="md_title_color">#E91E63</item>


    <!--
        By default, the content text color is derived from the
        ?android:textColorSecondary system attribute.
    -->
    <item name="md_content_color">#9C27B0</item>


    <!--
        By default, the positive action text color is derived
        from the colorAccent attribute of AppCompat or android:colorAccent
        attribute of the Material theme.
    -->
    <item name="md_positive_color">#673AB7</item>

    <!--
        By default, the neutral action text color is derived
        from the colorAccent attribute of AppCompat or android:colorAccent
        attribute of the Material theme.
    -->
    <item name="md_neutral_color">#673AB7</item>

    <!--
        By default, the negative action text color is derived
        from the colorAccent attribute of AppCompat or android:colorAccent
        attribute of the Material theme.
    -->
    <item name="md_negative_color">#673AB7</item>

    <!--
        By default, a progress dialog's progress bar, check boxes, and radio buttons
        have a color that is derived from the colorAccent attribute of AppCompat or
        android:colorAccent attribute of the Material theme.
    -->
    <item name="md_widget_color">#673AB7</item>

    <!--
        By default, the list item text color is black for the light
        theme and white for the dark theme.
    -->
    <item name="md_item_color">#9C27B0</item>

    <!--
        This overrides the color used for the top and bottom dividers used when
        content is scrollable
    -->
    <item name="md_divider_color">#E91E63</item>

    <!--
        This overrides the selector used on list items.
    -->
    <item name="md_list_selector">@drawable/selector</item>

    <!--
        This overrides the selector used on stacked action buttons.
    -->
    <item name="md_btn_stacked_selector">@drawable/selector</item>

    <!--
        This overrides the background selector used on the positive action button.
    -->
    <item name="md_btn_positive_selector">@drawable/selector</item>

    <!--
        This overrides the background selector used on the neutral action button.
    -->
    <item name="md_btn_neutral_selector">@drawable/selector</item>

    <!--
        This overrides the background selector used on the negative action button.
    -->
    <item name="md_btn_negative_selector">@drawable/selector</item>

    <!--
        This sets the gravity used while displaying the dialog title, defaults to start.
        Can be start, center, or end.
    -->
    <item name="md_title_gravity">start</item>

    <!--
        This sets the gravity used while displaying the dialog content, defaults to start.
        Can be start, center, or end.
    -->
    <item name="md_content_gravity">start</item>

    <!--
        This sets the gravity used while displaying the list items (not including custom adapters), defaults to start.
        Can be start, center, or end.
    -->
    <item name="md_items_gravity">start</item>

    <!--
        This sets the gravity used while displaying the dialog action buttons, defaults to start.

        START (Default)    Neutral     Negative    Positive
        CENTER:            Negative    Neutral     Positive
        END:               Positive    Negative    Neutral
    -->
    <item name="md_buttons_gravity">start</item>

    <!--
        This sets the gravity used while displaying the stacked action buttons, defaults to end.
        Can be start, center, or end.
    -->
    <item name="md_btnstacked_gravity">end</item>

</style>

Regards,
SK
 

tchart

Well-Known Member
Licensed User
Longtime User
Thanks shashkiranr, this is good information!

There is also a showThemed dialog (which I have yet to implement) which allows you to change the colours using code.
 

shashkiranr

Active Member
Licensed User
Longtime User
Thank you for this library. :) It would be great if you could include the file system dialog in your next update.
 

tchart

Well-Known Member
Licensed User
Longtime User
Library updated.

06/05/2015
  • Updated to 0.7.3.1 of afollestad material-dialogs library
  • Split out dialogs into seperate objects (all have MD_ prefix)
  • Added/tidied up documentation (including events)
  • Included progress dialogs and folder selection dialog
 

shashkiranr

Active Member
Licensed User
Longtime User
Hi tchartm

:) thank you for the updated version. Is it possible to add only folders and to select only files for the folder dialog.

Regards,
SK
 

tchart

Well-Known Member
Licensed User
Longtime User
Hi tchartm

:) thank you for the updated version. Is it possible to add only folders and to select only files for the folder dialog.

Regards,
SK

SK, yes I do plan to do this but Aidan Follestads sample does not have an example so it will take a bit more work to figure out.
 

shashkiranr

Active Member
Licensed User
Longtime User
Hi tchart,

the MD_BasicDialog is not picking up the ButtonPress event. the example program is also not working. can you check once.

Regards,
SK
 

tchart

Well-Known Member
Licensed User
Longtime User
SK, sorry I hadnt updated the onbutton press to be buttonpress. Please redownload as I have fixed it now.
 

jahswant

Well-Known Member
Licensed User
Longtime User
i'm getting this error aftter a correct config...
B4X:
src\b4a\example\main.java:17: error: cannot find symbol
public class main extends android.support.v7.app.AppCompatActivity implements B4AActivity{
                                                ^
  symbol:   class AppCompatActivity
  location: package android.support.v7.app
Still has not solved this issue
 
Last edited:

shashkiranr

Active Member
Licensed User
Longtime User
did you add this line to your activity

B4X:
#Extends: android.support.v7.app.AppCompatActivity

Regards,
SK
 

tchart

Well-Known Member
Licensed User
Longtime User
Did you copy android-support-v7-appcompat.jar to your additional libraries folder?
 

tchart

Well-Known Member
Licensed User
Longtime User
Please re-download the library.

Check you have ..\afollestad_material-dialogs\res\values\styles.xml file. Also check the contents of the file.

Given you have so many errors, are you sure your path to the resource files are correct?

Also remove any spaces in the path name.
 
Last edited:

tchart

Well-Known Member
Licensed User
Longtime User
15/05/2015
  • Updated to 0.7.4.1 of afollestad material-dialogs library
 

omidaghakhani1368

Well-Known Member
Licensed User
Longtime User
15/05/2015
  • Updated to 0.7.4.1 of afollestad material-dialogs library
I'm sorry.I cannot update sdk because my internet speed is very slow.
can you attachment new android support library for me?
Thank you
 
Top