美文网首页
Android——ListView可隐藏的toolbar

Android——ListView可隐藏的toolbar

作者: carrot_4d8d | 来源:发表于2018-11-22 10:16 被阅读0次

本文主要实现的是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);

相关文章

网友评论

      本文标题:Android——ListView可隐藏的toolbar

      本文链接:https://www.haomeiwen.com/subject/pjikqqtx.html