android 浮动的View不会跟随ScrollView消失而消失

转载请注明出处王亟亟的大牛之路

标题比较抽象，先上下效果图以及项目结构

向上滑（没到底）

滑到头

反过来就是这个流程再反一反。

如何实现？看下示意图你就懂了

黑色的线是我们的屏幕

蓝色的线模拟的是我们上部的一个布局，我们现在使这个死库水的妹子

红色的线模拟的是我们的那一个打麦麦屁股的一个LinearLayout

那么绿色呢？

绿色其实跟红色的内容是一模一样只是在初始化的时候受否可见为gone，说到这里大家理解了吗？

我们监听ScrollView的滑动当向上滑动的距离大于妹子时，我们的绿色部分就显现出来，反之则隐藏。就是这么简单，那我们来看下代码

自定义的滚动布局CustomScrollView

public class CustomScrollView extends ScrollView {

    View mTopView;
    View mFlowView;
    public CustomScrollView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
    }

    @Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {

        super.onScrollChanged(l, t, oldl, oldt);
        if(mTopView != null && mFlowView != null) {
            if(t >= mTopView.getHeight()) {
                mFlowView.setVisibility(View.VISIBLE);
            } else {
                mFlowView.setVisibility(View.GONE);
            }
        }
    }
    /**
     * 监听浮动view的滚动状态
     * @param topView 顶部区域view，即当ScrollView滑动的高度要大于等于哪个view的时候隐藏floatview
     * @param flowView 浮动view，即要哪个view停留在顶部
     */
    public void listenerFlowViewScrollState(View topView, View flowView) {
        mTopView = topView;
        mFlowView = flowView;
    }
}

主视图MainActivity

public class MainActivity extends Activity {

    private CustomScrollView mScrollView;
    private ImageView mImageView;
    private LinearLayout mFlowLayout;

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

    private void initView() {
        mScrollView = (CustomScrollView) findViewById(R.id.scroll_view);
        mImageView = (ImageView) findViewById(R.id.image_view);
        mFlowLayout = (LinearLayout) findViewById(R.id.flow_llay);
        ListView listview = (ListView) findViewById(R.id.list_view);
        listview.setAdapter(new ListViewDataAdapter(getData(), this));
        listview.setFocusable(false);
        listview.setOnItemClickListener(onItemClickListener);

        setListViewHeightBasedOnChildren(listview);
        //监听浮动view的滚动状态
        mScrollView.listenerFlowViewScrollState(mImageView, mFlowLayout);
        //将ScrollView滚动到起始位置
        mScrollView.scrollTo(0, 0);
    }

    OnItemClickListener onItemClickListener = new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                long arg3) {
            Toast.makeText(MainActivity.this, "菜单"+(arg2+1), Toast.LENGTH_SHORT).show();
        }
    };
    private ArrayList<String> getData() {
        ArrayList<String> data = new ArrayList<String>();
        for(int i=1; i<30; i++) {
            data.add("菜单"+i);
        }
        return data;
    }

    /**
     * 用于解决ScrollView嵌套listview时，出现listview只能显示一行的问题
     * @param listView
     */
     public void setListViewHeightBasedOnChildren(ListView listView) {
         // 获取ListView对应的Adapter
         ListAdapter listAdapter = listView.getAdapter();
         if (listAdapter == null) {
            return;
         }   

         int totalHeight = 0;
         for (int i = 0, len = listAdapter.getCount(); i < len; i++) {
             // listAdapter.getCount()返回数据项的数目
             View listItem = listAdapter.getView(i, null, listView);
            // 计算子项View 的宽高
             listItem.measure(0, 0);
             // 统计所有子项的总高度
                 totalHeight += listItem.getMeasuredHeight();
        }   

         ViewGroup.LayoutParams params = listView.getLayoutParams();
         params.height = totalHeight+ (listView.getDividerHeight() * (listAdapter.getCount() - 1));
         // listView.getDividerHeight()获取子项间分隔符占用的高度
         // params.height最后得到整个ListView完整显示需要的高度
         listView.setLayoutParams(params);
    }
}

主布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <com.jimstin.topfloatdemo.view.CustomScrollView
        android:id="@+id/scroll_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <ImageView
                android:id="@+id/image_view"
                android:layout_width="match_parent"
                android:layout_height="120dp"
                android:background="@drawable/pic01"/>
           <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:background="#4169E1">
                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:textSize="10pt"
                    android:text="打屁股麦麦"
                    android:textColor="#ffffff"/>
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="打他屁股"
                    android:textColor="#ffffff"/>
            </LinearLayout>
            <ListView
                android:id="@+id/list_view"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1">
            </ListView>

        </LinearLayout>
    </com.jimstin.topfloatdemo.view.CustomScrollView>

    <LinearLayout
         android:id="@+id/flow_llay"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:orientation="horizontal"
         android:background="#4169E1"
         android:visibility="gone">
         <TextView
              android:layout_width="0dp"
              android:layout_height="wrap_content"
              android:layout_weight="1"
              android:textSize="10pt"
              android:text="打屁股麦麦"
              android:textColor="#ffffff"/>
          <Button
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="打他屁股"
              android:textColor="#ffffff"/>
     </LinearLayout>
</RelativeLayout>

适配器ListViewDataAdapter

public class ListViewDataAdapter extends BaseAdapter {

    private ArrayList<String> mData = new ArrayList<String>();
    private Context mContext;

    public ListViewDataAdapter(ArrayList<String> mData, Context mContext) {
        super();
        this.mData = mData;
        this.mContext = mContext;
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return mData.size();
    }

    @Override
    public Object getItem(int arg0) {
        // TODO Auto-generated method stub
        return mData.get(arg0);
    }

    @Override
    public long getItemId(int arg0) {
        // TODO Auto-generated method stub
        return 0;
    }

    @Override
    public View getView(int arg0, View convertView, ViewGroup arg2) {
        // TODO Auto-generated method stub
        Holder holder = null;
        if(convertView == null) {
            LayoutInflater inflater = LayoutInflater.from(mContext);
            convertView = inflater.inflate(R.layout.layout_list_view_item, null);
            holder = new Holder();
            holder.avator_iv = (ImageView) convertView.findViewById(R.id.avator);
            holder.name_tv = (TextView) convertView.findViewById(R.id.item_tv);
            convertView.setTag(holder);
        }
        holder = (Holder) convertView.getTag();
        holder.avator_iv.setImageResource(R.drawable.pic02);
        holder.name_tv.setText(mData.get(arg0));
        return convertView;
    }

    class Holder {
        ImageView avator_iv;
        TextView name_tv;
    }
}

东西就这么点，只要想到怎么做的话实现其实并不复杂，源码今天就不传了，因为并没有什么资源文件什么的，这几个类 复制黏贴就能用了，周末愉快

部分内容参考互联网，如有重复请见谅

版权声明：本文为博主原创文章，未经博主允许不得转载。