CODEWITHSUNDEEP
androidandroid-slidingslidingpanelayout
Rethinavel
Rethinavel

Reputation: 3952

How to hide the Umano SlidingupPanel when clicking outside the panel

AndroidSlidingUpPanel

Here, I am using slidingup panel library. You can see both the panel and listview in the following screen. What i am trying to do is to hide the panel if i click outside the panel(Dim Area). Instead it is clicking on the listview in the above layout. How can i achieve this?

enter image description here

Here is the XML,

 <?xml version="1.0" encoding="utf-8"?>
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res/com.voucher.point.activity"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical" >

<!-- sothree:dragView="@+id/dragView" -->

<com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="bottom"
    app:fadeColor="@color/transparent"
    sothree:panelHeight="40dip"
    sothree:paralaxOffset="200dp" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@color/white"
        android:orientation="vertical" >

        <ListView
            android:id="@+id/offersList"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scrollbars="none"
            android:visibility="gone" >
        </ListView>

    </LinearLayout>

    <include
        android:id="@+id/bottom_menu"
        android:layout_width="fill_parent"
        android:layout_height="270dip"
        layout="@layout/side_menu" />
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

Can i do like this?

Upvotes: 12

Views: 10814

Answers (7)

Homayoon Ahmadi
Homayoon Ahmadi

Reputation: 2833

The answered code didn't work for me. Unfortunately this event does not capture a click on part of my UI.

So for doing that, set an id for main content (first child of SlidingUpPanelLayout) and call this:

findViewById(R.id.main_content).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if(slidingUpPanelLayout.getPanelState() != SlidingUpPanelLayout.PanelState.COLLAPSED){
                    slidingUpPanelLayout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED);
                }
            }
        });

Upvotes: 0

Mohamed AbdelraZek
Mohamed AbdelraZek

Reputation: 2799

to hide it totaly

mLayout.setFadeOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        mLayout.setPanelState(SlidingUpPanelLayout.PanelState.HIDDEN);
    }
});

Upvotes: 1

Annie Aye Myat
Annie Aye Myat

Reputation: 247

//to hide when you touch overlay

    mLayout.setFadeOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            mLayout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED);
        }
    });

Upvotes: 3

aytek
aytek

Reputation: 1942

With the version 3.3.0 and later, it's possible to do that in the following way

final SlidingUpPanelLayout slidingUpPanelLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
slidingUpPanelLayout.setFadeOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        slidingUpPanelLayout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED);
    }
});

source

Upvotes: 15

Hesam
Hesam

Reputation: 53600

I believe you have fixed your problem but for others who has same requirement I added another View on top of my map (in xml layout) and set it's touch click-ability.

So my xml file is like this:

<com.sothree.slidinguppanel.SlidingUpPanelLayout
        android:id="@+id/sliding_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/booking_confirm_layout"
        android:gravity="bottom"
        app:umanoFadeColor="@color/black_75_percent"
        app:umanoOverlay="true"
        app:umanoPanelHeight="111dp"
        app:umanoShadowHeight="0dp">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <com.google.android.gms.maps.MapView
                android:id="@+id/map_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="96dp" />

            <View
                android:id="@+id/mapCover"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/transparent"/>
        </FrameLayout>

 <LinearLayout>
.
.
.
</LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

And in the code:

this.mMapCover = findViewById(R.id.mapCover);
        this.mMapCover.setOnTouchListener(new View.OnTouchListener()
        {
            @Override
            public boolean onTouch(View v, MotionEvent event)
            {
                if (mSlidingPanel.getPanelState() != PanelState.COLLAPSED)
                {
                    mSlidingPanel.setPanelState(PanelState.COLLAPSED);
                    return true;
                }

                return false;
            }
        });

Upvotes: 10

Omid Aminiva
Omid Aminiva

Reputation: 667

you can add a onClickListener or onTouchListener to the outside panel and ontouch or oncick call slidingPanelLayout.expandPane(0)

findViewById(R.id.bg_panel).setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {

                slidingPanelLayout.expandPane(0);
                return false;
            }

Upvotes: 0

Shreyash Mahajan
Shreyash Mahajan

Reputation: 23596

Your slidingUp panel contain whole screen then how you detect the click on outside of screen. If you are targeting it to only for "HideMenu" and "ShowMenu" then it is possible to do.

Otherwise with Full Screen SlidingUp Panel you can able to hide it by click back android button or any click event on the panel it self.

Let me know if my answer not resolve your problem.

Enjoy Coding... :)

Upvotes: -1

Related Questions