Android CoordinatorLayout(六) 加入下拉功能

上章讲了CoordinatorLayout的卡顿BUG,既然有BUG又没解决,说实话没必要讲下去,但是做事总要有始有终,既然写了就把它写完吧,顶着BUG去写。

四、CoordinatorLayout + 下拉刷新

之前用过,但是在google找不到我心目中的刷新方式,google上写的都是在滑动控件上加一层刷新,而且都是SwipeRefreshLayout。如果你是想实现这样的效果,你直接在google上找代码就是,一大堆。我要做的是在整个CoordinatorLayout 外加一层刷新,入下图的效果。

image.png

我们在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刷新,只有在它处于完全展开的时候才能刷新。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,294评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,493评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,790评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,595评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,718评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,906评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,053评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,797评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,250评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,570评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,711评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,388评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,018评论 3 316
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,796评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,023评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,461评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,595评论 2 350

推荐阅读更多精彩内容