The ListView that automatically shows and hides the header layout turned out to be that simple

Respect the original, please indicate: From zsml2016 ( http://blog.csdn.net/qq_29269233 ) Power byzsml2016 infringement must be investigated!

Foreword:

I was reading Android advanced books today, and I found that the more I read, the more interesting it became. When I saw the ListView that automatically displays and hides the layout, I was full of curiosity and anticipation, because I was about to solve a mystery that existed in my heart. When I first came into contact with Android, I always wondered why some apps such as Taobao and Jingdong can automatically display and hide the header layout? Today I write this blog from the heart! Next, let's take you to witness the moment of miracle.

1. First, add a HeaderView to the ListView to avoid the first Item being blocked by the header layout:

//1.给listview增加HeaderView
View header = new View(this);
header.setLayoutParams(new AbsListView.LayoutParams(
        ViewGroup.LayoutParams.MATCH_PARENT ,
 // The height varies according to the screen and the size is different
 // ( R.dimen.abc_action_bar_default_height_material can be used here )
 ( int ) getResources().getDimension(                        
                R.dimen.abc_action_bar_default_height_material)));
mlistview.addHeaderView(header);

2. Define variables to set the minimum sliding distance of listview (obtained by the system)

//2. Get the minimum sliding distance considered by the system
 minInstance = ViewConfiguration. get ( this ).getScaledTouchSlop() ;

3. Set the sliding monitoring event of the listview, compare the size with the last coordinate, that is, judge the sliding direction according to the coordinate difference. If it is swiping up, hide the header layout, and if it swipes down, set the display header layout:

//3.判断滑动事件
mlistview.setOnTouchListener(new View.OnTouchListener() {
    @Override
public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                mFirstY = event.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                mCurrentY = event.getY();
                if (mCurrentY - mFirstY >     minInstance ) {
                     status = 0 ;   // down
                 } else {
                     status = 1 ;   // up
                 }
                 if ( status == 1 ) {
                     if ( mShow ) {
                        barAnim( 1 ) ;   // hide
 mShow = false;
 }                                            
                } else {
                    if (!mShow) {
                        barAnim( 0 ) ; // show
 mShow = true;
 }                                            
                }
                break;
        }
        return false;
    }
});

Fourth, the last step is to add the setting method of the display and hide animation of the header layout:

private void barAnim(int i) {
    if (animator != null && animator.isRunning())
        animator.cancel();
    if (i == 0) {
        animator = ObjectAnimator.ofFloat(
                titlebar,
                "translationY",
                titlebar.getTranslationY(),
                0);
    }else{
        animator = ObjectAnimator.ofFloat(
                titlebar,
                "translationY",
                titlebar.getTranslationY(),
                -titlebar.getHeight());
        }
    animator.start();
}

就是这么简单，向下滑动 ListView ，其顶部布局自动显示；向上滑动 ListView ，其顶部的布局自动隐藏！先给大家看看效果图吧！

到此，大家可以可以简单做个listview去实现一下效果，这里的头文件是用一个Textview写的，如果大家要用toolbar的话，就要注意了，记得主题一定是要NoActionBar的，即：

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

有需要完整源码的帅哥美女们，看这里：Demo

更多精彩内容请关注作者博客：luoweichao.top