"Android App Development technology: User Interface" layout manager

Guo Xiaoxing
Weibo: Guo Xiaoxing's Sina Weibo
Email:[email protected]
Blog: http://blog.csdn.net/allenwells
Github:https://github.com/allenwells

"Android App Development technology: User Interface" Chapter list

Layout management inherits from ViewGroup. It is used to manage the components in the Android app user interface, which makes the Android app's graphical user interface a good platform-agnostic feature.

Common layout methods such as the following are seen:

• Linear layout
• Table layout
• Frame layout
• Relative layout
• Network layout

Linear layout

Linear layout. That is linearlayout, the components within the control container are arranged horizontally or vertically, one next to the other.

1.1 Linear layout features

For example, as seen in:

Linear layouts do not wrap themselves, and when a line of components irresolute full, the extra components are not displayed.

1.2 Linear Layout Properties

Property name	Property Description
Android:gravity	To set the layout alignment of the inner elements of a linear layout

Android:gravity values such as the following are seen:

• Top does not change the size of the control and aligns to the top of the container
• Bottom does not change the size of the control, aligns to the bottom of the container
• Left does not change the size of the control, aligned to the right side of the container
• Right does not change the size of the control, align to the left side of the container
• Center_vertical does not change the size of the control, aligns to the vertical central position of the container
• Center_horizontal does not change the size of the control, aligns to the container's horizontal central location
• Center does not change the size of the control. Align to Central container location
• fill_vertical if possible, stretch vertically to fill the container
• Fill_horizontal if possible, stretch horizontally to fill the container
• Fill if possible, stretch vertically and horizontally at the same time to fill the container

Two table layouts

The table layout, or Tablelayout, inherits from LinearLayout. It manages the UI components in the form of rows and columns.

2.1 Table layout Features

1. Tablelayout controls the number of rows and columns of a table by adding TableRow and other components. Each tabrow is a table row, TableRow is also a container, and you can add other components to the TableRow.
2. Assume that a component is added directly to the tablelayout. Then this component is exclusive.
3. The width of the column in Tablelayout is determined by the widest cell in the column, and the width of the entire table layout depends on the width of the parent container.
4. The cell settings have the following three ways of behaving:
   
   • Shrinkable: All cells in the column can be shrunk to ensure that the table adapts to the width of the parent container.
   • Stretchable: All cells in this column can be stretched to ensure that the component fills the table's free space completely.

   • Collapsed: All cells in the column are hidden.

Three frame layout

Frame layout. That is framelayout. It inherits the ViewGroup. The frame layout creates a blank area for each joined component, called a frame. Each sub-component occupies one frame. Frame layouts are elements that overlap each other.

Four relative layouts

Relative layout. That is, the position of the relativelayout in relative layout is always determined relative to the sibling component and the parent container.

4.1 Relative layout features

Relative layouts For example with what you see:

4.2 List of properties in relative layout properties 4.2.1 Relativelayout with a value of true or False

Property name	Property Description
Android:layout_centerhorizontal	The current control is in the horizontal middle position of the parent control
Android:layout_centervertical	The current control is in the vertical middle position of the parent control
Android:layout_centerinparent	The current control is in the central location of the parent control
Android:layout_alignparentbottom	Aligns the bottom of the current control with the bottom of the parent control
Android:layout_alignparentleft	Aligns the left side of the current control with the left side of the parent control
Android:layout_alignparentright	Aligns the right side of the current control to the right side of the parent control
Android:layout_alignparenttop	Aligns the top of the current control with the top of the parent control
Android:layout_alignwithparentifmissing	The reference control does not exist or is not visible when the parent control

List of attributes in 4.2.2 Relativelayout for other control IDs

Property name	Property Description
Android:layout_torightof	Causes the current control to be positioned on the right side of the given ID control
Android:layout_toleftof	Causes the current control to be positioned on the left side of the given ID control
Android:layout_above	Causes the current control to be positioned above the given ID control
Android:layout_below	Causes the current control to be located below the given ID control
Android:layout_aligntop	Aligns the top bounds of the current control with the top boundary of the given ID control
Android:layout_alignbottom	Aligns the bottom boundary of the current control with the bottom boundary of the given ID control
Android:layout_alignleft	Aligns the left bounds of the current control with the left edge of the given ID control
Android:layout_alignright	Aligns the right boundary of the current control with the right border of the given ID control

List of attributes in 4.2.3 relativelayout that are pixel-valued

Property name	Property Description
Android:layout_marginleft	Leave white on the left side of the current control
Android:layout_marginright	Left white on the right side of the current control
Android:layout_margintop	White left over the current control
Android:layout_marginbottom	Leave white below the current control
Android:layout_margin	White left and right in four directions of the current control
Android:paddingleft	Content within the current control is left white
Android:paddingright	Content within the current control is left White to the right of the control
Android:paddingtop	Content within the current control is left white at the top of the control
Android:paddingbottom	Content within the current control is left white at the bottom of the control

Five network layouts

A network layout, GridLayout, that divides a container into a row x column grid. Each grid can place a component. Within the layout. A component can span multiple rows, and can span multiple columns.

The network layout, for example, is as seen in:

"Android App Development technology: User Interface" layout manager