android 自定义表格
本文通过ScrollView 嵌套 ListView来实现滚动表格功能。
实现效果如下图： 
如上图所示实现功能如下：
1、列表头 和 数据 可以左右滑动，方便超出屏幕数据查看。
2、行表头 和 数据 可以上下滑动，方便超出屏幕数据查看。
3、左右滑动时 行表头固定，上下滑动时 列表头固定。
实现代码如下：
package com.uuch.android_zxinglibrary.tableview;
/**
* Created by wangqiubo on 2018-02-05.
*/
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.TextView;
import com.uuch.android_zxinglibrary.R;
import java.util.ArrayList;
import java.util.List;
public class TableActivity extends AppCompatActivity {
private NoScrollListView mLeft;
private LeftAdapter mLeftAdapter;
private NoScrollListView mData;
private DataAdapter mDataAdapter;
private SyncHorizontalScrollView mHeaderHorizontal;
private SyncHorizontalScrollView mDataHorizontal;
private List mListData;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.list_row_main_layout);
initView();
}
private void initView(){
mLeft = (NoScrollListView) findViewById(R.id.lv_left);
mData = (NoScrollListView) findViewById(R.id.lv_data);
mDataHorizontal = (SyncHorizontalScrollView) findViewById(R.id.data_horizontal);
mHeaderHorizontal = (SyncHorizontalScrollView) findViewById(R.id.header_horizontal);
mDataHorizontal.setScrollView(mHeaderHorizontal);
mHeaderHorizontal.setScrollView(mDataHorizontal);
mListData = new ArrayList<>();
mListData.add("1");
mListData.add("2");
mListData.add("3");
mListData.add("4");
mListData.add("5");
mListData.add("6");
mListData.add("7");
mListData.add("8");
mListData.add("9");
mListData.add("10");
mListData.add("11");
mListData.add("12");
mListData.add("13");
mLeftAdapter= new LeftAdapter();
mLeft.setAdapter(mLeftAdapter);
mDataAdapter = new DataAdapter();
mData.setAdapter(mDataAdapter);
}
class LeftAdapter extends BaseAdapter {
@Override
public int getCount() {
return mListData.size();
}
@Override
public Object getItem(int position) {
return mListData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if (convertView == null) {
holder = new ViewHolder();
convertView = LayoutInflater.from(TableActivity.this).inflate(R.layout.table_column_left_layout, null);
holder.tvLeft = (TextView) convertView.findViewById(R.id.tv_left);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.tvLeft.setText("第" + position + "行");
return convertView;
}
class ViewHolder {
TextView tvLeft;
}
}
class DataAdapter extends BaseAdapter {
@Override
public int getCount() {
return mListData.size();
}
@Override
public Object getItem(int position) {
return mListData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(convertView == null){
holder = new ViewHolder();
convertView = LayoutInflater.from(TableActivity.this).inflate(R.layout.achievement_row_layout, null);
holder.tvData = (TextView) convertView.findViewById(R.id.tv_data);
holder.linContent = (LinearLayout) convertView.findViewById(R.id.lin_content);
convertView.setTag(holder);
}else{
holder = (ViewHolder) convertView.getTag();
}
return convertView;
}
class ViewHolder {
TextView tvData;
LinearLayout linContent;
}
}
} list_row_main_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="1"
android:orientation="vertical">LinearLayout>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
<LinearLayout
android:id="@+id/lin_header_content"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="3"
android:orientation="vertical">
<com.uuch.android_zxinglibrary.tableview.SyncHorizontalScrollView
android:id="@+id/header_horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:overScrollMode="never"
android:scrollbars="none">
<LinearLayout
android:id="@+id/lin_year_title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_data"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center"
android:text="第1列数据"/>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
<TextView
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center"
android:text="第2列数据"/>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
<TextView
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center"
android:text="第3列数据"/>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
<TextView
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center"
android:text="第4列数据"/>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
<TextView
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center"
android:text="第5列数据"/>
<View
android:layout_width="1px"
android:layout_height="50dp"
android:background="#cccccc"/>
LinearLayout>
com.uuch.android_zxinglibrary.tableview.SyncHorizontalScrollView>
LinearLayout>
LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="#cccccc"/>
<ScrollView
android:id="@+id/scroll_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:orientation="horizontal">
<com.uuch.android_zxinglibrary.tableview.NoScrollListView
android:id="@+id/lv_left"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:overScrollMode="never"
android:scrollbars="none"/>
<View
android:layout_width="1px"
android:layout_height="match_parent"
android:background="#cccccc"/>
<LinearLayout
android:id="@+id/lin_data_content"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:orientation="vertical">
<com.uuch.android_zxinglibrary.tableview.SyncHorizontalScrollView
android:id="@+id/data_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never"
android:scrollbars="none">
<com.uuch.android_zxinglibrary.tableview.NoScrollListView
android:id="@+id/lv_data"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never"
android:scrollbars="none"/>
com.uuch.android_zxinglibrary.tableview.SyncHorizontalScrollView>
LinearLayout>
LinearLayout>
ScrollView>
LinearLayout>对以上代码进行讲解如下：
1、NoScrollListView的定义。
package com.uuch.android_zxinglibrary.tableview;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ListView;
/**
* Created by wangqiubo on 2018-02-05.
*/
public class NoScrollListView extends ListView {
public NoScrollListView(Context context) {
super(context);
}
public NoScrollListView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public NoScrollListView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
/*
*ScrollView 中嵌套 ListView 会发现有冲突，冲突问题就是无论怎么设置 ListView 只显示一行
* 究其原因就是因为ListView的父容器测量模式为UNSPECIFIED的时候，ListView的高度默认为一个item的高度
* 那么解决冲突，就需要重新设定ListView的测量模式，因此，以下重写就是重写设置listView的测量模式为 MOST
* UNSPECIFIED 的值是0向左进位30，就是10 00000000000…(10后跟30个0)
* EXACTLY 的值是1向左进位30，就是01 00000000000…(01后跟30个0)
* AT_MOST 的值是2向左进位30，就是10 00000000000…(10后跟30个0)
**/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
}
}当ScrollView 中嵌套 ListView 的时候，怎样解决 ScrollView、ListView 不会同时滚动呢？另外如果ScrollView 中嵌套了 ListView ，一般ListView 只会显示一行。根据上面NoScrollListView 的定义，实现思想就是 让ListView不能滚动，实现不滚动的原理就是把所有数据都在ListView 展示出来。因此通过设置 AT_MOST 模式，让所有子项都显示出来，那么ListView就不再滚动，这样只有ScrollView 可以滚动了。
2、SyncHorizontalScrollView，水平滚动定义。
package com.uuch.android_zxinglibrary.tableview;
import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.HorizontalScrollView;
/**
/**
* Created by wangqiubo on 2018-02-05.
*/
public class SyncHorizontalScrollView extends HorizontalScrollView {
private View mView;
public SyncHorizontalScrollView(Context context) {
super(context);
}
public SyncHorizontalScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SyncHorizontalScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if (mView != null) {
mView.scrollTo(l, t);
}
}
public void setScrollView(View view) {
mView = view;
}
}
以上自定义水平滚动效果就是，当HorizontalScrollView 滚动的时候，那么设置进来的mView 同步滚动，请查看 TableActivity 中的代码：
mDataHorizontal = (SyncHorizontalScrollView) findViewById(R.id.data_horizontal);
mHeaderHorizontal = (SyncHorizontalScrollView) findViewById(R.id.header_horizontal);
mDataHorizontal.setScrollView(mHeaderHorizontal);
mHeaderHorizontal.setScrollView(mDataHorizontal);mDataHorizontal 为行数据，mHeaderHorizontal 为 列表头，mDataHorizontal 中的同步滚动mView = mHeaderHorizontal；mHeaderHorizontal中的同步滚动控件mView = mDataHorizontal 。因此，就实现了行数据和列表头可以同时左右滚动。
以上自定义的滑动表格存在问题如下：
NoScrollListView是通过设置 AT_MOST 模式来解决 ScrollView 中嵌套 ListView 的滑动冲突问题。AT_MOST 就是尺寸根据子节点的实际大小来确定最终大小，因此需要不停的来结算子节点的尺寸，如果涉及到大数据，就涉及到性能性问题。关于NoScrollListView的性能分析，请见以下链接。
https://www.2cto.com/kf/201610/556701.html 。