슬라이딩 업 레이아웃(SlidingUpPanelLayout) 구현일기..

2020. 11. 7. 22:23모바일/Android_Java

SlidingUpPanelLayout

요즘 나오는 앱들..

네이버, 네이버카페

에어비앤비, 빔등등

거의 대부분의 앱에서 사용되고있는 슬라이딩 업 패널 레이아웃이다

혼자 구현하기 버거워서 자료를 찾아보니 오픈소스로 공개되어있는 코드가 있었음..

아래내용을 gradle에

    //sliding up layout
    implementation 'com.sothree.slidinguppanel:library:3.4.0'

추가하고..

<SlidingUpPanelLayout>

    <본문>
    </본문>
                  <LinearLayout
                android:id="@+id/dragView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/border_round_white"
                android:clickable="true"
                android:focusable="false"
                android:orientation="vertical">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="150dp"
                    android:background="@drawable/border_round_white"
                    android:orientation="vertical">
                    <View
                        android:layout_width="50dp"
                        android:layout_height="5dp"
                        android:background="@drawable/border_rounded_white"
                        android:layout_marginTop="@dimen/dimen_10"
                        android:layout_marginBottom="@dimen/dimen_10"
                        android:layout_gravity="center_horizontal"/>
                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingLeft="16sp"
                        android:textColor="@color/white"
                        android:text="Action"
                        android:textSize="24sp" />
                </LinearLayout>

                <!-- 스크롤 해서 보여줄 부분은 listview 또는 custom listview 또는 recyclerview를 사용 -->
                <ListView
                    android:id="@+id/listView"
                    android:layout_width="match_parent"
                    android:layout_height="300dp">
                </ListView>
            </LinearLayout>

</SlidingUpPanelLayout>

이런방식으로 구현하면 된다..

사용법

 layout.setPanelSlideListener(new PanelSlideListener() {

        @Override
        public void onPanelSlide(View panel, float slideOffset) {
            // TODO Auto-generated method stub

        }

        @Override
        public void onPanelCollapsed(View panel) {
            // TODO Auto-generated method stub
            //Anything you put here is going to happen if the view is closed
        }

        @Override
        public void onPanelExpanded(View panel) {
            // TODO Auto-generated method stub
            //Anything you put here is going to happen if the view is open
        }

        @Override
        public void onPanelAnchored(View panel) {
            // TODO Auto-generated method stub

        }
    });
layout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED); //to close
layout.setPanelState(SlidingUpPanelLayout.PanelState.EXPANDED); //to open

찾아봐야할일

  • 일단 아래 패널레이아웃을 round속성을 적용하여 border를 corner로 만들었는데 내부적으로 배경을 흰색으로 만들고있는것같다..
    이것을 transparent로 만들어야 예쁠텐데 어떻게하지 ㅠㅠ