我想创建一个包含大量的列(7-10)表的视图,而标题行始终是可见的(即使在滚动时下降)和第一列也总是可见的,而水平滚动。
I would like to create a table-like view that contains a large number of columns (7-10) while the headers row is always visible (even when scrolling down) and the first column also always visible while scrolling horizontally.
试图把一个列表视图中的HorizontalScrollView这让我展示水平和垂直滚动条,但没有静态列/标题的列表。我试图避免使用,而用户滚动它们之间的多个视图和同步。
Tried to put a list view inside an HorizontalScrollView which let me display a list with horizontal and vertical scrolling but no static column/header. I am trying to avoid using multiple views and sync between them while the user scrolls.
后来,我将不得不像行/列的点击视图内控制的事件,所以应选用大一些的自定义适配器。
Later on I will have to control events inside the view like row/columns clicks, so something with a custom adapter should be used.
什么想法?
我将与 TableLayout
去填充的的TableRow
的。
下面code演示了如何做到这一点。
The following code demonstrates how to achieve that.
package com.test;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.widget.TableLayout;
import android.widget.TableRow;
import android.widget.TableRow.LayoutParams;
import android.widget.TextView;
public class TableLayoutTest extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.table_layout);
TableRow.LayoutParams wrapWrapTableRowParams = new TableRow.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
int[] fixedColumnWidths = new int[]{20, 20, 20, 20, 20};
int[] scrollableColumnWidths = new int[]{20, 20, 20, 30, 30};
int fixedRowHeight = 50;
int fixedHeaderHeight = 60;
TableRow row = new TableRow(this);
//header (fixed vertically)
TableLayout header = (TableLayout) findViewById(R.id.table_header);
row.setLayoutParams(wrapWrapTableRowParams);
row.setGravity(Gravity.CENTER);
row.setBackgroundColor(Color.YELLOW);
row.addView(makeTableRowWithText("col 1", fixedColumnWidths[0], fixedHeaderHeight));
row.addView(makeTableRowWithText("col 2", fixedColumnWidths[1], fixedHeaderHeight));
row.addView(makeTableRowWithText("col 3", fixedColumnWidths[2], fixedHeaderHeight));
row.addView(makeTableRowWithText("col 4", fixedColumnWidths[3], fixedHeaderHeight));
row.addView(makeTableRowWithText("col 5", fixedColumnWidths[4], fixedHeaderHeight));
header.addView(row);
//header (fixed horizontally)
TableLayout fixedColumn = (TableLayout) findViewById(R.id.fixed_column);
//rest of the table (within a scroll view)
TableLayout scrollablePart = (TableLayout) findViewById(R.id.scrollable_part);
for(int i = 0; i < 10; i++) {
TextView fixedView = makeTableRowWithText("row number " + i, scrollableColumnWidths[0], fixedRowHeight);
fixedView.setBackgroundColor(Color.BLUE);
fixedColumn.addView(fixedView);
row = new TableRow(this);
row.setLayoutParams(wrapWrapTableRowParams);
row.setGravity(Gravity.CENTER);
row.setBackgroundColor(Color.WHITE);
row.addView(makeTableRowWithText("value 2", scrollableColumnWidths[1], fixedRowHeight));
row.addView(makeTableRowWithText("value 3", scrollableColumnWidths[2], fixedRowHeight));
row.addView(makeTableRowWithText("value 4", scrollableColumnWidths[3], fixedRowHeight));
row.addView(makeTableRowWithText("value 5", scrollableColumnWidths[4], fixedRowHeight));
scrollablePart.addView(row);
}
}
//util method
private TextView recyclableTextView;
public TextView makeTableRowWithText(String text, int widthInPercentOfScreenWidth, int fixedHeightInPixels) {
int screenWidth = getResources().getDisplayMetrics().widthPixels;
recyclableTextView = new TextView(this);
recyclableTextView.setText(text);
recyclableTextView.setTextColor(Color.BLACK);
recyclableTextView.setTextSize(20);
recyclableTextView.setWidth(widthInPercentOfScreenWidth * screenWidth / 100);
recyclableTextView.setHeight(fixedHeightInPixels);
return recyclableTextView;
}
}
部首是不垂直滚动部;这就是你需要在列设置固定宽度的原因。当您不想要滚动的第一列,你必须对为此行设置一个固定的高度。
Header is the part that doesn't scroll vertically; that's the reason you need to set fixed width on columns. As of the first column that you don't want to scroll, you'll have to set a fixed height on rows for that purpose.
这里的布局XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:id="@+id/fillable_area">
<TableLayout
android:id="@+id/table_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:id="@+id/fillable_area">
<TableLayout
android:id="@+id/fixed_column"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TableLayout
android:id="@+id/scrollable_part"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</HorizontalScrollView>
</LinearLayout>
</ScrollView>
</LinearLayout>
和输出看起来像这样刚刚加载时
And the output looks like this when just loaded
和这样的时候滚动到右侧和底部
and like this when scrolled to the right and to the bottom