利用接口回调实现ListView滑动显示和隐藏购物车效果

第一次写博客, 内心还是有些小紧张的, 由于水平有限, 写一些小效果, 多多支持....

在一些App上, ListView滑动一会就会有卫星菜单或者购物车出现, 向上滑动然后消失, 利用ListView的滑动监听setOnScrollListener很简单就可以实现

//1.利用监听
        listView.setOnScrollListener(new AbsListView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(AbsListView view, int scrollState) {
            }

            @Override
            public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
                Log.d("MainActivity", "firstVisibleItem:" + firstVisibleItem);
                Log.d("MainActivity", "visibleItemCount:" + visibleItemCount);
                Log.d("MainActivity", "totalItemCount:" + totalItemCount);
                if (firstVisibleItem > 5 ){
                    bottomView.setVisibility(View.VISIBLE);
                } else {
                    bottomView.setVisibility(View.GONE);
                }
            }
        });

可能这些参数不明白是什么意思, 解释起来不太好理解, 建议log一下, 参数的含义很容易就明白代表什么了.

当然, 这是最简单的方法, 我要说的是利用接口回调来完成这一小效果

首先, 要定义一个接口, 来控制购物车的显示与隐藏:

public interface IBarStateChangeListener {
    void onShow();
    void onHide();
}

然后, 在ListView的适配器中定义接口的对象, 然后提供一个set方法(由于ListView的适配器比较简单, 就不全部贴出来了)

 //定义接口对象
    private IBarStateChangeListener iBarStateChangeListener;
    //提供set方法
    public void setiBarStateChangeListener(IBarStateChangeListener iBarStateChangeListener) {
        this.iBarStateChangeListener = iBarStateChangeListener;
    }

然后在适配器的getView方法中设置回调触发机制

//设置回调触发机制
        if (position > 15 && iBarStateChangeListener != null){
            //接口回调(通过接口发出命令)
            iBarStateChangeListener.onShow();
        } else {
            iBarStateChangeListener.onHide();
        }

建议将ListView的position设置大一点, 这样效果比较明显

适配器中的工作结束了, 接下来就可以在activity(Fragment)中回调接口

 //利用接口回调, 通过适配器
        adapter.setiBarStateChangeListener(new IBarStateChangeListener() {
            @Override
            public void onShow() {
                bottomView.setVisibility(View.VISIBLE);
            }

            @Override
            public void onHide() {
                bottomView.setVisibility(View.GONE);
            }
        });

到此, 这一小效果就可以实现了, 下面给出布局文件

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--装载ListView-->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ListView
            android:id="@+id/main_list"
            android:scrollbars="none"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </RelativeLayout>

    <!--随着滑动显示的视图-->
    <LinearLayout
        android:id="@+id/bottom_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginBottom="10dp"
        android:layout_gravity="bottom"
        android:visibility="gone"
        android:background="@android:color/holo_orange_light">
        <ImageView
            android:src="@mipmap/ic_launcher"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="购买"/>
    </LinearLayout>

</FrameLayout>

效果图就不展示了, 主要是动态图不太会整, 相信大家可以想象出来, 代码比较少, demo就不贴了.

博客经验比较少, 不足之处大家多多包涵!!!

如果想要更炫的效果, 大家可以参考

https://github.com/makovkastar/FloatingActionButton