"Alearning" chapter fourth Android layout component Layout (ii)

We introduced and learned the LinearLayout (linear layout), Framelayout (single frame layout) and absolutelayout (absolute layout) separately. This time we are going to study relativelayout (relative layout) and tablelayout (table layout). This part is a very important point of knowledge. Relativelayout is strongly recommended in the development process, and tablelayout is required when certain requirements are met (common tabular display, but not limited to this).

"blog column:http://blog.csdn.net/column/details/alearning.html"

relativelayout (relative layout)the previously described linearlayout (phenomenon layout) and the forthcoming relativelayout (relative layout) are more commonly used in actual development and are strongly recommended during the development process. Let's start by understanding the Relativelayout layout.
Relative layout, as the name implies, is a "relative" position/alignment based layout method.
This example expands the property configuration as follows:

• ANDROID:ID Specifies the ID value of the unique flag for the control;
• ANDROID:LAYOUT_ABOVE specifies that the bottom of the control is placed above the control of the given ID;
• Android:layout_below specifies that the bottom of the control is placed under the control of the given ID;
• ANDROID:LAYOUT_TOLEFTOF specifies that the right edge of the control is aligned with the left edge of the control for the given ID;
• ANDROID:LAYOUT_TORIGHTOF specifies that the left edge of the control is aligned with the right edge of the control for the given ID;
• Android:layout_alignbaseline specifies that the control's baseline is aligned with the baseline of the given ID;
• ANDROID:LAYOUT_ALIGNTOP specifies that the top edge of the control is aligned with the top edge of the given ID;
• ANDROID:LAYOUT_ALIGNBOTTOM specifies that the bottom edge of the control is aligned with the bottom edge of the given ID;
• ANDROID:LAYOUT_ALIGNLEFT specifies that the left edge of the control is aligned with the left edge of the given ID;
• Android:layout_alignright specifies that the right edge of the control is aligned with the right edge of the given ID;
• ANDROID:LAYOUT_ALIGNPARENTTOP specifies that the top of the control is aligned with the top of its parent control;
• ANDROID:LAYOUT_ALIGNPARENTBOTTOM specifies that the bottom of the control is aligned with the bottom of its parent control;
• ANDROID:LAYOUT_ALIGNPARENTLEFT specifies that the left side of the control is aligned with the left part of its parent control;
• Android:layout_alignparentright specifies that the right part of the control is aligned with the right side of its parent control;

Note: The relative layout of the zodiac set more, in the actual development of the need for continuous replenishment and expansion.
"Layout file" Activity_relativelayout.xml

<?xml version= "1.0" encoding= "Utf-8"? ><relativelayout xmlns:android= "http://schemas.android.com/apk/res/    Android "Android:layout_width=" Match_parent "android:layout_height=" Match_parent "> <!--the control is located in the middle of the interface--        <textview android:id= "@+id/red" android:layout_width= "70DP" android:layout_height= "70DP" Android:layout_centerinparent= "true" android:background= "#CD2E57" android:gravity= "center" android:te xt= "Red"/> <!--the left edge of the control is aligned with the left edge of the Red control for the given ID--<textview android:layout_width= "80DP" an droid:layout_height= "80DP" android:layout_alignleft= "@id/red" android:background= "#64DB99" android:gr        avity= "center" android:text= "Green"/> <!--the control is located at the bottom of the interface with the lower/right of the given ID of the red control (that is, bottom-right position)-<textview Android:layout_width= "50DP" android:layout_height= "50DP" android:layout_below= "@id/red" Androi   D:layout_centerinparent= "true"     android:layout_margintop= "20DP" android:layout_torightof= "@id/red" android:background= "#FFFA78" android:gravity= "center" android:text= "Yellow"/> <!--the control is located to the left of the given ID of the red Control--and <textview an Droid:layout_width= "60DP" android:layout_height= "60DP" android:layout_alignparentbottom= "true" Androi  d:layout_toleftof= "@id/red" android:background= "#148CFF" android:gravity= "center" android:text= "Blue" /></relativelayout>

Effect:

tablelayout (table layout)tablelayout table layout, table layout is similar to the table inside the HTML. Each tablelayout has a table row TableRow (similar to the one in the table in the HTML), TableRow inside can define each element, such as TextView, set his alignment android:gravity= " Center ".
This example expands the property configuration as follows:

• ANDROID:STRETCHCOLUMNS Specifies the columns that can be stretched. The column can stretch to the row direction, up to a full row.
• ANDROID:SHRINKCOLUMNS Specifies the columns that can be shrunk. When the column control has too much content and is already packed in the row, the contents of the child control are displayed in the columns direction.
• ANDROID:COLLAPSECOLUMNS Specifies the columns to hide.

Example:
android:stretchcolumns= "0" No. 0 column extendable
Android:shrinkcolumns= 1th, 2 columns can be shrunk
android:collapsecolumns= "*" hides all rows
Note: Columns can have both the Stretchcolumns and Shrinkcolumns properties, so when the column has more than N, "multiline" displays its contents. (This is not really a multiline, but the system automatically adjusts the line's layout_height as needed).

• Android:layout_column specifies that the cell is displayed in the first column
• ANDROID:LAYOUT_SPAN Specifies the number of columns that the cell occupies (when unspecified, 1)

Example:
android:layout_column= "1" The control is displayed in the 1th column
Android:layout_span= "2" This control occupies 2 columns
Description: A control can also have both features.
"Layout file" Activity_relativelayout.xml.

<?xml version= "1.0" encoding= "Utf-8"? ><tablelayout xmlns:android= "http://schemas.android.com/apk/res/ Android "Android:layout_width=" Match_parent "android:layout_height=" match_parent "android:stretchcolumns=" 0,1,2 " > <tablerow android:layout_width= "match_parent" android:layout_height= "wrap_content" > &L T TextView android:layout_width= "wrap_content" android:layout_height= "40DP" Android:backgro Und= "#6495ED" android:padding= "2DP" android:text= "text 1-1"/> <textview androi D:layout_width= "Wrap_content" android:layout_height= "40DP" android:background= "#B0C4DE" a ndroid:padding= "2DP" android:text= "text 1-2"/> <textview android:layout_width= "Wrap_conte            NT "android:layout_height=" 40DP "android:background=" #32CD32 "android:padding=" 2DP "  android:text= "Text 1-3"/>      <textview android:layout_width= "wrap_content" android:layout_height= "40DP" Andro Id:background= "#FFD700" android:padding= "2DP" android:text= "text 1-4"/> </TableRow> &lt ;            TableRow android:layout_width= "match_parent" android:layout_height= "wrap_content" > <textview            android:layout_height= "40DP" android:layout_column= "1" android:layout_span= "2" Android:background= "#FF8C00" android:text= "cross-column text 2-2,3 across 2 to 3 columns"/> </TableRow> <tablerow an Droid:layout_width= "Match_parent" android:layout_height= "Wrap_content" > <textview android: layout_height= "40DP" android:layout_column= "0" android:layout_span= "2" Android:background        = "#FF69B4" android:text= "cross-column text 3-1,2 across 1 to 2 columns"/> </TableRow> <!----> <tablelayout Android:layout_width="Match_parent" android:layout_height= "Wrap_content" android:collapsecolumns= "2" android:shrinkcolumn            s= "1" android:stretchcolumns= "0" > <tablerow android:layout_width= "match_parent"                 android:layout_height= "Wrap_content" > <textview android:background= "#696969" Android:textcolor= "@android: Color/white" android:text= "line in the direction of stretching text, you can grow your own text viewing effect! "/> <textview android:textcolor=" @android: Color/white "Android:background = "#800000" android:text= "column direction stretch text, you can grow your own text viewing effect! "/> </TableRow> </TableLayout></TableLayout>

Effect:

In this case, five commonly used layouts based on XML configuration have been fully explained. But layouts are designed in more ways than one and are based on the Java (Android) development language setting. This part, will be in the next continuous learning to understand and use. Please crossing continue to pay attention to!

References4, http://blog.sina.com.cn/s/blog_63c66eb60100u29p.html
5, http://blog.csdn.net/beyond0525/article/details/8841139