This is my participation 8 The fourth of the yuegengwen challenge 17 God , Check out the activity details ：8 Yuegengwen challenge

List of articles

• LinearLayout
• RelativeLayout
• How to choose

Android The seven basic layouts are ：
Linear layout LinearLayout
Relative layout RelativeLayout
Table layout TableLayout
Layer layout FrameLayout
Grid layout GridLayout
Absolute layout AbsoluteLayout
Constrained layout ConstraintLayout

LinearLayout

What's better than official documentation ：Android Developers LinearLayout

Linear layout LinearLayout, It means the whole Android Controls in layout are placed in a linear way .

Layout direction

orientation="horizontal"    level （ Default ）
orientation="vertical"   vertical 
 Copy code 

The proportion of , The proportion
Allocate the remaining free space proportionally . When using weights, the length of the direction to which the weight is assigned should be set to zero , For example, assign weight horizontally , Just put width Set to zero

layout_weight="1"
 Copy code 

gravity

layout_gravity=" Optional value "
 Copy code 

layout_gravity The alignment of child elements in parent elements , Set on child elements

When android:orientation="vertical" when , Only the horizontal setting works , The vertical setting doesn't work , namely ：left、right、center_horizontal Is effective
When android:orientation="horizontal" when , Only the vertical setting works , The horizontal setting doesn't work , namely ：top、bottom、center_vertical Is effective

And one with it Very similar properties

android:gravity=" Optional value "
 Copy code 

gravity Controls the alignment of the control layout . Optional value is buttom、left、right、center_vertical、fill_vertical、center_horizontal、fill_horizontal、center、fill、clip_vertical、clip_horizontal

Multiple parameters can be used at the same time , Need to use | The symbols separate , For example TextView If the text in the control needs to lean against the upper right corner, the following properties should be added android:gravity="top|right"

android:layout_gravity And android:gravity The difference between ：
android:gravity="bottom|right"（ Is the alignment of all child elements of this element , Set on parent element ）
android:layout_gravity ( The alignment of child elements in parent elements , Set on child elements )

Weight is difficult for novices to understand , So here we focus on the weight . Others are easy to understand by looking at official documents

Linear layout exercise

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">

    <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="btn1" />

    <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="2" android:text="btn2" />

    <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="btn3" />

</LinearLayout>
 Copy code 

Run the program ：

btn3 Have a height .btn1 and btn2 according to 1：2 Divide the remaining height in proportion .

RelativeLayout

What's better than official documentation ：Android Developers RelativeLayout

Dock parent control boundary

alignParentTop
alignParentBottom
alignParentLeft
alignParentRight
 Copy code 

Centered relative to the parent control

centerInParent
centerHorizontal
centerVertical
 Copy code 

Dock the surrounding control boundary

above
below
toRightOf
toLeftOf
 Copy code 

Align with the surrounding control boundary

alignTop
alignBottom
alignLeft
alignRight
alignBaseLine
 Copy code 

It seems that there are many attributes above , In fact, it's very easy to understand , Here is an example to practice , I believe you can understand it

Relative layout exercises

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent">
    <!-- @+id New definition id  stay R Class to define a new integer constant   If a constant already exists, reference the existing constant  @id quote id  In reference to id You can also use @+id  But if you write it wrong, it already exists id A new integer constant will be created   So for the sake of preciseness, we should use @id -->
    <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="btn1" />

    <Button android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:text="btn2" />

    <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentRight="true" android:text="btn3" />

    <Button android:id="@+id/button4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_centerVertical="true" android:text="btn4" />

    <Button android:id="@+id/button5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="btn5" />

    <Button android:id="@+id/button6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:text="btn6" />

    <Button android:id="@+id/button7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentBottom="true" android:text="btn7" />

    <Button android:id="@+id/button8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:text="btn8" />

    <Button android:id="@+id/button9" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentBottom="true" android:text="btn9" />

    <Button android:id="@+id/button10" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@id/button4" android:layout_below="@id/button1" android:layout_alignRight="@id/button2" android:layout_toRightOf="@id/button1" android:text="btn10" />

    <Button android:id="@+id/button11" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@id/button7" android:layout_alignTop="@id/button4" android:layout_toLeftOf="@id/button5" android:layout_toRightOf="@id/button4" android:text="btn11" />

    <Button android:id="@+id/button12" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBaseline="@id/button11" android:layout_toLeftOf="@id/button6" android:layout_toRightOf="@id/button11" android:text="btn12" />
</RelativeLayout>
 Copy code 

Running results ：

How to choose

analysis
1、RelativeLayout Separately for all sub View Do it twice measure, Conduct one horizontal and one vertical test respectively

2、LinearLayout First of all, it will be for all children View Conduct measure, And calculate totalWeight ( All of the children View Of weight Sum of attributes ), Then judge View Of weight Whether the attribute is the maximum , If it is the maximum, allocate the remaining space to it . If not used weight Properties for layout , Do not do the second measure

thus it can be seen ,weight Attributes have an impact on performance

3、 If they are located throughout View At the top of the tree and may be nested at multiple levels , At the bottom View There will be a lot of measure operation , Greatly reduce program performance . therefore , Try to put RelativeLayout and LinearLayout in View The bottom of the tree , And reduce nesting

Conclusion
1、RelativeLayout Slower than LinearLayout It's because it'll make you View call 2 Time measure The process , and LinearLayout Just once. , But there are weight When attribute exists ,LinearLayout It also needs to be done twice measure.

2、RelativeLayout The son of View If the height and RelativeLayout Different , It can lead to RelativeLayout stay onMeasure() When making transverse measurement in the method , The longitudinal measurement results have not been completed , Have to temporarily use their own height afferent View System . And the father View Giver View If the incoming value does not change, no unnecessary measurement will be made, and the optimization will fail , The solution is to use padding Instead of margin To optimize the problem .
3、 Without responding to level depth , Use Linearlayout instead of RelativeLayout.

4、 The default for developers is to create new RelativeLayout I hope developers can adopt as few as possible View Hierarchy , Many effects require multiple layers LinearLayout Nesting of , This is certainly not as good as the first floor RelativeLayout Better performance . Therefore, we should minimize layout nesting , Reduce hierarchy , Use, for example viewStub、include Techniques such as , Large layout optimization can be carried out .

Of course, the authorities are pushing now Constrained layout ：ConstraintLayout. In the following article, we will focus on .