Android UI Tablelayout (table layout)

Description: Table layouts represent layouts in a common tabular format, somewhat similar to those shown in the Android:weight properties mentioned above. In fact, Tablelayout is indeed a subclass of LinearLayout, so it is essentially a linear layout. In actual development, we often use the Adnroid:weight attribute instead of the table layout.
Similar to writing a table in HTML, in Tablelayout, we can add a new row to the table by TableRow tag. Unlike HTML, a component can become a new row as long as it is wrapped in tablelayout, such as:

<TableLayout    android:layout_width="match_parent"    android:layout_height="match_parent">    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content" /></TableLayout>

The code above draws a button component that occupies the width of the entire parent container.
The columns in Tablelayout are determined by the rows with the largest number of columns, such as: one tablelayout has two rows, the first row has three columns, and the second row has five columns, so this table is 3*5. the maximum width of each column is also determined by the widest columns.

In the table layout, there are three properties that we need to focus on, all of which are set on the cell:

1 android:shrinkcolumns

Corresponding method: Setshrinkallcolumns (Boolean)
Description: Used to set columns that are allowed to shrink, and multiple column numbers can be separated by ",".
The so-called contraction is that when the contents of a cell (such as text) exceeds the width of the cell, it can be wrapped to shrink its actual length to satisfy that all cells do not exceed the width of the parent container.

2 Android:stretchcolumns

Corresponding method: Setstretchallcoulums (Boolean)
Description: Used to set columns that are allowed to be stretched, and can be separated by "," between multiple column numbers.
For example, if all columns are not filled with the width of the parent container, you can fill the parent container by stretching the cell that has the property set.

3 Android:collapsecolumns

Corresponding method: Setcollapsecolumns (Int,boolean)
Description: Sets the columns that need to be hidden, and can be separated by "," between multiple column numbers.
The cells of all rows in the column that are set will be hidden.

Note: The column number mentioned here starts at 0.

Here is the demo and the actual effect.

<tablelayout android:shrinkcolumns= "1" android:stretchcolumns= "2" android:collapsecolumns= "3" android:layou        T_width= "Match_parent" android:layout_height= "Match_parent" > <!--first row, one Button is fully occupied by the parent component and <button Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content"/> <!--with TableRow to open new lines--&gt    ; <TableRow> <button android:layout_width= "wrap_content" android:layout_height= "Wrap_c Ontent "android:textallcaps=" false "android:text=" Hello "/> <!--shrunk column, the extra text will appear on the next line-- > <button android:text= "Hello world!            My name is Lemondoor. "  Android:textallcaps= "false" Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" /> <!--stretched columns, if all components are smaller than the parent container width, they will automatically stretch to fill-<button android:text= "World" a Ndroid:textallcaps= "false" Android:Layout_width= "Wrap_content" android:layout_height= "Wrap_content"/> <!--hidden Columns--<b Utton android:layout_width= "wrap_content" android:layout_height= "Wrap_content" Android:te Xtallcaps= "false" android:text= "you can ' t find me!"/> </TableRow> <TableRow> <b Utton android:layout_width= "wrap_content" android:layout_height= "Wrap_content" Android:te Xtallcaps= "false" android:text= "Hello"/> <button android:text= "Hello world!            My name is Lemondoor. "  Android:textallcaps= "false" Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" /> <button android:text= "World" android:textallcaps= "false" Android:layout_ Width= "Wrap_content" android:layout_height= "wrap_content"/> </TableRow></TableLayout>

Shrinkage Effect:

The extra text in the second column is squeezed to the next line.

Tensile effect:

When all cells are width and less than the parent container width, the extruded column is automatically stretched to fill the parent container.

The number of table columns is determined by the row with the highest number of columns:

Attached: Citation statement

"Crazy Android Handout (second edition)" Li Gang "2.2.2 Table Layout" Electronics industry Press

Android UI Tablelayout (table layout)