Android 实现悬浮的几种方式（二）HeaderView显示隐藏

来源：互联网发布：曾荫权对抗中央知乎编辑：程序博客网时间：2024/06/03 23:40

上篇博客（http://blog.csdn.net/zx_android/article/details/77265902），我使用appbar实现的悬浮，这次试试使用HeaderView，更加灵活。

你可以选择HeaderView里面的任意一个view进行悬浮，但是会有一个小问题

RecyclerView添加headerView，如果该HeaderView的根布局是LinearLayout会出现不能撑满宽度的情况。

可以把根布局换成RelativeLayout或者加条横线来解决此问题。

借鉴于：http://blog.csdn.net/ljfbest/article/details/38765641

这里写图片描述

引用的包：

compile 'com.android.support:cardview-v7:23.2.1'compile 'com.jakewharton:butterknife:7.0.1'compile 'com.zhy:base-rvadapter:3.0.3'compile 'com.zhy:base-adapter:3.0.3'compile 'cn.finalteam.loadingviewfinal:ultra-pull-to-refresh:1.0.1'compile 'cn.finalteam.loadingviewfinal:loading-more-view:1.0.1'

HeaderView中分为3个部分
这里写图片描述

需求是需要suspend_chart悬浮，那么我们就需要添加3个HeaderView。

先贴出布局：

header_chart_top.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <include layout="@layout/layout_line" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:gravity="center_vertical"        android:padding="@dimen/d_15dp">        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="您已筛选"            android:textColor="@color/gray_a"            android:textSize="13sp" />        <TextView            android:id="@+id/tv_time_result"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="3dp"            android:layout_marginRight="3dp"            android:text="今日"            android:textColor="@color/gray_64"            android:textSize="13sp" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="的生产装箱情况"            android:textColor="@color/gray_a"            android:textSize="13sp" />    </LinearLayout>    <include layout="@layout/layout_line" /></LinearLayout>

suspend_chart.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/fl_suspend"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:background="@android:color/white">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="vertical">        <include layout="@layout/layout_line" />        <TextView            android:id="@+id/tv_product_name"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="@dimen/d_15dp"            android:layout_marginTop="@dimen/d_15dp"            android:gravity="center_vertical"            android:text="@string/common_null"            android:textColor="@color/gray_32"            android:textSize="13sp" />        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:orientation="horizontal"            android:padding="@dimen/d_15dp"            android:paddingTop="15dp">            <LinearLayout                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center"                android:orientation="vertical">                <TextView                    android:id="@+id/tv_product_boxs"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="@string/common_null"                    android:textColor="@color/gray_32"                    android:textSize="28dp" />                <TextView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="@dimen/d_10dp"                    android:text="箱"                    android:textColor="@color/gray_a"                    android:textSize="13sp" />            </LinearLayout>            <TextView                android:layout_width="1dp"                android:layout_height="match_parent"                android:background="@color/lineColor" />            <LinearLayout                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center"                android:orientation="vertical">                <TextView                    android:id="@+id/tv_product_singles"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="@string/common_null"                    android:textColor="@color/gray_32"                    android:textSize="28dp" />                <TextView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="@dimen/d_10dp"                    android:text="单标"                    android:textColor="@color/gray_a"                    android:textSize="13sp" />            </LinearLayout>        </LinearLayout>        <include layout="@layout/layout_line_margingtop" />    </LinearLayout></RelativeLayout >

header_chart_bottom.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="vertical">    <include layout="@layout/layout_line" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@drawable/selector_ll_white"        android:gravity="center"        android:padding="@dimen/d_15dp">        <TextView            android:id="@+id/tv_time_details"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:drawableLeft="@mipmap/icon_boxing_40"            android:drawablePadding="@dimen/d_10dp"            android:gravity="center_vertical"            android:text="今日"            android:textColor="@color/gray_32"            android:textSize="14sp" />        <TextView            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:drawablePadding="@dimen/d_10dp"            android:gravity="center_vertical"            android:text="生产装箱情况"            android:textColor="@color/gray_32"            android:textSize="14sp" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:drawablePadding="5dp"            android:drawableRight="@mipmap/ic_arrow_right"            android:text="详情"            android:textColor="@color/gray_a"            android:textSize="14sp" />    </LinearLayout></LinearLayout>

layout_line.xml

<?xml version="1.0" encoding="utf-8"?><View xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="@dimen/height_line"    android:background="@color/lineColor" />

最后主Activity的布局：activity_chart.xml

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent">    <include layout="@layout/layout_recycler_view_loading" />    <include layout="@layout/suspend_chart"/></FrameLayout>

layout_recycler_view_loading.xml

<?xml version="1.0" encoding="utf-8"?><merge xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto">    <!--使用PtrClassicFrameLayout套RecyclerViewFinal-->    <cn.finalteam.loadingviewfinal.PtrClassicFrameLayout        android:id="@+id/ptr_rv_layout"        android:layout_width="match_parent"        android:layout_height="match_parent"        app:ptr_duration_to_close="300"        app:ptr_duration_to_close_header="1500"        app:ptr_keep_header_when_refresh="true"        app:ptr_ratio_of_header_height_to_refresh="1.2"        app:ptr_resistance="1.7">        <cn.finalteam.loadingviewfinal.RecyclerViewFinal            android:id="@+id/rv_list"            android:layout_width="match_parent"            android:descendantFocusability="beforeDescendants"            android:layout_height="match_parent"            android:cacheColorHint="#00000000"            app:loadMoreMode="click|scroll"            app:loadMoreView="cn.finalteam.loadingviewfinal.DefaultLoadMoreView"            app:noLoadMoreHideView="false" />    </cn.finalteam.loadingviewfinal.PtrClassicFrameLayout></merge>

布局定好了，剩下的就简单了。

第一步：初始化主页面View和各个HeaderView

    public class StockInProductChartActivity extends StateViewActivity {    private static final int REQUEST_CODE_TIME = 1;    @Bind(R.id.rv_list)    RecyclerViewFinal mRvList;    @Bind(R.id.ptr_rv_layout)    PtrClassicFrameLayout mPtrRvLayout;    @Bind(R.id.tv_product_name)    TextView tvProductName;    @Bind(R.id.tv_product_boxs)    TextView tvProductBoxs;    @Bind(R.id.tv_product_singles)    TextView tvProductSingles;    @Bind(R.id.fl_suspend)    RelativeLayout flSuspend;    private View headerViewTop;    private View headerViewBottom;    private View suspendView;

    private void initHeaderView() {        LayoutInflater layoutInflater = LayoutInflater.from(this);        //上方的header        headerViewTop = layoutInflater.inflate(R.layout.header_chart_top, null);        //悬浮的Header        suspendView = layoutInflater.inflate(R.layout.suspend_chart, null);        suspendViewHolder = new SuspendViewHolder();        ButterKnife.bind(suspendViewHolder, suspendView);        //下方的header        headerViewBottom = layoutInflater.inflate(R.layout.header_chart_bottom, null);        mRvList.addHeaderView(headerViewTop);        mRvList.addHeaderView(suspendView);        mRvList.addHeaderView(headerViewBottom);    }

    //悬浮view    static class SuspendViewHolder {        @Bind(R.id.tv_product_name)        TextView tvProductName;        @Bind(R.id.tv_product_boxs)        TextView tvProductBoxs;        @Bind(R.id.tv_product_singles)        TextView tvProductSingles;        //根布局        @Bind(R.id.fl_suspend)        RelativeLayout flSuspend;    }

第二步：初始化RecyclerView

        linearLayoutManager = new LinearLayoutManager(this);        linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);        mRvList.setLayoutManager(linearLayoutManager);

第三步，重点来了，监听滚动事件，判断显示隐藏

        mRvList.addOnScrollListener(new RecyclerView.OnScrollListener() {            @Override            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {                super.onScrollStateChanged(recyclerView, newState);            }            @Override            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {                super.onScrolled(recyclerView, dx, dy);                int position = linearLayoutManager.findFirstVisibleItemPosition();                //当滚动到第二个View的时候，显示悬浮view                if (position >= 1) {                    flSuspend.setVisibility(View.VISIBLE);                    tvProductName.setText(suspendViewHolder.tvProductName.getText());                    tvProductBoxs.setText(suspendViewHolder.tvProductBoxs.getText());                    tvProductSingles.setText(suspendViewHolder.tvProductSingles.getText());                } else {                    flSuspend.setVisibility(View.GONE);                }            }        });

大功告成啦！

阅读全文

0 0