Create a panel that slides up and out of the screen in Android

Question

i need some guidance. I need to make a custom view that touched and drag up the screen slides out of the screen. I have tried this cool library: here but this is dependend to exactly 2 layouts. The one that is slided out and the one that remains after that. What i have now is buggy and ugly.

public class DemoActivity extends Activity {

private SlidingUpPanelLayout mLayout;
private RelativeLayout layout;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_demo);

    layout = (RelativeLayout) findViewById(R.id.panel);
    final int defaulttop = layout.getTop();
    final int defaultbottom = layout.getBottom();

    RelativeLayout dragView = (RelativeLayout) findViewById(R.id.dragView);

    mLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
    mLayout.setDragView(dragView);
    mLayout.setPanelSlideListener(new PanelSlideListener() {

        @Override
        public void onPanelSlide(View panel, float slideOffset) {
        }

        @Override
        public void onPanelExpanded(View panel) {
            System.out.println("panel expanded");
        }

        @Override
        public void onPanelCollapsed(View panel) {
            System.out.println("panel collapsed");
        }

        @Override
        public void onPanelAnchored(View panel) {
            System.out.println("anchored");
        }

        @Override
        public void onPanelHidden(View panel) {
            System.out.println("panel is hidden now");
        }
    });

}

@Override
public void onBackPressed() {
    if (mLayout != null && mLayout.isPanelExpanded()) {
        mLayout.collapsePanel();
    } else {
        super.onBackPressed();
    }
}

}

The layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".DemoActivity" >

    <com.sothree.slidinguppanel.SlidingUpPanelLayout
        xmlns:sothree="http://schemas.android.com/apk/res-auto"
        android:id="@+id/sliding_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent"
        android:gravity="bottom"
        sothree:dragView="@+id/dragView"
        sothree:panelHeight="60dp"
        sothree:paralaxOffset="60dp"
        sothree:shadowHeight="0dp" >

        <RelativeLayout
            android:id="@+id/panel"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/unt"
            android:orientation="vertical" >

            <Button
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:layout_gravity="center"
                android:text="Sleep" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/dragView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/transparent"
            android:clickable="true"
            android:focusable="false" >
        </RelativeLayout>
    </com.sothree.slidinguppanel.SlidingUpPanelLayout>

</RelativeLayout>

it slides up but leaves a white background in the back. If i touch the screen then it slides. So, i need a new path. Did anyone confrunted with something similar? I need a hint, not code. Thanks.

Answer 1

I have used the library you mentioned here and it worked out fine for me. You might have not set the drag view/layout

Do use mSlidingPanelLayout.setDragView(YourLayout) to set the layout that can be dragged

Answer 2

I have done something like this previously but with a button. I did it using Animation class when moving it by OnTouchListener. While you have to be careful while using it and control the X and Y values of the layout.