A

Anonymous

Question

Flex Mobile - Alert and Information Popup Boxes

Forum|Forum|15 years ago
November 24, 2010
8 replies
18277 views

Since a Android-looking popup box doesn't yet exist in the Hero SDK, I thought I would put a pretty good looking component together.

You can download it (and the sample code) here:

http://www.digitalretro.tv/components/InformationBoxTest.fxp

A real simple example in in the project, for both an Info and an Alert.

I currently only support an "OK" button, but I will be adding a Yes/No and OK/Cancel later this week.

Hopefully this will save someone some time.

Enjoy and feel free to use this in your code (commercial or non-commercial), just leave the copyright code in the component source file in place.

Thanks.

Darren

This topic has been closed for replies.

M

megharajdeepak

Known Participant

Hi there,

Thanks for the great component

But one quick question. How can we listen for YES, NO, OK and CANCEL button click events of the MessageBox ? I couldn't find any function parameter like how we have for Alert, to listen for CloseEvent.

A

Anonymous

Hi,

Actually you use this component like every Flex component: just subscribe to the event by calling "addEventListener". There is 4 events (messageBoxOK, messageBoxCANCEL, messageBoxYES, messageBoxNO).

You should have something like this to use this component (not tested):

var msgBox:MessageBox = MessageBox.show(null, MessageBox.MB_OK, MessageBox.IC_HELP, "help box!", "show something helpfull");

msgBox.addEventListener(MessageBoxEvent.MESSAGEBOX_OK, myHandler);

Of course, you can use instanciate your component with MXML. I let you try it.

M

megharajdeepak

Known Participant

Thanks naelmskine. That helped me. But MessageBox.show(null.... using null gave me a null object runtime error. So I used the parent instead and it worked fine. However, I'm not sure if icons like MessageBox.IC_HELP, MessageBox.IC_DELETE, MessageBox.IC_ADD etc are in built. Because they doesn't seem to work. It always shows up some broken icon.

A

Anonymous

Excellent! Thanks man

A

Anonymous

Hi,

like i've posted here, I've compiled EhlersD's code into a library. Since Flex 4.5 has been released, my project has no more bug.

You can download the library here:

http://dl.dropbox.com/u/22049158/MesssageBox-digitalRetro.swc

Have fun ;-)

Adam_Tuttle

Participating Frequently

I was going to ask if anyone had made a version that looks like the Gingerbread dialogs, but ultimately I think the onus is on the AIR development team to expose some API to us to create native dialogs, because we're now at the point where it's very possible that our applications will look outdated and disjointed for using a dialog style that doesn't match the system style. Native applications don't have this problem, which is a problem for us.

A

Anonymous

@Thomas_Ah: I never used ViewNavigatorApplication. The modifications steps you described don't compile for me. May you give us a project example?

The thing I made to use "alert and information popup boxes" is to add MessageBox component in my application (a MobileApplication) and then use it (or modify it). It would be greate to use it as an external library but it was not embedding assets because of a Flex Hero bug.

I hope this could help you.

@Adam.Tuttle: You are right, it would be usefull to have this native behavior but when you develop with an alternative framework, you could expect this problems.

Gingerbread dialogs could be reproduced by modifying "alert and information popup boxes" component's CSS. If you do so, please post your code here.

A

Anonymous

It could be a good idea to add events metadata. But thank you for this greate component.

A

Anonymous

I tried to embed images and create a library but there is a bug in Flex Hero. I post my code here to let someone build it when it will be fixed.

http://dl.dropbox.com/u/22049158/MesssageBox-digitalRetro.fxpl

T

Thomas_Ahl1

Participant

Hi.

I tried the Messagebox and it works great but is it possible to use a TextInput with it?

I added a Textinput and when i enter the Textinput i got an Focusmanager is null error:

private function touchMouseDownHandler(event:MouseEvent):void
     {
         isMouseDown = true;
         mouseDownTarget = event.target as InteractiveObject;

         // If we already have focus, make sure to open soft keyboard
         // on mouse up
       if (focusManager.getFocus() == this)
             delaySetFocus = true;

         // Wait for a mouseUp somewhere
         systemManager.getSandboxRoot().addEventListener(
             MouseEvent.MOUSE_UP, touchMouseUpHandler, false, 0, true);
         systemManager.getSandboxRoot().addEventListener(
             SandboxMouseEvent.MOUSE_UP_SOMEWHERE, touchMouseUpHandler, false, 0, true);
     }

TypeError: Error #1009: Cannot access a property or method of a null object reference.
    at spark.components.supportClasses::SkinnableTextBase/touchMouseDownHandler()
    at flash.events::EventDispatcher/dispatchEventFunction()
    at flash.events::EventDispatcher/dispatchEvent()
    at mx.managers::SystemManager/mouseEventHandler()

Does anyone tried to use a TextInput or Textarea?

I think it's the a problem with the Keyboard. Does mobile air can't use the "Android" Keyboard in Popup's?

Adam_Tuttle

Participating Frequently

Since it's a little easier to work with, I compiled a SWC from the code, which can be downloaded here: http://dl.dropbox.com/u/3831772/adbe/AndroidAlerts.swc

Hm, actually I've just realized the images aren't included in the SWC, and I had to include them in my project to get them to show up. I've never built a SWC that includes images before, can it be done? How?

M

mplsCorwin

Participant

A simple approach is to use @Embed[1]. This should cause your SWC to include the image sources that are actually used.

[1] http://livedocs.adobe.com/flex/3/html/embed_3.html

Adam_Tuttle

Participating Frequently

I tried to open this with Catalyst CS5 as well as the latest Panini build, but both say they can't open it.

I would really like to use this in a Flex project... what do I need to do? Is there any chance you can just export it to a Flex Class and provide that?

A

Anonymous

Hi Adam.

You can import a FXP into FB.

Have a look here: http://help.adobe.com/en_US/flashbuilder/using/WSbde04e3d3e6474c4ef5411412477fbf920-8000.html#WSbde04e3d3e6474c4-247dcc961226561b12d-7ffe

Y

Yangbozhou

Participant

Nice work!

A

Anonymous

Here's an updated library. I changed it to MessageBox and uploaded a new Flex Project:

http://www.digitalretro.tv/components/MessageBoxText.fxp

This take the popup messages and adds an OK/CANCEL and a YES/NO option.

Enjoy.

Darren

M

MatthewGuestFlexDev

Participant

Thanks for this! It looks great and saved me a ton of grief.

I wrote up a quick blog post about it, with an additional bit of code to auto set a default parent: http://mattguest.com/2010/12/air-for-android-alert-box-solution/

Thanks again!

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded