Android learning-five la S and five la s of android

Android learning-five la S and five la s of android

You are welcome to reprint it in any form, but be sure to indicate the source.

Five la s of Android:

• LinearLayout (linear layout)
• RelativeLayout (relative layout)
• AbsoluteLayout (absolute layout)
• TableLayout (table layout)
• FrameLayout (single frame layout)

(Note: all xml source code in the text is collapsed. Click it to view it)

 

1. LinearLayout (linear layout)

A linear layout is a single row or single column arrangement view. Sub-entries can be arranged horizontally or vertically.

XML attributes	Corresponding setting method	Description
Android: orientation	SetOrientation (int)	You can set the arrangement of components in the layout manager to one of the two vertical "horizontal" horizontal "vertical"
Android: gravity	SetGravity (int)	Sets the alignment of components in the layout manager. This attribute supports top, bottom, left, right, center_vertical, fill_horizontal, center, fill, clip_vertical, and clip_vertical attribute values. You can also specify a combination of multiple alignment methods. For example, left | center_vertical indicates that it appears on the left of the screen and is vertically centered.

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"     android:layout_width="match_parent"    android:layout_height="match_parent">        <TextView        android:id="@+id/tx1"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@color/color1"        android:layout_weight="1"/>    <TextView        android:id="@+id/tx2"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@color/color2"        android:layout_weight="1"/>    <TextView        android:id="@+id/tx3"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@color/color3"        android:layout_weight="1"/>    </LinearLayout>

Vertical

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="horizontal"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:id="@+id/tx1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="@color/color1"        android:layout_weight="1"/>    <TextView        android:id="@+id/tx2"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="@color/color2"        android:layout_weight="1"/>    <TextView        android:id="@+id/tx3"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="@color/color3"        android:layout_weight="1"/></LinearLayout>

Horizontal illustration

 

2. RelativeLayout (relative layout)

A relative layout refers to a ViewGroup that displays its child View elements in a relative position. A View can specify its location relative to its sibling View (for example, on the left or bottom of a given view) or the position of a specific area relative to the RelaitiveLayout (for example, bottom alignment, or left center ).

Relative layout is a powerful tool for designing user interfaces because it eliminates nested view groups. If you find that multiple nested LinearLayout view groups are used, you can consider using a RelativeLayout view group.

Important attributes:

1. The property must be the reference name of the ID, for example, "@ + id/button1"

Android: layout_below	Set this element below an element
Android: layout_abve	Set this element above an element
Android: layout_toLeftOf	Set this element to the left of an element.
Android: layout_toRightOf	Set this element to the right of an element.
Android: layout_alignTop	Sets the alignment between the top edge of an element and the top edge of an element.
Android: layout_alignLeft	Sets the left edge of an element to align with the left edge of an element.
Android: layout_alignBottom	Sets the bottom edge of an element to align with the bottom edge of an element.
Android: layout_alignRight	Sets the right edge of an element to align with the right edge of an element.

2. The property value is true or false.

Android: layout_centerHorizontal	Set whether to align horizontally with the parent Element
Android: layout_centerVertical	Set whether to align vertically with the parent Element
Android: layout_centerInParent	Set whether to be completely centered relative to the parent Element
Android: layout_alignParentBottom	Set whether to be close to the bottom edge of the parent Element
Android: layout_alignParentLeft	Set whether to be close to the left edge of the parent Element
Android: layout_alignParentRight	Set whether to be close to the right edge of the parent Element
Android: layout_alignParentTop	Set whether to be close to the upper edge of the parent Element
Android: layout_alignWithParentIfMissing	If layout_toLeftOf and layout_toRightOf cannot be found, the parent element is used as the reference.

<? 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"> <TextView android: id = "@ + id/label" android: layout_width = "match_parent" android: layout_height = "wrap_content" android: text = "Type here" android: textSize = "28dp" android: textStyle = "bold" android: layout_marginBottom = "10dp"/> <EditText android: id = "@ + id/entry" android: layout_width = "match_parent" android: layout_height = "wrap_content" android: background = "@ drawable/p1" android: layout_below = "@ id/label" android: layout_marginBottom = "10dp"/> <Button android: id = "@ + id/OK" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_below = "@ id/entry" android: layout_alignParentRight = "true" android: layout_marginLeft = "30dp" android: text = "OK" android: textSize = "28dp"/> <Button android: id = "@ + id/cancel" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_toLeftOf = "@ id/OK" android: layout_alignTop = "@ id/OK" android: text = "cancel" android: textSize = "28dp"/> </RelativeLayout>

View Code

 

 

Iii. AbsoluteLayout (absolute layout)

An absolute layout is a ViewGroup that displays its subviews (View elements) in an absolute way, that is, it locates the position on the screen in coordinates. This layout method is easy to understand. You can set the coordinates of the View in the layout file or change it into the coordinates of the View, so as to locate it absolutely. AbsoluteLayout allows the child element to specify an accurate x/y coordinate value and display it on the screen.

(0, 0) is the upper left corner. When you move down or to the right, the coordinate value increases.

AbsoluteLayout does not have a border and allows elements to overlap with each other.

<?xml version="1.0" encoding="utf-8"?><AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color1"        android:text="One"        android:gravity="center"        android:textSize="28dp"        android:layout_x="100dp"        android:layout_y="50dp"/>    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color3"        android:text="Two"        android:gravity="center"        android:textSize="28dp"        android:layout_x="0dp"        android:layout_y="150dp"/>    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color5"        android:text="Three"        android:gravity="center"        android:textSize="28dp"        android:layout_x="200dp"        android:layout_y="200dp"/></AbsoluteLayout>

View Code

 

 

4. TableLayout (table layout)

Table layout is a common table that distributes the positions of child elements to rows or columns. Table layout consists of many TableRow (rows) without column configuration. columns are determined by the number of row elements. Table layout is also a common layout method in practical applications.

Attribute

Android: collapseColumns	Hide the specified columns in TableLayout. If multiple columns need to be hidden, use commas (,) to separate the column numbers to be hidden.
Android: stretchColumns	Set the specified columns to be extensible to fill up the remaining spaces. If you need to set multiple columns to be stretched, use commas to separate the column numbers to be stretched.
Android: shrinkColumns	Sets the name of a column that can be shrunk. The screen is not squeezed out when the shrink column is too wide (too much content. When multiple columns need to be set to be retainable, column numbers are separated by commas.

<?xml version="1.0" encoding="utf-8"?><AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color1"        android:text="One 100dp"        android:gravity="center"        android:textSize="28dp"        android:layout_x="100dp"        android:layout_y="50dp"/>    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color3"        android:text="Two"        android:gravity="center"        android:textSize="28dp"        android:layout_x="0dp"        android:layout_y="150dp"/>    <TextView        android:layout_width="160dp"        android:layout_height="160dp"        android:background="@color/color5"        android:text="Three"        android:gravity="center"        android:textSize="28dp"        android:layout_x="200dp"        android:layout_y="200dp"/></AbsoluteLayout>

View Code

 

 

V. FrameLayout (single frame layout/frame layout)

Frame layout is implemented by the FrameLayout class. FrameLyoout directly inherits the ViewGroup component.

The frame layout container creates a blank area (called a frame) for each component to be added. Each sub-component occupies one frame and these frames are automatically aligned according to the gravity attribute. That is to say, all views added to this layout are displayed in layers. The first added control is placed at the bottom layer, and the last view added to the Framework layout is displayed at the top layer. The control at the top layer overwrites the control at the next layer. This display method is similar to a stack. Add components one by one.

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@color/color1">    <TextView         android:id="@+id/textview1"        android:layout_width="300dp"        android:layout_height="300dp"        android:layout_gravity="center"        android:background="#FF33ffff" />    <TextView         android:id="@+id/textview2"        android:layout_width="240dp"        android:layout_height="240dp"        android:layout_gravity="center"        android:background="#FF33ccff" />    <TextView         android:id="@+id/textview3"        android:layout_width="180dp"        android:layout_height="180dp"        android:layout_gravity="center"        android:background="#FF3399ff" />    <TextView         android:id="@+id/textview4"        android:layout_width="120dp"        android:layout_height="120dp"        android:layout_gravity="center"        android:background="#FF3366ff" />    <TextView         android:id="@+id/textview5"        android:layout_width="60dp"        android:layout_height="60dp"        android:layout_gravity="center"        android:background="#FF3300ff" /></FrameLayout>

View Code