[FREE],[PAID] AlertDialog - Custom Dialog -Title & Message (html) • Color • Radius, Icons & Buttons

Extensions
, , ,
1
AlertDialog
Includes: title, message, icon (Static or Animated), customizable buttons, background colors, text, border, corner radius.

GIF_20250614_024902_710

20241011_021221

1729327802294
17293278022941080×2340 101 KB

1729327802285
17293278022851080×2340 100 KB

Update v1.1 June 14, 2025.

  • Icons can now be added from assets or URLs from the web: .jpg, .png, .gif
  • A helper block has been added for imagePositions.
  • The backgroundColor parameter has been removed from the ShowAlertDialog function; the block will update.
  • The IconSize function has been added.
  • A click effect and shadow have been added to buttons.
    (When the effect ends, the dialog closes, triggering the event.)
  • Three new parameters have been added to the AddButtons function.

ShowAlertDialog

Shows an AlertDialog with an icon or animated gif

blocks (14)
blocks (14)1360×632 68.3 KB

The backgroundColor parameter has been removed as it was no longer needed. (The block will be updated).

You can add image from assets or url.
Formats: .jpg, .png y .gif.

IconSize

Changes the size of the icon.

blocks (16)
blocks (16)654×164 14.4 KB

The size is 400 x 400 by default.

  • You can enter any value to resize the icon within the dialog.

AddButtons

Adds multiple buttons below the message with customizable options.

blocks (15)
blocks (15)1506×2700 474 KB

3 more parameters have been added, the block will be updated.

Parameters: buttonGravity , shadowElevation , shadowColors .

Customizable Options:

  • Change the color.

  • Separate corner radius.

  • Height and width.

  • Add icons.

  • Position icons between left, right, top, and bottom.

  • Shadow under the button and change its color.

  • buttonGravity: Positions buttons to the right, center, or left.

  • shadowElevation: The distance of the shadow under the button. (The shadow has no feathering.)

  • shadowColors: The shadow color. It is recommended that colors with transparency be used. Enter a hexadecimal value, for example: #22000000 (22 indicates transparency).

  • In buttonWidths if you pass -1 as the value, the button will expand to cover the available space.

Dismiss

Closes the AlertDialog.

component_method (5)

ButtonClicked

Triggered when a button is clicked.

component_event (4)
component_event (4)654×172 13 KB

It will fire after the button completes the click animation.

v1.1 June 14, 2025.

AlertDialog.aia (532.3 KB)

joejsanz.joedevalertdialog.aix (19.7 KB)

v1.2Paid Version July 16, 2026.

  • Compatibility with Kevinkun's CompCreator

A container was added which can be accessed to add components and customize it to your liking.

GIF_20260716_033535_981

AddContainer

Adds a container below the info alert where views can be added.

component_method

GetContainer

This allows extensions like CompCreator to add views.

component_set_get

With CompCreator:

blocks (18)
blocks (18)1120×156 24.3 KB

What You Will Get:

  • .aix File: The compiled extension ready to import into your project.
  • .aia File: An example project demonstrating the correct setup and configuration.

Support & Updates Policy

  • Bug Fixes: Free lifetime updates for any bug fixes related strictly to the extension's code.
  • Support: Technical support is provided only for issues or errors regarding the extension's execution. It does not include personalized UI design or general app-building assistance.

:warning: Important: License Activation

  • How to Activate: After your purchase, you will be provided with a unique license key to activate the extension. There is no need to share your MIT App Inventor email address.
  • How it Works: The extension validates your unique license key through our secure database (Firebase) during design or runtime. If the key is invalid or missing, the extension's functions will be restricted.
  • Delivery: Once your payment is confirmed, both your unique license key and the .aix file will be delivered to you immediately so you can start building right away.

Buy Now

Donar con PayPal

JDK: 11
Minimum API Level: 14
Updated On: 2025-06-14T07:00:00Z

Built using: FAST-CLI v7.0.0-premium

Thanks.

13 Likes
Why the pop up window not the same?
Chiudere Notifier.Show....Dialog
2

Very nice, could you add an After event, and maybe CANCEL & OK, instead of a X?

1 Like
3

Thank you Tim.

The x can be removed by leaving the parameter empty.
As for the cancel and accept buttons, they can be placed at the bottom, the function to add configurable buttons and an event is already done, but I have not updated the post yet.

While I show you some screenshots:

1729164127619
17291641276191080×2340 94.9 KB

component_event (10)
component_event (10)642×170 13.2 KB

2 Likes
4

Update:

Integration of buttons, an event for the buttons and a function to close the dialog.

2 Likes
5

Exactly what I needed!

How and why do you make the best extensions?!

1 Like
6

Thanks a lot aimbot_user

How? I search a lot, sometimes I hit a wall, but I like to create and I like my applications to look good, like everyone else I suppose.

There are more users who have made excellent extensions.
But I thank you.

7

Screenshot 2025-01-07 at 4.37.16 AM
Screenshot 2025-01-07 at 4.37.16 AM589×1267 59.6 KB

Screenshot 2025-01-07 at 4.38.21 AM
Screenshot 2025-01-07 at 4.38.21 AM256×373 16.6 KB

This is something that I could not have made without your amazing extension, and the most important are yours. Even though I am using other extensions, you have made extensions that do the same thing, but I discovered them after finding the original, or had problems uploading them to Kodular. But nevertheless, I would always prefer your extension over most, as you make it so much easier to make my apps as good as this!

EDIT: DaffyDialog could be replaced by your AlertDialog, but they both are used in different ways in my app

Phase could have been replaced by Lottie, but I had lost all my extensions that I previously downloaded because my computer hard reset. Anyways, I saw Phase first when searching for animations, and had forgot about Lottie (I had used it a few months prior).

MakeViewUp was to stylize the texboxes, but your TextboxCustom extension was not loading into Kodular, and I had also used this extension before I moved to
Kodular.

Also I did not use the Beautify extension, so it doesn't count :slight_smile:

All in all, 3/8 extensions I use are yours, and if I had them earlier, it would've been close to 6/8

Thank you for all the help you gave me, and the community.

2 Likes
8

Your app looks great.

Thanks a lot for motivating me.
You help us become better developers when you use and comment on our extensions. So we can give you something better.

3 Likes
9

Thanks, it looks a good extension.
I'm trying to involve it in an app.

What could be wrong?

AlertDialog displays in a narrow window, hiding all text (both in Companion and apk).
Can I set dimensions of the window?

AlertError
AlertError1080×2400 257 KB

AlertError2
AlertError21716×1106 106 KB

Thank you for your advice.

10

I've tried it, and the same thing isn't happening to me. Could you give me more details? I've updated the extension. Try this project to see if the error persists:

11

Update v1.1 June 14, 2025.

I Want Working Custom Dialogue Extension
12

It works perfectly.

Tried in a sample program, I got this

AlertDialogDisplay
AlertDialogDisplay1080×2400 51.7 KB

while using your aia file, no problem too.

AlertDialogScreenshot
AlertDialogScreenshot1080×2400 82.4 KB

Thank you for your kind reply and the sample code.

14

Hi, I’m using many of your great extensions for my app, much appreciated!

I have an idea, don’t know if it’s possible…. Wouldn’t it be great if you could use compcreator with your alert dialog to add below the message. For example, add a chart, list view, map etc.

This doesn’t work obviously

blocks
blocks892×112 15.1 KB

Is there any way you can provide a container below the label that compcreator or DynamicComponents could use?

Just an idea so that anyone could roll their own custom dialog by adding to your dialog.

Cheers, Daryl

1 Like
15

Just call the dialogs from a compcreator created button ? (set dialog block in a procedure, etc.)

Or do you mean something else ?

16

I mean a JoeDevAlert dialog that I can insert some dynamic component into. Such as add a chart (example a histogram) to the middle of the dialog using compcreator.create. In would be just below the JoeDevAlertDialog message.

blocks(1)
blocks(1)1212×168 20.7 KB

This way you could make a pretty dialod with buttons and any custom content

Cheers, Daryl

17

It may look like

component_component_block

however be the container below the message “JoeDevAlertDialogContainer1” and used for compcreater.create:In

18

Again, I believe setting up the dialog blocks in a procedure, using some parameters, then call that procedure with the parameters (e.g. your custom content), but I see what you are getting at if you need to add additional buttons or other content.

19

Thanks for the suggestion, I already have my own alert procedure that provides a consistent JoeDevAlert and JoeDevTextBoxDialogs anywhere in the app. (App is getting large, 8,800 blocks in screen1)

I’ll photoshop some possibilities maybe tomorrow. I use JoeDevTextDialog and would like JoeDevListViewDialog (with multiple check boxes). Also pop-up statistics with a histogram chart would be nice. Of course there are options however I’s nice to keep everything looking and behaving consistent.

Just an idea.

20

Update:
v1.2Paid Version

2 Likes
21

That’s great! Thanks very much! No problem with the price, it’s no more than a large coffee!. If my app is successful I intend to donate something to you for your other work I am using as well, along with authors of other extensions.

1 Like