SlidingPanelLayout

现创建了一个Android开发水友圈，圈内会不定时更新一些Android中高级的进阶资料，欢迎大家带着技术问题来讨论，共同成长进步！（包含资深UI工程师，Android底层开发工程师，Android架构师，原生性能优化及混合优化，flutter专精）；希望有技术的大佬加入，水圈内解决的问题越多获得的权利越大！

一个强大而灵活的SlidingPanelLayout，可以在竖直方向上操控多个panel，实现炫酷的交互效果。

地址：https://github.com/woxingxiao/SlidingUpPanelLayout

image image

使用

allprojects {
   repositories {
    ...
    maven { url "https://jitpack.io" }
   }
}

dependencies {
     // e.g. compile 'com.github.woxingxiao:SlidingUpPanelLayout:1.1.0'
     compile 'com.github.woxingxiao:SlidingUpPanelLayout:${LATEST_VERSION}'
  }

1. java (动态方式)

SlidingUpPanelLayout.setAdapter(new SlidingUpPanelLayout.Adapter() {

      private final int mSize = mWeatherList.size();

      @Override
      public int getItemCount() {
          return mSize;
      }

      @NonNull
      @Override
      public ISlidingUpPanel onCreateSlidingPanel(int position) {
          WeatherPanelView panel = new WeatherPanelView(DemoActivity1.this);
          if (position == 0) {
              panel.setSlideState(EXPANDED);
          } else {
              panel.setSlideState(HIDDEN);
          }

          return panel;
      }

      @Override
      public void onBindView(final ISlidingUpPanel panel, int position) {
          if (mSize == 0)
              return;

          BaseWeatherPanelView BasePanel = (BaseWeatherPanelView) panel;
          BasePanel.setWeatherModel(mWeatherList.get(position));
          BasePanel.setClickable(true);
          BasePanel.setOnClickListener(new View.OnClickListener() {
              @Override
              public void onClick(View v) {
                  if (panel.getSlideState() != EXPANDED) {
                      mSlidingUpPanelLayout.expandPanel();
                  } else {
                      mSlidingUpPanelLayout.collapsePanel();
                  }
              }
          });
      }
  });

2. xml (静态方式)

<?xml version="1.0" encoding="utf-8"?>
<com.xw.repo.supl.SlidingUpPanelLayout
    android:id="@+id/sliding_up_panel_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- 背景view, 在位置0处只能有一个直接子view，可以是一个view也可以是一个layout。-->
    <android.support.constraint.ConstraintLayout
        android:id="@+id/bg_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#616161">

        <TextView
            android:id="@+id/pick_hint_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginTop="120dp"
            android:text="Pick a credit card to pay"
            android:textColor="@android:color/white"
            android:textSize="20sp"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

        <TextView
            android:id="@+id/pay_hint_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="260dp"
            android:alpha="0.0"
            android:drawablePadding="8dp"
            android:drawableTop="@mipmap/ic_finger_print"
            android:text="Pay with Touch ID"
            android:textColor="@android:color/white"
            android:textSize="18sp"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            tools:alpha="1.0"/>
    </android.support.constraint.ConstraintLayout>

    <!-- panel view, 从位置1到最后，这些子view必须是实现了ISlidingUpPanel接口的view.-->
    <com.xw.sample.slidinguppanellayout.demo2.CardPanelView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cpv_cardCount="4"
        app:cpv_cardImageRes="@mipmap/pic_card1"
        app:cpv_cardPosition="0"/>

    <com.xw.sample.slidinguppanellayout.demo2.CardPanelView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cpv_cardCount="4"
        app:cpv_cardImageRes="@mipmap/pic_card2"
        app:cpv_cardPosition="1"/>

    <com.xw.sample.slidinguppanellayout.demo2.CardPanelView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cpv_cardCount="4"
        app:cpv_cardImageRes="@mipmap/pic_card3"
        app:cpv_cardPosition="2"/>

    <com.xw.sample.slidinguppanellayout.demo2.CardPanelView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cpv_cardCount="4"
        app:cpv_cardImageRes="@mipmap/pic_card4"
        app:cpv_cardPosition="3"/>

</com.xw.repo.supl.SlidingUpPanelLayout>

注意

• 当你的PanelView实现ISlidingUpPanel后，计算需要准确无误才能确保SlidingUpPanelLayout工作正常。通常情况可参考我的demo来改。

• 不要为你的PanelView设置onTouchListener监听，否则可能造成SlidingUpPanelLayout工作异常。

• 不要加载太多的PanelView，因为没有考虑回收机制，过多必然会影响性能。

属性

 <attr name="spl_disableSliding" format="boolean"/>
   <attr name="spl_expandThreshold" format="float"/>
   <attr name="spl_collapseThreshold" format="float"/>