上章讲了CoordinatorLayout的卡顿BUG,既然有BUG又没解决,说实话没必要讲下去,但是做事总要有始有终,既然写了就把它写完吧,顶着BUG去写。
四、CoordinatorLayout + 下拉刷新
之前用过,但是在google找不到我心目中的刷新方式,google上写的都是在滑动控件上加一层刷新,而且都是SwipeRefreshLayout。如果你是想实现这样的效果,你直接在google上找代码就是,一大堆。我要做的是在整个CoordinatorLayout 外加一层刷新,入下图的效果。
我们在CoordinatorLayout+ AppBarLayout + ViewPager这个例子上加下拉刷新框架。
1. 准备
我使用的是PullToRefresh框架,但是我会告诉你,你要用SwipeRefreshLayout的做法也是一样的,下拉框架的原理都是那样。
既然是使用PullToRefresh,就要导入PullToRefresh的Module,用过的都知道,没用过的希望先去了解一下。不懂导入Module的赶紧去学。
2.思路
在实现这样一个框架,你想想,就需要在原来的布局中加入一层上拉下拉框架。简单来说,我们要把CoordinatorLayout+ AppBarLayout + ViewPager放到PullToRefresh的中间部分,也就是PullToRefresh的PullToRefreshBase。那我们就需要先写个PullToRefreshBase代表CoordinatorLayout+ AppBarLayout + ViewPager。
注意:
如果你不会用PullToRefresh框架,你肯定看懵逼我接下来的代码,所以不了解这个框架的一定要先学会这个框架的简单用法,比如你写个demo让PullToRefresh装RecyclerView,等你大概会用了再看我接下去的步骤,我也不想写太多基础上的细节。
3.定义PullToRefreshBase
xml布局:
<com.example.kylinarm.coordinatorlayouttest.PullRefreshCoordTest
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/pull"
>
</com.example.kylinarm.coordinatorlayouttest.PullRefreshCoordTest>
布局没什么好解释的。
自定义PullToRefreshBase:
public class PullRefreshCoordTest extends PullToRefreshBase<CoordinatorView> {
private CoordinatorView coordinatorView;
public PullRefreshCoordTest(Context context) {
super(context);
}
public PullRefreshCoordTest(Context context, AttributeSet attrs) {
super(context, attrs);
}
public PullRefreshCoordTest(Context context, Mode mode) {
super(context, mode);
}
public PullRefreshCoordTest(Context context, Mode mode, AnimationStyle animStyle) {
super(context, mode, animStyle);
}
@Override
public Orientation getPullToRefreshScrollDirection() {
return Orientation.VERTICAL;
}
@Override
protected CoordinatorView createRefreshableView(Context context, AttributeSet attrs) {
coordinatorView = new CoordinatorView(context);
return coordinatorView;
}
@Override
protected boolean isReadyForPullEnd() {
return false;
}
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
@Override
protected boolean isReadyForPullStart() {
// 或者判断CoordinatorView是否全部展开
return coordinatorView.getScrollY() == 0 && coordinatorView.getmVerticalOffset() >= 0;
}
public CoordinatorView getCoordinatorView() {
return coordinatorView;
}
}
介绍:
(1)CoordinatorView就是我们的CoordinatorLayout+ AppBarLayout + ViewPager,等下会放这个view具体处理的代码。
(2)createRefreshableView()方法就是创建嵌套在PullToRefresh里面的view,这是基础。
(3)isReadyForPullStart(),这个方法很重要,是判断什么时候可以下拉刷新,里面是一个算法,这个算法我放到最后讲。
4. 定义CoordinatorView(CoordinatorLayout+ AppBarLayout + ViewPager)
public class CoordinatorView extends FrameLayout {
@InjectView(R.id.tl_tab)
TabLayout tlTab;
@InjectView(R.id.vp_content)
MyViewPager vpContent;
@InjectView(R.id.appbar)
AppBarLayout appbar;
private View contentView;
//记录是否处于展开状态
public int mVerticalOffset = 0;
private String[] titles = {"tab1","tab2"};
private List<Fragment> fragments = new ArrayList<>();
private Context context;
private FragmentActivity fActivity;
public CoordinatorView(Context context) {
super(context);
this.context = context;
if (context instanceof FragmentActivity){
fActivity = (FragmentActivity) context;
}
init();
}
private void init(){
contentView = LayoutInflater.from(getContext()).inflate(R.layout.activity_cv,null);
contentView.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
addView(contentView);
ButterKnife.inject(this,contentView);
appbar.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
mVerticalOffset = verticalOffset;
}
});
}
public void initView(){
for (int i = 0; i < titles.length; i++) {
tlTab.addTab(tlTab.newTab().setText(titles[i]));
}
fragments = setFragmentList();
vpContent.setAdapter(new FragmentPagerAdapter(fActivity.getSupportFragmentManager()) {
@Override
public int getCount() {
return titles.length;
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public CharSequence getPageTitle(int position) {
if (null != titles) {
return titles[position];
}
return super.getPageTitle(position);
}
});
tlTab.setupWithViewPager(vpContent);
}
private List<Fragment> setFragmentList(){
List<Fragment> fragmentList = new ArrayList<>();
fragmentList.add(new ListFragment());
fragmentList.add(new ImageFragment());
return fragmentList;
}
public int getmVerticalOffset() {
return mVerticalOffset;
}
}
其实这里的代码很容易看到,就是CoordinatorLayout+ AppBarLayout + ViewPager的正常操作,不过加了一步很重要的方法:
在init()中
appbar.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
mVerticalOffset = verticalOffset;
}
});
这里是给AppBarLayout加了一个监听事件addOnOffsetChangedListener,这个监听是什么意思呢?就是监听折叠。
这个方法中的verticalOffset表示的是...我也不懂怎么解释好,我就告诉你,当AppBarLayout处于完全展开状态,verticalOffset为0,而当你折叠的时候verticalOffset就变成负数,完全折叠时verticalOffset就变成负的AppBarLayout内折叠控件的高度。这个属性和判断什么时候能下拉有关,一定要先了解。
5.判断下拉
我们在PullRefreshCoordTest 的isReadyForPullStart方法中写了一个算法来判断什么时候能下拉,现在我们在了解完上面的代码之后来讲讲这个算法。
protected boolean isReadyForPullStart() {
// 或者判断CoordinatorView是否全部展开
return coordinatorView.getScrollY() == 0 && coordinatorView.getmVerticalOffset() >= 0;
}
(1)coordinatorView.getScrollY()这个不用讲了,很容易懂
(2)coordinatorView.getmVerticalOffset() >= 0;
什么意思呢?coordinatorView.getmVerticalOffset() 能返回我们第4步中讲的verticalOffset,上面我们说过完全展开的时候是0,折叠之后变成负数。也就是说这句话的意思是完全展开时才能让这个view刷新。
其实也不是很难理解,多看两次代码就能看懂了。记住,要想让CoordinatorLayout刷新,只有在它处于完全展开的时候才能刷新。