SlidingUpPanelLayout
介绍:
一个竖直方向的SlidingPanelLayout,支持加载多个Panel,可以灵活地实现漂亮的的交互效果。
运行效果:
使用说明:
1. sample apk
2. gradle
dependencies {
// e.g. compile 'com.xw.repo:SlidingUpPanelLayout:1.0.0@aar'
compile 'com.xw.repo:SlidingUpPanelLayout:${LATEST_VERSION}@aar'
}
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();
}
}
});
}
});
Go to sample for more details.
2. xml (静态方式)
<?xml version="1.0" encoding="utf-8"?>
<com.xw.repo.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.SlidingUpPanelLayout>
Go to sample for more details.
Attentions
-
当你的PanelView实现ISlidingUpPanel后,计算需要准确无误才能确保SlidingUpPanelLayout工作正常。通常情况可参考我的demo来改。
-
不要为你的PanelView设置onTouchListener监听,否则可能造成SlidingUpPanelLayout工作异常。
-
不要加载太多的PanelView,因为没有考虑回收机制,过多必然会影响性能。
Attributes
<attr name="spl_disableSliding" format="boolean"/>
<attr name="spl_expandThreshold" format="float"/>
<attr name="spl_collapseThreshold" format="float"/>
已下载
0