android顶部悬停效果(仅用ListView实现)

先看一下效果图。。。

主要说的是原理。所以界面丑就丑点，大家凑合着看吧。

1.布局文件
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/comment_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentStart="true" />
    <LinearLayout
        android:visibility="gone"
        android:id="@+id/comment_bar"
        android:background="#ffffff"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="vertical" >
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="悬停框\n悬停框"
            android:textSize="18dp"
            />
    </LinearLayout>
</RelativeLayout>

(1)布局最好是选择Relativelayout，这样悬停框就会直接在最上面出现。
(2)设置其可见度为GONE（不可见且不占用屏幕空间）
(3)背景色设置为白色(否则会是透明，可以自己去试试看看效果)
(4)给定一个固定高度，后面要用到

header_view.xml(ListView的头部布局)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="内容\n内容\n内容\n内容\n内容"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="悬停框\n悬停框"
        android:textSize="18dp"/>
</LinearLayout>

(1)布局随意写，但是一定要存在悬停框。。。（自己体会）

2.主要代码

MainActivity

public class MainActivity extends AppCompatActivity{

    private ListView comment_list;
    private LayoutInflater inflater;
    private View headerView;
    private LinearLayout comment_bar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
        addListContent();
    }

    private void initView() {
        comment_bar = (LinearLayout)findViewById(R.id.comment_bar);

        comment_list = (ListView) findViewById(R.id.comment_list);
        inflater = LayoutInflater.from(this);
        //找到头部布局文件
        headerView = inflater.inflate(R.layout.header_view,null);
        //给列表添加头部
        comment_list.addHeaderView(headerView);
        //绑定滑动监听
        comment_list.setOnScrollListener(new AbsListView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(AbsListView view, int scrollState) {

            }
            @Override
            public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
                //得到头部（没有添加头部则是第一项）
                View c = comment_list.getChildAt(0);
                if(c == null){return ;}
                //显示在屏幕中的第一个子项
                int firstVisiblePosition = comment_list.getFirstVisiblePosition();
                //得到头部与标题栏的距离
                int top = c.getTop();
                //得到实际滑动距离
                int scrollvalue = -top+firstVisiblePosition*c.getHeight();
                //将dp转化为px
                float scale = getApplication().getResources().getDisplayMetrics().density;
                //这里的50(dp)即悬停框的高度设定
                int dpvalue = (int)(50*scale + 0.5f);
                //悬停框显示需要滑动的距离(头部布局的高度减去悬停框的高度)
                int pxvalue = c.getHeight() - dpvalue;

                //前面为实际滑动距离
                if(scrollvalue < pxvalue){
                    comment_bar.setVisibility(View.GONE);
                }else{
                    comment_bar.setVisibility(View.VISIBLE);
                }
            }
        });
    }

    public void addListContent(){
        //创建数组List，用来存放要显示的内容
        List<String> list = new ArrayList<String>();
        for (int i = 0; i < 20; i++){
            list.add("listView item" + i);
        }
        //将数据与适配器adapter连接     android.R.layout.simple_list_item_1是android内置的布局文件，里面只有一个TextView
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,android.R.layout.simple_list_item_1,list);
        //将适配器添加到listView
        comment_list.setAdapter(adapter);
    }
}

代码不难，希望大家有所收获。