Android——ListView可隐藏的toolbar

本文主要实现的是toolbar与listview结合，实现上滑隐藏toolbar，下滑显示toolbar的样式

• 先看看效果

GIF2.gif

• 布局文件

使用的是framelayout使listview与toolbar重叠，因为隐藏toolbar时，listview上面不能留空；

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <ListView
        android:id="@+id/lv_container"
        android:layout_width="match_parent"
    android:layout_height="match_parent"></ListView>
    <include layout="@layout/toolbar"></include>
</FrameLayout>

• 给listview设置滑动监听

根据listview的滑动方向显示与隐藏toolbar，使用ObjectAnimator控制toolbar的动画；

//获取系统的最小滑动距离
int touchSlop = ViewConfiguration.get(this).getScaledTouchSlop();
//滑动监听
listView.setOnTouchListener(new View.OnTouchListener() {
    int startY;
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        int director = -1;
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:{
                startY = (int) event.getY();
                break;
            }
            case MotionEvent.ACTION_MOVE:{
                int lastY = (int) event.getY();
                int dy = startY - lastY;
                if (Math.abs(dy) > touchSlop) {
                    if (dy > 0) {
                        //上滑
                        director = 1;
                    } else {
                        //下滑
                        director = 0;
                    }
                }

                if (director == 1) {
                    //上滑，隐藏toolbar
                    if (isShow) {
                        isShow = !isShow;
                        toolbarAnim(0);
                    }
                } else if (director == 0){
                    //下滑，显示toolbar
                    if (!isShow){
                        isShow = !isShow;
                        toolbarAnim(1);
                    }
                }
                break;
            }
            case MotionEvent.ACTION_UP:{

                break;
            }
        }
        return false;
    }
});

• toolbar的显示及隐藏动画

使用ObjectAnimator控制toolbar的y方向偏移，0是toolbar的原点；

private void toolbarAnim(int type) {
    //先让之前的动画停止
    if (mAnimator != null && mAnimator.isRunning()) {
        mAnimator.cancel();
    }
    if (type == 0) {
        //隐藏toolbar
        mAnimator = ObjectAnimator
        .ofFloat(toolbar,"translationY",toolbar.getTranslationY(),-toolbar.getHeight());
    } else if (type == 1) {
        //显示toolbar
        mAnimator = ObjectAnimator
        .ofFloat(toolbar,"translationY",toolbar.getTranslationY(),0);
    }
    mAnimator.start();
}

• 防止listview第一条数据遮挡

我们在listview的第一个item前面添加一个空白的headview，这样实现一个占位功能，让listview整体下移，防止滑动到第一条数据时被toolbar遮挡；

mDatas = new String[50];
for (int i=0; i<mDatas.length; i++) {
    mDatas[i] = "测试"+i;
}
ArrayAdapter<String> adapter = new ArrayAdapter<>(getApplicationContext(),android.R.layout.simple_list_item_1,mDatas);
listView.setAdapter(adapter);
//添加一个headview，防止顶部第一条item被toolbar遮挡
View head = new View(getApplicationContext());
AbsListView.LayoutParams params = new AbsListView.LayoutParams(
        AbsListView.LayoutParams.MATCH_PARENT,
        UIUtils.getActionBarHeight());
head.setLayoutParams(params);
listView.addHeaderView(head);