How to Create QuickAction Dialog in Android

[Update 15/07/2011]

I have updated the quickaction implementation code so it can be used more efficient and the dialog will be automatically dismissed after pressing the action item. All the source codes now available via github so you can track the changes.

Official Twitter application for Android  has introduced new Android UI features and behavior patterns such as Dashboard, Search Bar, QuickAction and Action Bar. One of the interesting pattern is QuickActions that displays contextual actions in a list view. This pattern actually already exists in QuickContact dialog/bar in default Contact application (since Android 2.0).

QuickContact QuickContact

The QuickActions dialog is not included in standard Android SDK, so we have to create it manually. At first, i had no idea on how to create it so i decided to download and read the Contact app source code from  Android git. I found that the QuickContact dialog  uses private API call (com.android.internal.policy.PolicyManager) that does not exists in standard SDK. After posting question about it on google groups and stack overflow, i got the solution for it from Qberticus (thanx Qberticus!).

Qberticus’s QuickActions uses simple/plain layout so i have to create a custom layout so it will look like QuickContact in Contact app or QuickActions in Twitter app. Based on QuickContact source code, i made a slight modification on Qberticus’s BetterPopupWindow class and extended it to implement custom layout. I also made it customizeable, so the icon and text in action list can be customized.

Here are the screenshoots of QuickActions demo:

QuickContact / Twitter-like QuickActions

Code snippet
Create action items

<br />//Add action item<br />ActionItem addAction = new ActionItem();<br /><br />addAction.setTitle("Add");<br />addAction.setIcon(getResources().getDrawable(R.drawable.ic_add));<br /><br />//Accept action item<br />ActionItem accAction = new ActionItem();<br /><br />accAction.setTitle("Accept");<br />accAction.setIcon(getResources().getDrawable(R.drawable.ic_accept));<br /><br />//Upload action item<br />ActionItem upAction = new ActionItem();<br /><br />upAction.setTitle("Upload");<br />upAction.setIcon(getResources().getDrawable(R.drawable.ic_up));<br />

Line 02: Create new action item
Line 04: Set action title
Line 05: Set action icon

Create quickaction instance and setup listener

<br />final QuickAction mQuickAction 	= new QuickAction(this);<br /><br />mQuickAction.addActionItem(addAction);<br />mQuickAction.addActionItem(accAction);<br />mQuickAction.addActionItem(upAction);<br /><br />//setup the action item click listener<br />mQuickAction.setOnActionItemClickListener(new QuickAction.OnActionItemClickListener() {<br /><%%KEEPWHITESPACE%%>	@Override<br /><%%KEEPWHITESPACE%%>        public void onItemClick(int pos) {<br /><%%KEEPWHITESPACE%%>		if (pos == 0) { //Add item selected<br /><%%KEEPWHITESPACE%%>		   Toast.makeText(Example1Activity.this, "Add item selected", Toast.LENGTH_SHORT).show();<br /><%%KEEPWHITESPACE%%>		} else if (pos == 1) { //Accept item selected<br /><%%KEEPWHITESPACE%%>		   Toast.makeText(Example1Activity.this, "Accept item selected", Toast.LENGTH_SHORT).show();<br /><%%KEEPWHITESPACE%%>		} else if (pos == 2) { //Upload item selected<br /><%%KEEPWHITESPACE%%>		   Toast.makeText(Example1Activity.this, "Upload items selected", Toast.LENGTH_SHORT).show();<br /><%%KEEPWHITESPACE%%>		}<br /><%%KEEPWHITESPACE%%>	}<br />});<br />

Line 1: Create quickaction instance
Line 3-5: Add the action items into quikaction
Line 8: Setup listener for action item clicked, the pos argument on onItemClick method shows which action item is clicked.

Show quickAction dialog

<br />btn1.setOnClickListener(new View.OnClickListener() {<br />@Override<br />public void onClick(View v) {<br /><%%KEEPWHITESPACE%%>	mQuickAction.show(v);<br />}<br />});<br />

Line 04: Show quickaction dialog, the v argument used as the anchor where the quickaction displayed.

Gallery3D-like QuickActions

Implementation on My Application

BlitzDroid

Minapolitan (Prototype)

Buy me a coffee

If you found this stuff useful to your work, please consider a donation.
By doing this you will be helping me to keep improving this stuff and to continue to help anyone who needs, and maybe keep on helping you in the future.




Thanks for your support, will do my best to keep the info fresh and useful.

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Comments

  1. Dragan says

    This is huge man. I’ve been searching for Tweeter app source code all time since it was published just to find out how this QuickActions bar works.
    Thank you very much.

  2. akex says

    Thank you.

    I modified a bit your code (i did it first with Qberticus.

    Replacing in CustomPopupWindow

    this :

    if (rootHeight > anchorHeight) {

    by :

    if (rootHeight > anchor.getTop() {

    Cause in Listview, i managed to have Quickactionbar over my title bar, not so nice. With getTop, no problem anymore.

  3. says

    Thanks for the code. I’m guessing the code is released under the same licence as the original code (new BSD licence)?

    Thanks again. I’ll make sure to mention it at the MANGTUG meeting next week :)

  4. 5xnewx says

    Hi Lorenz,
    If i wanna like t olearn adnroid prgramming development and contribute, how it can be started. I have done and replciated exact tools steps which you have mentioned in your blog.

    Now what are the resources where i can learn to program and develop android application.

    Appreciate your time and support on your blog.

    Thanks,

  5. Ash says

    I am making my own Contact mgmt system & implemented the above code. i need 2 implement the further functionality now.. ie; to make a call after clicking on the “Call” Action Item.. I have the code to initiate a call from Android. But as you see in the Native Address Book, if you have 2-3 phone numbers saved for a contact, the QuickAction window grows down listing all the numbers saved & asks you to select one from the 2-3 phone numbers.. any idea how to implement this window …

    Thanx in advance..

    • says

      Hi Ash,

      You can read the source code of Contacts app from android source tree, there is a method inside QuickContactWindow.java that implements it. Sorry i can’t give you the exact solution. :-)

  6. says

    OMG YOU are awesome. I cant believe that 3 months later they still havent published the source code for this even though they say its “best practices”. Good on you man!

  7. says

    Hi, I’d like to make a few modifications to the above presented solution.

    First of all, if I want to use icons which are larger than the once in the example, the action item area grows below the row of action items. I’ve tried modifying the padding and such to give the icon some more space, but it didn’t work.

    Any ideas how to make the above example work with arbitrarly large icons? And/or with the text below the icon?

    • says

      Hi Christoffer,

      In order to use more bigger action icons, you must make a modification on quickaction’s icon, make a new bigger image for it’s rail background. Or try to use Twitter’s quickaction icon (extract its apk files and copy background image from drawable-mdpi/hdpi).

  8. Phuc Nguyen says

    Hi. Your stuff is awesome!

    But is it possible to dim the screen behind the PopupWindow, just like with the context menu?

  9. achie says

    Hi can I use the code in my application? Is there any thing else that I need to do regarding the license like referring you or something else to use this code?

    Thank you for the code. Have been looking for this since a few days.

  10. Rui says

    This is so cool! Great job, Lorenz. But when you use this component, you only target your application for Eclair and above? Do you know of any component that is similar to this for Cupcake and Donut? I’m not saying that it has to be exactly the same, but alike.

  11. says

    I have modified your layout to present the label for the icon below the icon itself, much like the Twitter application. In order to do this, make the following changes to res/layout/action_item.xml:

    LinearLayout:
    android:orientation = “vertical”
    android:paddingTop = “0dip”
    android:paddingBottom = “0dip”

    ImageView:
    android:layout_height = “fill_parent”
    android:paddingLeft = “5dip”
    android:paddingRight = “5dip”

    TextView:
    android:layout_width = “wrap_content”
    android:textSize = “10sp”

    There is only one caveat to this that I can see: in order for the labels to all line up, the icons must be the same size. Since they _should_ be the same size to begin with, this isn’t much of a problem.

    I hope that helps someone! Thank you so much for the code!

  12. Ole K says

    You Sir, are my official hero of he week! This is simply great :) I hope Google sees this and pulls it into the official Android API ASAP.

    And thanks to Michael Herold as well, for his alternative layout making the text appear below the icons.

  13. Jamie Nordmeyer says

    I’ll reiterate what everyone else on here as said so far. Thanks a ton to you and Qberticus for this work. I was just about to give up and try to work this myself when I finally stumbled upon your blog post. I’m hoping that Google will put something like this in the next release of the SDK, but until then, you’ve done a beautiful job with both samples. Thanks again!

  14. Mike says

    Great tutorial.

    I am fairly new to Android and Java. I implemented this in my app, but I do not know how to make the Pop-up dismiss automatically when an option is selected.

  15. says

    hi. this is just what I’m looking for. thx.

    What is the best practice when dealing with PopupWindow class ?
    Is it okay if I just create and create another instance everytime I want to show a popup ?
    Can I reuse the same instance ? That is after I call dismiss, then I call showAtLocation again.

    thx

  16. Muniu says

    Lorenz,

    Good work on the widget, saved a life here!
    Quick question though, how do you implement Gallery3D-like QuickActions?
    I’ve tried
    mQuickAction.showDropDown(); with no luck,
    mQuickAction.showLikeQuickAction(0,30); with no luck either.
    Thanks.

  17. baychev says

    awesome tutorial, thanks alot.
    one question about it: is it possible to implement quick actions using this code as well on the application icon? much like the contacts placed on the home screen pop up a context menu to call, sms, emai, etc. how would you go about it?

  18. Patrick says

    Great job, love the look and feel of your quick action. I have found one problem while using a listadapter that has more than one size of views in the list. The quickaction window does not line up quite right like it does with a list of equal size views. Anyone have this problem or any solutions?

  19. Jonathan says

    I found a bug…

    if (rootHeight > anchor.getTop()) {

    should be

    if (rootHeight > anchor.top) {

    because anchor.getTop() will give the relative and not the absolute top.

  20. Emil says

    Hi man! thanks so much for this, i made a slight change is the CustomPopupWindow class to make dissmissing a quickaction look much better, with this code it wont become see-through when pressed.

    thanks once again!

    public void dismiss() {
    Handler mHandler = new Handler(); mHandler.postDelayed(mUpdateTimeTask,10);
    }

    Runnable mUpdateTimeTask = new Runnable(
    {
    public void run() {
    window.dismiss();
    }
    };

  21. Manuel says

    Lorenz, you are my hero! :)

    Just to be absolutely sure: I can use parts of your sample code and the drawables in my own app? Of course I give big thanks to you in the About Dialog of my app, but you’re okay with that, right?

  22. says

    Great find for me. I’ve tried it and it works fine, although I’ll wait for your updates before implementing it into my own app.

    Great work.

  23. says

    One more question though.
    Really don’t want to come across as the unappreciative nitpicker here but how come that the borders and icons are not really sharp and clean – and more important do you or anybody else know how to improve the overall look of this *admittetly already really nice* feature?

    Best wishes and king regards.
    Bruiser

  24. Vladimir says

    This is really great, thanks for sharing!!

    I’ve only one question, if I want to use Gallery 3D like actions and QuickActions together in my app, do I have to import both projects? (I would have to refactor, because it’s in the same package and the conflict will appear). Or is there any mysterious flag to show normal QA and gallery 3D like?

    Thanks again

  25. Andy says

    Great tutorial Lorenz!

    One thing that occurs while I tested your implementation: If you click on an item in the quick action bar the item gets transparent (doesn’t show the orange/highlighted background). This doesn’t happen if you press the item as long as it takes for the orange/highlight background to appear. Any ideas on this?

    Thanks for this great tutorial/code!

      • Andy says

        Hi Lorenz,

        thanks for your comment. I deleted the overridden dismiss()-Method in the CustomPopupWindow class which solves the problem. Is that want you meant with disable the exit animation?

        Thanks again for this great tutorial!
        Andy

      • Andy says

        Argh, well it doesn’t solve the problem. It just leads to not closing the bar…

        Can you give me some more detailed information what I need to do? This would be much appreciated.

        Thanks in advance
        Andy

  26. says

    Thanks for the demos! But I found a small bug when using QuickAction class. After the QuickAction view dismisses, call QuickAction.show() again, it will re-add previous ActionItems in actionList again. After adding a flag to decide whether they have been added fix the bug.

  27. Yuri says

    It would be nice if there will be an ability to use custom layouts for quick actions. For example, I want to use only icons placed on 3×4 table layout.

  28. Adnan says

    I have created the quick action bar successfully. Now I want to open a context menu on clicking the buttons on quick action bar. How can I do this?

  29. says

    I think that:
    if move”createActionList()” before “root.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));” . It well be better.

  30. dewey says

    In your example code you set Anonymous Listeners for each ActionItem. If I change this so my class implements OnClickListener then I implement one onClick(View v) method and have it deal with all onClicks (second description here: http://tseng-blog.nge-web.net/blog/2009/02/14/implementing-listeners-in-your-android-java-application/), I have no way of determining which ActionItem caused it to execute since only the View (in this case a LinearLayout) is passed, not the ActionItem. How can I determine which ActionItem was clicked?

    Thanks

  31. Perry_ml says

    Hi, you have done a great job.
    I have got a suggestion for Gallery3D-like QuickActions.
    In class QuickAction and method show(), use anchor.getLocationInWindow(location) instead of anchor.getLocationOnScreen(location). It fixes yPos bug when Activity has Dialog theme. I hope it help someone…

  32. adam says

    Hi! I’m kinda new to Android but I’m using your codes to my very simple app. Thank you very much for that!
    I’ve very very few times to go through your codes. so can you please help me in reducing the height of the Quick Action Dialog?

  33. Arindam says

    Thanx man…really helpful…now i will be able to save a lot of screen space with such good looking interface…

  34. ilh says

    Great job on this lorenz!

    Just a quick pointer for the Gallery3D quick actions:

    In action_item.xml change the icon ImageView layout_height to match_parent otherwise some of the quick actions don’t get enough height if their icon is small and/or you add top/bottom padding to the title.
    Also if you don’t use an icon at all the quick action doesn’t display because it’s using the layout_height of the icon (not sure why it doesn’t go by the title height) so doing to above solves that too but better still add onto the icon null check the following so that it isn’t used in calculating the layout at all if it’s not used:
    else {
    img.setVisibility(View.GONE);
    }

    Keep up the good work!

  35. zhong says

    Hi Lorenz,
    Great job!
    I have used the BetterPopupwindow in my app.
    But I get some force close, the log is from the user, I never reproduce it:

    java.lang.NullPointerException
    at android.widget.PopupWindow$PopupViewContainer.dispatchKeyEvent(PopupWindow.java:1359)
    at android.view.ViewRoot.deliverKeyEventToViewHierarchy(ViewRoot.java:2496)
    at android.view.ViewRoot.deliverKeyEvent(ViewRoot.java:2456)
    at android.view.ViewRoot.handleMessage(ViewRoot.java:1766)
    at android.os.Handler.dispatchMessage(Handler.java:99)
    at android.os.Looper.loop(Looper.java:123)
    at android.app.ActivityThread.main(ActivityThread.java:4627)
    at java.lang.reflect.Method.invokeNative(Native Method)
    at java.lang.reflect.Method.invoke(Method.java:521)
    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:858)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
    at dalvik.system.NativeStart.main(Native Method)

    Any idea?

    Thank you.

  36. says

    Thanks for sharing this, very helpful!

    I wanted some more info that I could use from ActionItem so I customized the callback. Here’s the addition.

    /// some info so callback will have the action item to pass
    private static class ListenInfo {
    public ActionItem ai;
    public View v;

    public ListenInfo (View v, ActionItem ai) {
    this.ai = ai;
    this.v = v;
    }

    }

    /// New Callback function
    public static class OnClickListener {
    public void onClick(View v, ActionItem ai) {
    }
    };

    /// Internal view callback handler
    private View.OnClickListener quickListener = new View.OnClickListener() {
    public void onClick(View v) {
    // retrieve action info from tag
    ListenInfo li = (ListenInfo) v.getTag();
    // call the callback
    li.ai.listener.onClick(li.v, li.ai);
    }
    };

    Then when adding an action add:
    view.setTag(new ListenInfo(view,actionList.get(i)));

    Cheers

  37. says

    Nice work Lorenz :D
    I’m using your code in my academic android project, hopes you don’t mind ;)

    Unbelievably helpful piece of code, and it works like it should. Easy and smooth – thumbs up from me!

  38. Tareq sust says

    Bro,
    you owe a hug from me. Very nice code and works like a charm . Thanks for sharing the code .

    Tareq

  39. Nico says

    Thanks for this.

    I also ran into the problem where tapping a button to dismiss the bubble leaves behind a black rectangle. A lame (but functional) workaround is to call dismiss() after a short delay instead of calling it directly, like so:

    public void onClick(View v) {
    // Instead of calling dismiss() directly, do:
    new Handler().postDelayed(new Runnable() {
    @Override
    public void run() {
    // Give the button time to draw its “pressed” state.
    // Without this delay, the pressed button is transparent
    // while the exit animation runs.
    dw.dismiss();
    }
    }, 10);
    }

  40. Vinay Hiremath says

    This is fucking awesome man. I got here originally from StackOverflow. Very informative. I’ll be watching you.

  41. satura says

    Dear Lorenz
    Excuse me, our team just began to work on GIS app. in Taiwan. We met some difficulties in creating QuickAction dialog. Could we use your code in our cadastral GIS product? We want to show this action in the main menu. Please let me know if you have any concerns,thank you.
    Yours Sincerely

    Satura

  42. monty says

    not sure if anyone else encountered this problem but in the QuickAction class, showArrow method, i found that it would not show the arrow b/c of this line.
    param.leftMargin = requestedX – arrowWidth / 2;

    if u add parentheses shown below it will work
    param.leftMargin = (requestedX – arrowWidth) / 2;

    Thankfully i listen to a maths class when i was younger, go BODMAS

  43. says

    Hi Lorenz,

    Great code!

    I see that you have the updated code on NewQuickAction git hub. Are you able to tell me if that code is newest than the Gallery3D code example!? I use the gallery one, but i’m afraid to not be updated!

    thanks!
    rafa

  44. Iñigo says

    Hi! Congratulations, great job! I will start following your blog

    What is the git hub url? Are these examples in a repository? I would be really usefull to be up to date with these really nice components

    Thanks

  45. su says

    How to create nested Quick Actions????
    For example as given above:- When Button1 is pressed, Chart & Products is visible. When Chart is click, then also it should display a new Quick actions with different items…

  46. says

    hey lorenz.. first of all thanks a lot for providing this beautiful piece of code to everyone.

    secondly i want to use quickaction on click on list view item or infact a button in list view. how do i find out which row of the listview fired the quickaction?

    thirdly i wanna knw wats d difference in the quick action and new quick action code?

  47. says

    Thanks a lot for your implementation. The result is outstanding.
    I just have a little graphical issue. When I launch a different activity by tapping an ActionItem the background disappears for a short period of time and then the new activity launches. Although when I tap the item an hold it, the background becomes orange as suspected.

    • says

      Hello,

      Yes there is a bug in my implementation. The actionitem background becomes dark when the dialog dismissed. I’m working on fixing this issue. Watch my github repository for latest update.

  48. Sirill says

    Hi,

    Very good job.

    Is there a way to have icons on 2-3 lines ?
    I m searching since 2 days without success.

  49. Tim says

    VERY nice, Lorenz. Thank you SO MUCH, it’s exactly what I needed. I’m still fairly new at this, so not only was it something I can use, but it’s also a nice learning experience. Well done.

  50. hjhi says

    Hello Lorens, Thanks for your code. But how to insert new quick action dialog in quick action dialog??

      • hjhi says

        Hi, what i mean is …. in your code when we will press Button1, it will show quick action having three items (Add,Accept,Upload). Now i want to pop up a new quick action having two or three items on pressing any option(Add,Accept or Upload).

        • says

          Hi, i think that’s not a good pattern, showing new qa dialog on top/below other qa. The best way to implement your goal is by using extended layout just like in contact app. If a contact has more than one phone numbers, clicking on phone item on quickaction will expand new list view below the action item. you have to implement it manually ;)

  51. CamDroid says

    Thanks a bunch for the code – I’m really looking forward to building an app with this included! :D

    One thing, though – when I try to implement your files into my app, they cause it to crash. PopupWindows line 35 (mWindow = new PopupWindow(context) ) causes an IllegalStateException – “System services not available to Activities before onCreate()”

    I’ve called setContentView() in another class, and I’m pretty sure I’ve copied the files over correctly, so if you have any helpful tips, that would be amazing. :D

    Thanks for all of your hard work!

  52. Andy says

    Hi lorenz,

    awesome work, again and thanks for publishing it on github. I am using your previous version of the code so. The new version which uses only one listener for all items doesn’t work for me. The problem with your solution is, you rely on the position of the clicked item. My quickaction list contains different amounts of actions depending on the state of the clicked item.

    So even though your solution is shorter/simpler it isn’t as flexible as your first solution.

    Just my two cents. Again, thanks for sharing this with the dev community.

    Andy

  53. Aitor says

    Hi Lorenz,
    Thanks so much for sharing this.
    I’ve just included your code in one app I am working with and all seemed to work fine.
    However, when I was playing around at one moment I doubled clicked too fast on the button that shows the quickaction dialog, not intentionally, but I did and the application force closed.
    It was weird and I did not know if it was something in my code.
    Then I opened your example and start noticing the same problem, but only on Example1 (on the list this is not happening). If I click repeatedly and too fast on the buttons (I know that this is not how you are going to use your app but it happened unintentionally the first time) the app crashes with the following error

    ERROR/AndroidRuntime(8350): FATAL EXCEPTION: main
    ERROR/AndroidRuntime(8350): java.lang.ClassCastException: android.view.ViewGroup$LayoutParams
    ERROR/AndroidRuntime(8350): at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:3129)
    ERROR/AndroidRuntime(8350): at android.widget.FrameLayout.onMeasure(FrameLayout.java:250)
    ERROR/AndroidRuntime(8350): at android.view.View.measure(View.java:8313)
    ERROR/AndroidRuntime(8350): at android.view.ViewRoot.performTraversals(ViewRoot.java:839)
    ERROR/AndroidRuntime(8350): at android.view.ViewRoot.handleMessage(ViewRoot.java:1859)
    ERROR/AndroidRuntime(8350): at android.os.Handler.dispatchMessage(Handler.java:99)
    ERROR/AndroidRuntime(8350): at android.os.Looper.loop(Looper.java:130)
    ERROR/AndroidRuntime(8350): at android.app.ActivityThread.main(ActivityThread.java:3683)
    ERROR/AndroidRuntime(8350): at java.lang.reflect.Method.invokeNative(Native Method)
    ERROR/AndroidRuntime(8350): at java.lang.reflect.Method.invoke(Method.java:507)
    ERROR/AndroidRuntime(8350): at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:839)
    ERROR/AndroidRuntime(8350): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:597)
    ERROR/AndroidRuntime(8350): at dalvik.system.NativeStart.main(Native Method)

    I am using a Nexus One (Android 2.3.4), let me know if this is happening to you.

    Thanks so much

  54. angie says

    hello,
    first of all it’s an awsome work!
    i’m trying to integrate the quickActionBar, Gallery 3D like to my Action Bar(a reusable layout)
    i’m getting a bug , the triangle it’s no longer attached to the square. i think it’s a problem of context , i have no idea how to fix it help!

  55. Connor says

    Great example! I’m currently trying to implement this into my application, but unfortunately I use a custom view (onDraw and a canvas). Ideally, I’d like for the user to be able to touch any part of the screen and depending on where they touch, the quickaction menu pops up and has custom content (depending on the location of the touch). So currently I’m using an onTouchEvent, then locating the touch, then performing an action based on that location. How could I implement your code so when I touch the screen, the quickAction menu pops up and populates itself based on location?

    So for example:

    public boolean onTouchEvent(MotionEvent event) {
    int eventaction = event.getAction();

    int X = (int)event.getX();
    int Y = (int)event.getY();

    switch (eventaction ) {

    case MotionEvent.ACTION_DOWN: // touch down so check if the finger is on a ball
    int centerX = 80;
    int centerY = 80;

    if (X > centerX – 30 && X centerY – 30 && Y < centerY + 30){//POPS UP QUICK ACTION MENU WITH CUSTOM CONTENT HERE
    }
    }
    break;
    }
    return true;
    }

    Thanks.

  56. says

    I think this code would be better for the onClick listener :

    container.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View v)
    {
    if (mListener != null)
    mListener.onItemClick(pos);
    v.post(new Runnable()
    {

    @Override
    public void run()
    {
    dismiss();
    }
    });

    }
    });

  57. Adam says

    Has anyone figured out how to use this with Fragments? I have a Left Fragment and a Right Fragment, both ListFragments. I want the QuickAction dialog to pop up when I click on a ListItem on the right. It pops up in the right spot vertically, but it’s within the Left Fragment, not the Right. Any ideas?

    Thank you…it’s a great bit of code!

  58. TheVaan says

    Thanks for this amazing code!
    I love it!

    One question: Is there a way to modify the code so that this popup is able to show only something like an information, so that there is only text, without clickListner and so on?
    I’m not a really pro in coding and hope you can help me :)

    Greetings

  59. says

    Working good but I am having one issue. When calling quickAction.show(v); in a button click it can crash with this in the log:

    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): java.lang.ClassCastException: android.view.ViewGroup$LayoutParams
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:3129)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.widget.FrameLayout.onMeasure(FrameLayout.java:250)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.view.View.measure(View.java:8330)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.view.ViewRoot.performTraversals(ViewRoot.java:843)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.view.ViewRoot.handleMessage(ViewRoot.java:1865)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.os.Handler.dispatchMessage(Handler.java:99)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.os.Looper.loop(Looper.java:130)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at android.app.ActivityThread.main(ActivityThread.java:3835)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at java.lang.reflect.Method.invokeNative(Native Method)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at java.lang.reflect.Method.invoke(Method.java:507)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:847)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:605)
    10-05 15:55:05.702: ERROR/AndroidRuntime(11608): at dalvik.system.NativeStart.main(Native Method)

  60. says

    mantap mas… saya punya 2 listview mas deng orientasi vertical, isinya banyak data tapi yang keliatan hanya 3 row aja gimana ya mas?jadi bisa di scrool buat liat semua datanya?thank you..

  61. says

    I have made a number of changes to the code that others may find helpful.

    1) Action Item – new constructor with action id, title, icon

    2) Callback enhanced to return QuickAction object as source and action id (allows you to add items in any order as you base what was clicked on by the ID, not the pos)

    3) Action item supports sticky mode, if that is enabled the menu does not dismiss post button press. I needed this for my application.

    4) QuickAction has getActionItem(pos) call so you can get action item back. QuickAction has ArrayList of added items to support this.

    5) QuickAction supports constructor with horizontal flag so you can run menu horizontally instead of just vertically.

    6) If doing horizontal QuickAction loads the action_item_horiz.xml and popuphoriz.xml files instead of the vertical ones.

    7) Added action_item_horiz.xml with a centered image over a centered text label

    8) Added horiz_separator.xml file so you can show a separator between items in a horizontal layout

    9) Updated NewQuickAction3DActivity to show the toast message based on label of action item clicked as you now have enough info in callback to do that generically

    I want to attempt to have all horizontal items show up same width by rolling through post add and getting max width and using that for all items. Not sure if that is possible.

    I would also like to add a spacer action so you can group items with an extra gap. Might do that as a parameter to addActionItem(action)

    I can send the code to you if you to look it over and see if my changes are acceptable and useful. I might take a day or so to polish it up and implement a few things mentioned above.

    The existing code has been very helpful and I wanted to give back to others who are using it.

  62. Shilpy Pandey says

    Hi,
    i want the arrow in the middle of the popup as its everytime either displayed on right or left side.Any option to make it in center

    • says

      The position of the arrow is based on where the anchor view is placed. If you place the anchor view at the center of screen, the arrow will be displayed at the center too.

  63. Harsha says

    lorenz,
    I am trying to use your quick action for menu item on action bar (3.0) and not being able to place at the right place.

    How can I do this in.
    mActionBarView = getLayoutInflater().inflate(
    R.layout.action_bar_custom, null);

    public boolean onOptionsItemSelected(MenuItem item)
    {
    switch (item.getItemId())
    {

    mQuickAction.show(mActionBarView);

    }
    }

    I know its because I am passing actionbar view as anchor view, how do I pass the menu item as the anchor view, is it possible?.

    Help on this is highly appreciated.

    Waiting for quick response :)

    Thanks,
    Harsha

  64. Jean-Michel says

    Hi Lorenz,
    this is really great work and it seems it will suit my needs.

    I just have a question re the implementation.

    It is meant to be used as a library project, or should I rather copy everything in my own project tree ?

    Thanks in advance,
    JM

    • says

      Hi Jean, thanks for choosing quickaction. You should copy everything into your project. You can also make changes to the drawables if you want to make custom theme. ;)

  65. Jean-Michel says

    Hi Lorenz,
    I did this as it was simpler indeed.

    I have just made a small modification to your code.

    I have added a tag object (like in View)to ActionItem. This allows “embedding” stuff into the ActionItem.
    It proved necessary in my case and might be useful to other users (the code is VERY simple, just added the instance variable and getter/setter).

    Thanks again for your great work.

  66. Harut says

    Hi, I’m trying to adopt it to my project, I’d like to know do you have implementation for this to pop-up not from the top or bottom but from left or right?

    Thanks.
    Harut M.

  67. Zerho says

    Hi i’m trying to use this on my app but when i click on a quick action item too “quickly” the image doesn’t behave like it should, it disappear and shows the background color, if i click it “slowly” it works properly,
    is there a way to fix it?
    do you experience the same thing?

    thanks

    Matteo

    • says

      Hi Zerho, yes there is a bug on quickaction. the solution is to create separate background drawable for popup menu. i’ll try to update the fix soon on github.

  68. Rob says

    Hey Lorenz,

    Thanks for this cool code!!!

    Is there any way to change an ActionItem’s icon or text, AFTER it has been added to the QuickAction?

    I’ve tried…

    myActionItem.setIcon(getResources().getDrawable(R.drawable.ic_checked));

    and

    quickAction.getActionItem(0).setIcon(getResources().getDrawable(R.drawable.ic_checked));

    but without success. I’m trying to implement a checked/unchecked state on a sticky ActionItem. Any suggestion on how to do this?

    Thanks,
    Rob

  69. Igor says

    I have finally found the solution for transparent background problem. The thing is that popup window is dismissed too early so just put this piece of code in PopupWindows class, dismiss() method:

    public void dismiss() {

    new Thread(new Runnable() {

    @Override
    public void run() {
    try {
    Thread.sleep(1500);
    mWindow.dismiss();
    } catch (InterruptedException e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
    }

    }
    }).start();

    }

    I hope it helps…

  70. shinjidev says

    Nice work and article :). I’m using quickaction in my project, it works very well in smartphone app, but i have a problem when i try to show it in a Dialog, the quickaction appears in other place outside the dialog, what can i do in this case? :(

  71. George H. K. says

    The code works perfect and the design is very easily customiziable, Great work!

    The only problem I currently have is that the PopupWindow consumes the touch event needed to dismiss itself, without delegating it to the other controls.

    I tried various ways to work around this, including unsuccessful try to set FLAG_NOT_TOUCH_MODAL but still not working.

    Any help will be greatly appreciated!

    • George H. K. says

      Have anyone else had this problem and managed to fix it somehow?

      I see that the default camera app in Android 3.1 have quite nice kind of quick action menus, but the focus is not consumed, so you ca switch to (open) the next menu directly while closing the current one. So it is possible for sure :-)

  72. Andy says

    Great article. I’ve used the QuickAction bar in the Greendroid library but never seen how to create the Gallery Like one. Really like this quick action, thanks for sharing.

  73. gil says

    incredibly helpful thank you!!

    would be nice to just download the source project and work with that

    but still helped a lot :)

  74. says

    I recently noticed, that on a big screen (like a Honeycomb tablet) the popup is positioned very weirdly and also the triangle below (above) the popup isn’t displayed.

    The strange thing is: Although this happens in landscape mode, it doesn’t in portrait mode.

  75. Spencer says

    This works perfectly for a project I’ve been working on. I have a couple of questions though. First, I notice that the 3D version doesn’t scroll horizontally if there are more items than can be displayed. Also, is there a way to make the quick actions pop up to the side of the anchor instead of above/below? A fix to either the horizontal one not scrolling or popping a vertical list to the side of an anchor would help a lot. Let me know if I’m missing something. Thanks again!

  76. caco says

    tutorial yang sangat membantu. terima kasih.

    oh iya, klo untuk pop up window yang menampilkan textview ada tutorialnya ga mas? klo bisa sih di buat juga, saya sudah searching di google belum ada yang tepat penjelasannya…

  77. Steve Cornish says

    Hi Excelent
    Is it possible to get the pop up window to point to the select item in a custom list. At the moment it points to the list hold not the row item selected. if so how.
    Thanks

  78. Josh Hunt says

    Thanks for the great piece of code!

    I am attempting to change the title on an action item after I have created the action item. It doesn’t seem to be updating. I am using the following code:

    quickAction.getActionItem(2).setTitle(“Remove Star”);

  79. Mohit says

    Thanks for this work. It helped me in my free app that I published on app store. Drop me an email if you would like a link or search using my email ID before gmail.com. Really appreciate your hard work.

  80. smeeagain says

    Thank you for this it is really a nice piece of work. Is there a way to remove and add new items during program run?

  81. Felix says

    Can you support all display sizes, please.
    I have in each ActionItom white lines in the background, so i think the grey background image or color is not for my display size of 320 x 240 Pixels configured. Thanks

  82. says

    Bug report:
    I’ve tried the list example, when you click over an item it always come through false on the if clause, so don’t have really a action tha can be handled there…, the Strange things is over the buttons it works fine, with almost the same code…
    Despite of it, it’s a great work!! congratulations

  83. Rommy says

    I just have a problem..
    When I press the button, the QuickAction is shown normally but when the QuickAction is still shown then I switch the emulator from portrait to landscape mode, the QuickAction position is somehow not positioned in the button that I pressed before..

    Any suggestion how to prevent this??

  84. youssef says

    This is really great work and very easily customizable and documented. I did notice one issue though that you have not notice it on a BLACK background but it is very obvious on lighter colors backgrounds. When you click on an Action Item before the Presse State takes place, the item DISAPPEARS monetarily. Do you know why is this happening ? your answer will be greatly appreciated. Thanks

  85. Brandon Tate says

    I’m trying to display this inside a web view. When I show the quick action menu it doesn’t really wrap the content. The buttons are all there, but the background is just that 9 patch image, complete with the guides still showing. Has anyone run across something similar?

  86. stevo says

    this post is so helpful and so nice but is possible to update the 3d part to can add multi row icons i want use it to add emoticons in the view in mtrack u use linear layout i want to put table layout

  87. Silvan says

    Hi, this is really great! Does anyone know how to implement this from an onSingleTapConfirmed, where I only have a MotionEvent and no View?

    Thanx in advance!

  88. Cristiano Marinho says

    congratulations for the wonderful job.

    You can start the activity with QuickAction already open,
    without using the method onClick ()?

  89. piyush says

    I was wondering if it’s possible to add a view (xml) in Quick Action. I have designed a table layout in xml and not sure how to fit that into QuickAction.

  90. Exile says

    Thx for your code. It’s quite helpful for me but i have a problem. Popup’s width is not full screen. How can i solve that?

  91. chitgoks says

    hi. using your Gallery3D-like QuickActions, what if this will be used in a tablet, how can the menus get bigger?

    just use bigger icons?

  92. jack says

    Thx for your code. It’s quite helpful for me but i have a problem. But I have problems with Popup,when I use android 4.0.3 to run the project.(the display size is 5.4 in FWVGA),The Popup’s size is much bigger I expected,and when the button is in a FrameLayout,(the FrameLayout in the scren’s bottom) the arrow of the Popup is still the down ones.Do you know why?

  93. Kd says

    Hi
    the code is working fine only the Horizontal separator is not coming for the quick action any suggestions for the problem ?

    Thanks
    KD

  94. zhmsong says

    hey, lorenz:
    Thanks, It is great!
    But I found a problem, the source has not set minSdkVersion, so when I set one as my app, the quickaction_slider_btn_normal.9.png will not scale well:-(
    It is ok when minSdkVersion deleted.

    Regards
    Zhimin

  95. Jim says

    You need to add this in the AndroidManifest.xml:

    This will fix the display issues, like the text being too big in places, and the Toast messages being too small.

  96. paragchauhan says

    Hi
    Thanks for nice tutorial.
    I need to Add simple Listview in QuickAction Dialog.
    Pls suggestion me any suggestion for this

  97. says

    Hello,

    This library is great, the sample application seems to work but when I added it to my library in my application I get an NullPointerException error when I’m adding the action item on the quick action.

    Can anyone tell me what’s happening?

    • Cris says

      I imported the class folder NewQuickAction3D/bin/classes but am running into a NoClassDefFoundError. Clearly I am doing something wrong.
      What is the correct way to import QuickAction3D into a project? Should a user export a .jar file and then import it? if so what is exported into the .jar file? Or should one import a Classes folder? for us/me a little new at Eclipse/ Java it would be great to have this tip. Thank you.

      • Cris says

        OK, I got a little bit farther, I added a class folder of NewQuickAction3D/bin/classes and from QuickAction3D exported a .jar and imported it into my project, but now running into a runtime error when setting the mRootView.

        public void setRootViewId(int id) {
        mRootView = (ViewGroup) mInflater.inflate(id, null);

        Obviously I’m doing something wrong, so a quick steps on how to properly import QuickAction3D into a project in eclipse would be appreciated. Thanks!

  98. Dilip says

    i have implemented your code according to my requirement i need to add dynamic data in popup list but i’m unable to do this please suggest me how to do this thanks for excellent code.

  99. Cristina says

    Hi, first, thank you very much for your code. It helped me with my job. But I have a question about the second code.

    I need do my own quickaction with my own res, but with your code I don’t get remove the black background. Where is declarated the background? I thought in the popup_vertical.xml file but the black background continue. How can I change the style of my quickaction.

    Sorry for my english.

    Regards

  100. Vanqe says

    Hi, thank you for your code.

    I have a problem when I try modify ActionItem title.

    @Override
    public void onItemClick(QuickAction source, int pos, int actionId) {
    ActionItem actionItem = quickAction.getActionItem(pos);

    if (actionId == 0) {
    actionItem.setTitle(“New title”);
    }
    etc…

    I miss something?

    Thank you again.

  101. Shachi says

    Hi,can u plz tell me where to post this code… I mean where shud I keep this code in library??
    I get an error when I write ActionItem in Java file.

    Thanks.

  102. PinoyGeekster says

    Hi Thank you for this helpful post.
    I am new to Android dev and I want to use your implementation on my current Android app project.

    I am using Mono for Android, VS2010 plugin. I just want to ask how can I incorporate or reference your implementation on my project

    Thank you very much!

  103. Evan says

    Thanks for the awesome tool. I tried to use it, but it seems to pop up covering my button, rather than popping up from it, like your examples…any ideas?

  104. Digetix says

    Thank you, that’s fine. But I have a question. How to display the menu

    mQuickAction.show(v);

    to do when the user clicks the physical menu button?

    • Evan says

      replace view1 with the name of the buttons view you want the QA to popup from.

      Perhaps you should learn android a little better, as capturing hardware button presses is a fundamental task in android.

      @Override
      public boolean onKeyDown(int keycode, KeyEvent e) {
      switch (keycode) {
      case KeyEvent.KEYCODE_MENU:
      View v = (View) findViewById(R.id.view1);
      mQuickAction.show(v);
      btnSocialMenu.performClick();
      return true;
      }

      return super.onKeyDown(keycode, e);
      }

      • Evan says

        remove the “btnsocialmenu…” code, I have my menu key doing something else in my app besides triggering the QA menu.

  105. Raul says

    Hi there! Finally I succeed and make the QuickAction work for my app. Now I am thinking if I can manage to make the slider or the icons to be in the center of the QucikAction Slider. Is there any way solving this? :D

    Thanx

  106. Cris says

    For those that did make this work for your App how did you do it? Did you export a .jar file? if so what did you include in the .jar? did you import a class folder? if so which folder(s) ? I ran into NoClassDefFoundError at first (see above) and other problems later once I got the .jar in, but… how do I know if I am importing this code “the correct way” ? what is the correct way?

  107. Premkumar says

    Hi all,

    we have using mQuickAction.addActionItem(upAction); code for add item.

    similarly what code we have to use for remove item?

  108. Souvik says

    Nice utility you have give here. Can u plz tell me how to change the backgroung of the floating menu, which is currently Black. thanks in advance.

  109. Krishna says

    Very Usefull Blog … it worked me perfect but i am trying to get different images on different options. I used this code but it taking only one images as selected but i need to differ. i did like this if (actionId == ID_DATE_TO_REMEMBER) {
    dateToRemember.setIcon(getResources().getDrawable(R.drawable.datestoremember_active));
    Toast.makeText(getApplicationContext(), “Let’s do some search action”, Toast.LENGTH_SHORT).show();
    }

    but it is not working… can you suggest me how to solve ???? Thanks in Advance

  110. samolo says

    Hi,

    I am attempting to change the title on an action item after I have created the action item. It doesn’t seem to be updating. I am using the following code:

    quickAction.getActionItem(2).setTitle(“Remove Star”);

  111. M4SH says

    I am trying to integrate this library with ActionBarSherlock. However, quick action menu is not displayed on clicking the action bar item. Any suggestions?

Leave a Reply

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