Android SlidingDrawer from top?
Is there any way to make the drawer slide from top to bottom?
Solution 1:
I've found a simple way to do that. All you have to do is to set the rotation of 180º for the slidingDrawer, the content and the handle. It's easier to understand with an example, so look what I've done:
First, I'll show you my old SlidingDrawer, from bottom to top.
<SlidingDrawer xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/slidingDrawer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:handle="@+id/handle"
android:content="@+id/content">
<ImageView android:id="@+id/handle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher" />
<ImageView android:id="@+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FF0000"
android:src="@drawable/ic_launcher" />
</SlidingDrawer>
Now look at the changes I made, setting the rotation of 180º
<SlidingDrawer xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/slidingDrawer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:handle="@+id/handle"
android:content="@+id/content"
android:rotation="180">
<LinearLayout android:id="@+id/handle"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher"
android:rotation="180" />
</LinearLayout>
<ImageView android:id="@+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FF0000"
android:src="@drawable/ic_launcher"
android:rotation="180" />
</SlidingDrawer>
Note that I also created a LinearLayout to set as handle, and didn't change it's rotation, but I changed the rotation of it's child. This was to prevent a small issue I had, but everything is working fine and it's simple.
Solution 2:
The default SlidingDrawer
class doesn't allow this. You can use the Panel
class from here to get something very similar though:
http://code.google.com/p/android-misc-widgets/
http://www.ohloh.net/p/android-misc-widgets
Solution 3:
I was very unsatisfied with the solutions provided here:
- The
Panel
class from http://code.google.com/p/android-misc-widgets/ was really unintuitive to use and also had bugs and visual glitches (unusable for productive use) and no docs at all -
SlidingTray
class from http://aniqroid.sileria.com/doc/api/ was nested in a lib needing too much dependency and for me I did not get it to work at all - using
android:rotation="180"
requires API Level 11, and my target is 10.
(no offense to the respective devs, trying to be objective here)
So my solution was to extract SlidingTray from this lib http://aniqroid.sileria.com/doc/api/ (by Ahmed Shakil) and
refactored it a bit since it had some quirks needed to be used within Ahmed's lib. SlidingTray
is based on Androids own SlidingDrawer
, so I guess it is stable. My modification consists of 1 class which I called MultipleOrientationSlidingDrawer
and
you have to add declare-styleables in your attrs.xml. Other than that it has pretty much the same usage as SlidingDrawer
with the additional "orientation" attribute..
Check it out: MultipleOrientationSlidingDrawer (source & example) @ gist
Here is a usage example (also provided in the gist)
<your.app.MultipleOrientationSlidingDrawer
xmlns:custom="http://schemas.android.com/apk/res-auto/your.app"
android:layout_width="match_parent"
android:layout_height="match_parent"
custom:handle="@+id/handle_c"
custom:content="@+id/content_c"
custom:orientation="top">
<RelativeLayout
android:id="@id/handle_c"
android:layout_width="match_parent"
android:layout_height="30dp"
android:background="#333333">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Handle Text"
android:gravity="left|center_vertical"/>
</RelativeLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@id/content_c"
android:background="#555555">
<ListView
android:id="@+id/listview_credits"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
</your.app.MultipleOrientationSlidingDrawer>
Disclaimer: All the credits go to respective dev. I did not test this solution extensivly, it works great with TOP and BOTTOM set in XML. I did not try to use it programmatically.
Solution 4:
I had to do the same for one of my projects and I ended up writing my own widget for this. I called it SlidingTray is now part of my open source Aniqroid library.
http://aniqroid.sileria.com/doc/api/ (Look for downloads at the bottom or use google code project to see more download options: http://code.google.com/p/aniqroid/downloads/list)
The class documentation is here: http://aniqroid.sileria.com/doc/api/com/sileria/android/view/SlidingTray.html