Sunday, August 8, 2010

Overlay on Android ListView

I was searching for some solution to display an Overlay on ListView, just like what I can do over the MapView. As Android Framework doesn't support multi-hierarchy views in Z-Axis, so it looks challenging. The solution lies behind overwriting standard ListView. The benefit from this feature is multiple, you can display your custom popup over list and there are many more use cases.
In the above screen shot, I have displayed my "selection palette" (Map Pin Icon and List Icon) at the bottom. You can hide/show the palette by clicking the "green triangle" section.


How I can do that-
There are 2 steps-

1. Drawing-
The trick is overriding dispatchDraw(Canvas canvas) method of ListView. This method gets called from Android Framework once List drawing is over. So, whatever you draw inside of dispatchDraw(Canvas canvas), comes in the foreground. You get drawing control over the whole screen, so you can draw popup at anywhere on the screen.

2. Click Event Handling-
To intercept user click events, you need to define Region and need to restrict ListView to handle clicks which falls under your custom Region. You can read my previous post on Region handling in Canvas.
To intercept click events, you need to overwrite onTouchEvent(MotionEvent e).

You can download the complete source from here.

3 comments:

  1. Thanks for posting this example! It really helped me figure out how to address a specific challenge I'm having with my current app.

    Cheers,
    Rein

    ReplyDelete
  2. Dear All,

    I have hosted all sample code on code.google.com-
    http://code.google.com/p/android-java-sample-code/downloads/list

    Thanks,
    Prasanta

    ReplyDelete
  3. Thanks, I was looking for how to do exactly this and your example was really helpful.

    ReplyDelete