头行固定的自由滑动表格的简单实现

表格在上下滑动时，头行是固定的，且不需要设置联动。效果截了几张图：

右滑、下滑、选中：

结构如下：

表头LinearLayout和表内容ListView的每一项Item是同一个LinearLayout，如果想要不同的也行，但是设置好宽度，不然后面显示起来会对不齐。

Item的xml代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/tv_pointid_listitem"
        android:layout_width="@dimen/width_pointid"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/point_id"/>

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_dataset_listitem"
        android:layout_width="@dimen/width_dataset"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/dataset" />

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_n_listitem"
        android:layout_width="@dimen/width_n"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/N"/>

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_e_listitem"
        android:layout_width="@dimen/width_e"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/E"/>

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_b_listitem"
        android:layout_width="@dimen/width_b"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/B"/>

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_l_listitem"
        android:layout_width="@dimen/width_l"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/L"/>

    <View
        android:layout_width="1dp"
        android:layout_height="@dimen/tv_height"
        android:background="@color/black_300"/>

    <TextView
        android:id="@+id/tv_islofted_listitem"
        android:layout_width="@dimen/width_islofted"
        android:layout_height="@dimen/tv_height"
        android:gravity="center"
        android:text="@string/islofted"/>

</LinearLayout>

主界面代码：

<?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="match_parent"
    android:orientation="vertical">

    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="7"
        android:padding="@dimen/xsmall_margin">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <include
                layout="@layout/listitem_pointlist"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/black_500"/>

            <ListView
                android:id="@+id/lv_main_pointlist"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/listitem_not_selected"
                android:choiceMode="singleChoice"></ListView>

        </LinearLayout>

    </HorizontalScrollView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center">

        <Button
            android:id="@+id/btn_loft_pointlist"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/button_background"
            android:text="@string/start_lofting" />

        <Button
            android:id="@+id/btn_output_pointlist"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/large_margin"
            android:background="@drawable/button_background"
            android:text="@string/output_deviation" />

    </LinearLayout>

</LinearLayout>

实现起来也很简单，我用的是BaseAdapter。

首先，组装要填充的数据：

//每一个TextView的内容
private Map<String, Object> mItem;
//每一个Item项的内容
private List<Map<String, Object>> mPointList;
//每一行一共有7个数据
mItem = new HashMap<String, Object>();
mItem.put(mMapKeys[0], mPoint.getID());
mItem.put(mMapKeys[1], mDataset.getName());
mItem.put(mMapKeys[4], mPoint.getY());
mItem.put(mMapKeys[5], mPoint.getX());
mItem.put(mMapKeys[2], mNEPoint2D.getY());
mItem.put(mMapKeys[3], mNEPoint2D.getX());
mItem.put(mMapKeys[6], mRecordset.getFieldValue(MapUtil.FIELD_IS_LOFTED));
mPointList.add(mItem);

初始化适配器BaseAdapter：

//初始化适配
mMainListAdapter=new BaseAdapter(){
    @Override
    public int getCount(){
        return mPointList.size();
    }

    @Override
    public Map<String, Object>getItem(int position){
        mItem=mPointList.get(position);
        return mItem;
    }

    @Override
    public long getItemId(int position){
        return position;
    }

    @Override
    public View getView(int position,View convertView,ViewGroup parent){
        final View             
   view=LinearLayout.inflate(PointListActivity.this,R.layout.listitem_pointlist,null);
        //获取每一项中的TextView
        TextView textview=(TextView)view.findViewById(R.id.tv_pointid_listitem);
        textview.setText(getItem(position).get(mMapKeys[0]).toString());
        textview=(TextView)view.findViewById(R.id.tv_dataset_listitem);
        textview.setText(getItem(position).get(mMapKeys[1]).toString());
        textview=(TextView)view.findViewById(R.id.tv_n_listitem);
        textview.setText(getItem(position).get(mMapKeys[2]).toString());
        textview=(TextView)view.findViewById(R.id.tv_e_listitem);
        textview.setText(getItem(position).get(mMapKeys[3]).toString());
        textview=(TextView)view.findViewById(R.id.tv_b_listitem);
        textview.setText(getItem(position).get(mMapKeys[4]).toString());
        textview=(TextView)view.findViewById(R.id.tv_l_listitem);
        textview.setText(getItem(position).get(mMapKeys[5]).toString());
        textview=(TextView)view.findViewById(R.id.tv_islofted_listitem);
        textview.setText(getItem(position).get(mMapKeys[6]).toString());
        //设置每一行的背景，点击选中时背景为淡蓝色
        view.setBackgroundResource(R.drawable.listitem_activated);
        return view;
    }
};
//关联适配器
mMainListView.setAdapter(mMainListAdapter);
//设置每一行的点击事件
mMainListView.setOnItemClickListener(new AdapterView.OnItemClickListener(){
@Override
public void onItemClick(AdapterView<?>parent,View view,int position,long id){
        mPositionSelected=position;
    }
});

每一行LinearLayout的背景是drawable文件，首先新建：

Root element是selector：

xml代码：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_activated="true"
        android:drawable="@color/listitem_selected"/>
    <item android:state_activated="false"
        android:drawable="@color/listitem_not_selected"/>
</selector>

将选中和非选中的背景设置好就可以了

头行固定的自由滑动表格的简单实现

猜你喜欢