Custom TableLayout with multiple TextViews in rows

Question

I want to crate custom TableLayout with rows like this:

TV is for TextView, i.e. I want to add 11 TextViews to the row:

Answer 1

Try programmatically setting all columns to stretch (didn't seem to work in XML for me):

...
flowTable.addContent(data);
flowTable.setStretchAllColumns(true);

Some other quick facts:

• No need to try and specify height and width for TableRow within TableLayout because it will always be height=WRAP_CONTENT and width=MATCH_PARENT. See TableLayout documentation where this is listed in the Class Overview section
• No need to try and specify height and widget for children of TableRow because they will always be height=WRAP_CONTENT and width=MATCH_PARENT. See TableRow documentation where this is listed in the Class Overview section

Might I also humbly suggest a bit of refactoring:

public class FlowTable extends TableLayout {
    private TableRow mCurrentRow;

    public FlowTable(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public FlowTable(Context context) {
        super(context);
        init();
    }

    private void init() {
        mCurrentRow = new TableRow(getContext());
        mCurrentRow.addView(createAndFillTextView("0")); // title for first row
        setStretchAllColumns(true);
    }

    public void addContent(List<ResultInfo> data) {
        for (int i = 0; i < data.size(); i++) {
            if ((i % 5 == 0) && (i != 0) /** Don't do this on 0! */) {
                finishRowAndStartNew(i);
            }

            mCurrentRow.addView(createAndFillTextView(data.get(i).distance));
            mCurrentRow.addView(createAndFillTextView(data.get(i).result));
        }
    }

    private void finishRowAndStartNew(int newRowIndex) {
        addView(mCurrentRow);
        mCurrentRow = new TableRow(getContext());
        mCurrentRow.addView(createAndFillTextView(genRange(newRowIndex+1)));
    }

    private String genRange(int currIndex){
        /********************/
        return String.valueOf(currIndex);
    }

    private TextView createAndFillTextView(String text) {
        TextView tv = new TextView(getContext());
        tv.setText(text);        
        return tv;
    }
}

Answer 2

If you want to use the xml Layout for that then try this:

    <TableLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="wrap_content" android:layout_height="wrap_content">
                <TableRow android:weightSum="1">
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText"
                            android:layout_height="wrap_content" android:layout_width="wrap_content"
                            android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                            android:text="Title" android:layout_weight="1"/>
                    </LinearLayout>
                    <!-- First Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">

                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>
                    <!-- Second Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>


                    <!-- Third Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>

                    <!-- Fourth Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">

                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2" />
                    </LinearLayout>
                    <!-- Fifth Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="2dp">

                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>
                </TableRow>
                <TableRow android:weightSum="1">
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText"
                            android:layout_height="wrap_content" android:layout_width="wrap_content"
                            android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                            android:text="Title" android:layout_weight="1"/>
                    </LinearLayout>
                    <!-- First Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">

                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>
                    <!-- Second Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>


                    <!-- Third Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>

                    <!-- Fourth Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="4dp">

                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText"
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2" />
                    </LinearLayout>
                    <!-- Fifth Group -->
                    <LinearLayout android:layout_height="wrap_content" android:orientation="horizontal"
                        android:layout_width="wrap_content" android:layout_weight="1" android:layout_marginRight="2dp">

                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv1"/>
                        <TextView android:id="@+id/totalText" 
                                android:layout_height="wrap_content" android:layout_width="wrap_content"
                                android:textStyle="bold" android:textSize="12sp" android:textColor="#000000"
                                android:text="Tv2"/>
                    </LinearLayout>
                </TableRow>
</TableLayout>

Hope it will help you. . . And if you want other then xml then let me know. Thanks.