web-dev-qa-db-ja.com

Android TableLayoutヘッダー行

さて、私はこのTableLayoutとそのデータでいっぱいになり、すべての行がプログラムで追加されました。 TableLayoutがHorizo​​ntalScrollView内にあり、これがScrollView内にあります。これにより、水平方向と垂直方向の両方にスクロールできます。私が今やろうとしているのは、スクロールしないヘッダー行を追加することです。両方のスクロールビューが実際にTableLayout内にあるように物事を動かしてみて、TableRowsをHorizo​​ntalScrollViewに追加しました。私の望みは、スクロールビューの外にヘッダー行を追加できるようにすることでした。

私が考えることができる他の唯一のことは、ヘッダー行のためだけに2番目のテーブルレイアウトを用意することですが、列を整列させるのは難しいようです。何か案は？

androidandroid-layoutandroid-tablelayout
13
Jeff Barger

1つのアプローチは、TableLayoutを別のTableLayoutの行に埋め込み、以下に示すように前の行にヘッダーを配置することです。データとヘッダーを揃えるには、ヘッダーのViewオブジェクトとデータのViewオブジェクトのlayout_widthプロパティを同じdip値に設定する必要があります。また、内部TableLayoutのViewオブジェクトのlayout_weightプロパティは、対応するヘッダーと一致する必要があります。以下のXMLでは、列ヘッダーと一致するように、3つのTextViewを1つの行の内側のTableLayoutに配置しました。これは、位置合わせを行う方法を示すためだけのものです。レイアウトを拡張して実行時に追加することにより、プログラムでそのデータを設定できます。

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
  xmlns:Android="http://schemas.Android.com/apk/res/Android"
  Android:layout_width="fill_parent"
  Android:layout_height="fill_parent">


  <TableRow>
    <TextView Android:text="Name"
        Android:layout_width="100dp"        
        Android:layout_column="0"
        Android:layout_weight="1"/>
    <TextView Android:text="Score"
        Android:layout_width="30dp"
        Android:layout_column="1"
        Android:layout_weight="1">
    </TextView>
    <TextView Android:text="Level"
        Android:layout_width="30dp"
        Android:layout_column="2"
        Android:layout_weight="1">
    </TextView>
  </TableRow>

    <ScrollView Android:layout_height="120dp">      
    <TableLayout Android:id="@+id/score_table"
      Android:layout_width="fill_parent"
      Android:layout_height="fill_parent">          
    <TableRow>
        <TextView Android:text="Al"
        Android:layout_width="100dp"        
        Android:layout_column="0"
        Android:layout_weight="1">
        </TextView>
        <TextView Android:text="1000"
        Android:layout_width="30dp"
        Android:layout_column="1"
        Android:layout_weight="1">
        </TextView>
        <TextView Android:text="2"
        Android:layout_width="30dp"
        Android:layout_column="2"
        Android:layout_weight="1">
        </TextView>
    </TableRow>
  </TableLayout>
  </ScrollView>     
</TableLayout>
15
WindsurferOak

私は実際にこれを行う別のまともな方法を思いついた。

垂直方向のLinearLayout内で、ヘッダー行を最初の行として通常どおりテーブルを作成するだけです。次に、プログラムで最初の行を削除し、それを最初の子としてLinearLayoutに追加します。これは魅力のように機能しました。

編集：これは、静的な列幅を指定しなくても機能します。

13
khendricks

質問が古いことは知っていますが、同じ問題があったのでGoogleが私にくれたのは最初の質問でした。そして、私はより良い解決策を見つけたと思うので、それを共有したいと思います。

アイデア：TableLayout（ScrollView内）をRelativeLayoutに配置し、オーバーレイを作成します。これにより、最初の（ヘッダー）行が他のすべての上に描画されます。

これがlayout.xmlです：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"

    Android:id="@+id/table_wrapper"

    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
>
    <ScrollView

        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"

        tools:ignore="UselessParent"
    >
        <TableLayout

            Android:id="@+id/table"

            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
        />
    </ScrollView>
</RelativeLayout>

そしてここにコードがあります：

TableLayout table = (TableLayout)view.findViewById(R.id.table);

final TableRow headerRow = new TableRow(context);
table.addView(headerRow);

table.addView(new TableRow(context));
table.addView(new TableRow(context));
table.addView(new TableRow(context));


RelativeLayout tableWrapper = (RelativeLayout)view.findViewById(R.id.table_wrapper);

View fakeHeaderView = new View(context) {
    @Override
    public void draw(Canvas canvas) {
        headerRow.draw(canvas);
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        int width = headerRow.getMeasuredWidth();
        int height = headerRow.getMeasuredHeight();

        widthMeasureSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY);
        heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
};

tableWrapper.addView(fakeHeaderView);
4
Oleg Skrypnyuk
<?xml version="1.0" encoding="utf-8"?>
<TableLayout
  xmlns:Android="http://schemas.Android.com/apk/res/Android"
  Android:layout_width="fill_parent"
  Android:layout_height="fill_parent">


  <TableRow>
    <TextView Android:text="Name"
        Android:layout_width="100dp"        
        Android:layout_column="0"
        Android:layout_weight="1"/>
    <TextView Android:text="Score"
        Android:layout_width="30dp"
        Android:layout_column="1"
        Android:layout_weight="1">
    </TextView>
    <TextView Android:text="Level"
        Android:layout_width="30dp"
        Android:layout_column="2"
        Android:layout_weight="1">
    </TextView>
  </TableRow>

    <ScrollView Android:layout_height="120dp">      
    <TableLayout Android:id="@+id/score_table"
      Android:layout_width="fill_parent"
      Android:layout_height="fill_parent">          
    <TableRow>
        <TextView Android:text="Al"
        Android:layout_width="100dp"        
        Android:layout_column="0"
        Android:layout_weight="1">
        </TextView>
        <TextView Android:text="1000"
        Android:layout_width="30dp"
        Android:layout_column="1"
        Android:layout_weight="1">
        </TextView>
        <TextView Android:text="2"
        Android:layout_width="30dp"
        Android:layout_column="2"
        Android:layout_weight="1">
        </TextView>
    </TableRow>
  </TableLayout>
  </ScrollView>     
</TableLayout>
1
zahra salmaninejad

サイズを事前に定義する必要があることに満足していない人のために、私は私のために働いているちょっとしたハックを見つけました。

基本的に、タイトル用に別のテーブルを作成してメインテーブルの上に置きますが、同じ上揃えで、タイトル行のコピーを2つ作成し、一方をメインテーブルに追加した後、もう一方をタイトルテーブルに追加して設定します。行への子ビューのlayoutParamsがメインテーブルを形成します。

これが私の基本的な例です。

レイアウト内：

<HorizontalScrollView
    Android:id="@+id/table_horizontal_scroll_view"
    Android:layout_alignParentTop="true"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:clickable="false">

    <RelativeLayout
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        >

        <ScrollView
            Android:layout_alignParentTop="true"
            Android:layout_marginTop="0dp"
            Android:id="@+id/table_vertical_scroll_view"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content">

            <TableLayout
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:id="@+id/grid_table_layout"
                />

        </ScrollView>

        <TableLayout
            Android:layout_alignLeft="@+id/table_vertical_scroll_view"
            Android:layout_alignRight="@+id/table_vertical_scroll_view"
            Android:layout_alignStart="@+id/table_vertical_scroll_view"
            Android:layout_alignEnd="@+id/table_vertical_scroll_view"
            Android:layout_alignParentTop="true"
            Android:background="@color/grid_view_background"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:id="@+id/grid_floating_row_layout"
            />

    </RelativeLayout>


</HorizontalScrollView>

次に、行を追加すると、次のようになります。

    //clear out any views
    tableLayout.removeAllViews();
    floatingRowLayout.removeAllViews();

    TableRow[] rows = getTableContentRows() // content of your table
    TableRow[] titleRows = {getTitleRow(), getTitleRow()}; //two copies of your title row
    tableLayout.addView(titleRows[0]); // first add the first title to the main table
    addRows(rows) // add any other rows

    floatingRowLayout.addView(titleRows[1]); // floatingRowLayout is connected to id/grid_floating_row_layout

    titleRows[0].setVisibility(View.INVISIBLE); // make the title row added to the main table invisible

    // Set the layoutParams of the two title rows equal to each other. 
    // Since this is done after the first is added to the main table, they should be the correct sizes.
    for(int i = 0; i < titleRows[0].getChildCount(); i++) {
      titleRows[1].getChildAt(i).setLayoutParams(titleRows[0].getChildAt(i).getLayoutParams());
    }
0
NoLongerContributingToSE

Give Android:stretchColumns="*"のようにScrollViewで2つのtableLayoutOneを使用します

   <RelativeLayout
            Android:layout_width="match_parent"
            Android:orientation="vertical"
            Android:paddingTop="5dp"
            Android:layout_height="match_parent"
            Android:layout_below="@+id/llSpinner">
            <TableLayout
                Android:layout_width="match_parent"
                Android:id="@+id/tableHead"
Android:stretchColumns="*" 
                Android:layout_height="wrap_content">
            </TableLayout>

        <ScrollView
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_above="@+id/tableTotal"
            Android:layout_below="@+id/tableHead"
            Android:id="@+id/scrolltable">


        </ScrollView>
    <TableLayout
                Android:layout_width="match_parent"
                Android:id="@+id/tableTotal"
Android:stretchColumns="*" 
                Android:layout_alignParentBottom="true"
                Android:layout_height="wrap_content">
            </TableLayout>
        </RelativeLayout>

次に、ROWの共通ビューを作成し、最も重要な言及Android:layout_width="0dp"

<TableRow
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="fill_parent"
    Android:layout_height="?android:attr/listPreferredItemHeight"
    Android:focusable="true"
    Android:focusableInTouchMode="false"
    Android:clickable="true"
    Android:background="@Android:drawable/list_selector_background">

    <TextView
        Android:text="S.No"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:id="@+id/tbsNo"
        Android:layout_weight="1"
        Android:gravity="center"
        Android:layout_column="1" />

    <TextView
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:text="Date"
        Android:layout_weight="1"
        Android:gravity="center"
        Android:id="@+id/tbDate"
        Android:layout_column="2" />


    <TextView
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:text="Count"
        Android:layout_weight="1"
        Android:gravity="center"
        Android:id="@+id/tbMrCount"
        Android:layout_column="3" />
</TableRow>

現在活動中

 Tablelayout tableHeading =(TableLayout)findViewById(R.id.tableHead);


               Tablelayout    table =(TableLayout) findViewById(R.id.table_repots);
                   trHeading = (TableRow) getLayoutInflater().inflate(R.layout.table_row_item, null);
                trHeading.setBackgroundColor(Color.parseColor("#6688AC"));
                trHeading.setPadding(0,10,0,10);

                TextView tv;
                tv = (TextView) trHeading.findViewById(R.id.tbsNo);
                tv.setText("S.No");
            tv = (TextView) trHeading.findViewById(R.id.tbDate);
           tv.setText("Date");
          table.addView(tv);
0
Kapil Parmar