Nexus 7 layout issue with sliding drawer

Question

Right now in my app I have a sliding drawer on the the right side of the screen that a user can pull to the left to see more details. The problem lies with the "Handle" of the sliding drawer. On ALL devices it looks great and is where it should be. However, on the Nexus 7 there is extra space to the right.

The brown space shouldn't be there int he middle

Here is my layout code. Please help identify why Nexus 7 is different. Thanks.

 <com.app.android.apps.app.views.DragContentSlidingDrawer
                   android:id="@+id/drawer"
                   android:layout_width="match_parent"
                   android:layout_height="fill_parent"
                   ancestry:orientation="horizontal"
                   android:layout_alignParentRight="true"
                   ancestry:handle="@+id/panel_slider2"
                   ancestry:content="@+id/panel_frame"
                   ancestry:allowSingleTap="false" >

    <ImageView android:layout_width="wrap_content"
               android:layout_height="fill_parent"
               android:id="@+id/panel_slider2"
               android:src="@drawable/panel_handle"
               android:scaleType="fitXY"
               android:layout_alignParentRight="true"

            />


    <RelativeLayout android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:gravity="right"
                    android:id="@+id/panel_frame">

        <LinearLayout android:layout_width="fill_parent"
                      android:layout_height="fill_parent"
                      android:gravity="right"
                      android:layout_alignParentBottom="true"
                      android:layout_alignParentRight="true"
                      android:id="@+id/panel_layout">

            <FrameLayout android:layout_height="fill_parent"
                         android:layout_width="fill_parent"
                         android:id="@+id/panel_layout_holder"
                         android:background="@color/background"/>

        </LinearLayout>

    </RelativeLayout>

</com.app.android.apps.app.views.DragContentSlidingDrawer>

Could you also post the code you use to load this layout? Also I'm not totally clear on what the screenshot is. Is the dark brown vertical bar in the center the handle you mentioned? — dokkaebi, Oct 16 '12 at 17:43
dokkaebi, That image is a screenshot of the sliding drawer. The dark brown portion is the space that is not wanted. And actually, I found a fix for the problem. I'll post an answer. — Kent Andersen, Oct 16 '12 at 17:59

score 1 · Accepted Answer · answered Oct 16 '12 at 18:03

It looks like I didn't post quite enough to solve this problem. The code that is drawing the handle is an overridden method of "dispatchDraw" from "Viewgroup". To solve the problem, in that method, I detect the handles position and fix it using the code below.

 if (mHandle.getLeft() == 0) {
        handle.offsetLeftAndRight(10);
    }

It still doesn't quite make sense why this would only happen on the Nexus 7, but in the end, this fixes it.

score 1 · Answer 2 · edited Nov 26 '12 at 07:50

It seems like you have done mistake with XML code. Try the following corrections:

<com.app.android.apps.app.views.DragContentSlidingDrawer
                   android:id="@+id/drawer"
                   android:layout_width="**fill_parent**"
                   android:layout_height="fill_parent"
                   ancestry:orientation="horizontal"
                   android:layout_alignParentRight="true"
                   ancestry:handle="@+id/panel_slider2"
                   ancestry:content="@+id/panel_frame"
                   ancestry:allowSingleTap="false" >

Nexus 7 layout issue with sliding drawer

2 Answers2