Android common interface layout (detailed introduction)

1、 View view

All UI elements are built through view and ViewGroup. For the user interface of an Android application, ViewGroup is used as a container to hold the controls in the interface. It can contain ordinary view controls or ViewGroup.

2、 Interface layout writing method

There are two interface layout methods. The first is to write the layout in XML file, which is also the most commonly used; The second is to write the layout in Java code, as shown in the figure:

1. Common layout and features:

(2) Orientation attribute

The orientation attribute controls the arrangement direction of the controls, including two attribute values: vertical and horizontal; The weight attribute represents the weight.

(1) Overview controls are managed in the form of rows and columns. It does not need to explicitly declare how many rows and columns it contains. Instead, the number of rows of the table is controlled by adding a tablerow layout to the tablelayout, and the number of columns of the table is controlled by adding controls to the tablerow layout.

(2) Code style

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
             属性 = ”属性值”>
             <TableRow>
	UI控件
             </TableRow>
                 ......
</TableLayout>

(3) Layout properties and control properties

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:stretchColumns="2">//第3列可被拉伸
        <TableRow>
            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_column="0"//设置控件所在列
                android:text="按钮1" />
	......
        </TableRow>
    </TableLayout>

(1) FrameLayout is used to create a blank area on the screen. Each sub control added to the area occupies one frame. These frames will be superimposed one by one, and the later added controls will be superimposed on the upper layer of the previous control. All controls are displayed in the upper left corner of the screen by default.

(2) Define format

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    属性 ="属性值">
</FrameLayout>

(3) UI interface

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:foreground="@mipmap/ic_launcher"//设置帧布局容器的前景图像（始终在所有子控件之上）
        android:foregroundGravity="left" >//设置前景图像显示位置
    </FrameLayout>

(1) Overview constraintlayout is a new layout added to Android studio 2.2. It is suitable for writing interface layout in a visual way - of course, behind the visual operation is still implemented with XML code, but these codes are automatically generated by Android studio according to our operation. It includes three items: relative positioning, middle positioning, tendency and chain.

(2) Relative positioning relative positioning is one of the basic construction methods to create a layout in constraintlayout. Relative positioning means that one control is positioned relative to another control. The controls in the constraintlayout layout can be positioned horizontally and vertically by adding constraint relationships. The horizontal edges include left, start, right and end, and the vertical edges include top, bottom and baseline (the baseline at the bottom of the text).

4、 Summary:

The blog content mainly explains the relevant knowledge of Android interface layout. Through this study, we hope readers can master the functions of view and ViewGroup, master different interface layouts and the use of control properties in the layout, because in Android applications, most of all functions are reflected in the interface, and the beauty of the interface will give users a friendly experience.