Detailed explanation and use of layout_weight and weightSum attributes in Android layout

Due to the different sizes and types of Android devices, when we develop applications, we must consider the adaptation of the screen, and try to make our applications suitable for the size of mainstream models, so that our applications will not be affected by Different sizes are not beautiful. There are many ways to solve the problem of screen adaptation. Here I am talking about one of the solutions - clever use of the layout_weight attribute.

     The role of the Layout_weight attribute in the layout: it is used to assign an attribute that belongs to the space, and you can set the weight of the screen it occupies.

1. layout_weight attribute  

   First, let's look at the effect, and then give the calculation formula.

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
 2     xmlns:tools="http://schemas.android.com/tools"  
 3     android:layout_width="match_parent"  
 4     android:layout_height="match_parent"  
 5     android:orientation="horizontal" >  
 6   
 7     <Button  
 8         android:layout_width="0dp"  
 9         android:layout_height="wrap_content"  
10         android:layout_weight="1"  
11         android:text="buttton1" />  
12   
13     <Button  
14         android:layout_width="0dp"  
15         android:layout_height="wrap_content"  
16         android:layout_weight="2"  
17         android:text="button2" />  
18   
19 </LinearLayout>

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
 2     xmlns:tools="http://schemas.android.com/tools"  
 3     android:layout_width="match_parent"  
 4     android:layout_height="match_parent"  
 5     android:orientation="horizontal" >  
 6   
 7     <Button  
 8         android:layout_width="match_parent"  
 9         android:layout_height="wrap_content"  
10         android:layout_weight="1"  
11         android:text="buttton1" />  
12   
13     <Button  
14         android:layout_width="match_parent"  
15         android:layout_height="wrap_content"  
16         android:layout_weight="2"  
17         android:text="button2" />  
18   
19 </LinearLayout> 

The effect is as follows:

 

 

    Calculated as follows:

     First we assume the width of the screen is L

     Actual width = the original length of the control + the width of the percentage of the remaining space

     For example, the calculation formula on the first picture is as follows

      button1 actual width = 0 + 1/(1+2)L= 1/3L button2 actual width = 0 +2/(1+2)L = 2/3L

     The calculation formula on the second picture is as follows 

      button1 actual width = L +1[L-(L+L)]/(1+2) L = 2/3 L button2 actual width = L + 2[L-(L+L)]/(1+2) L = 1/3 L

     Well, see if the weight attribute is well understood here, the most important thing is the understanding of the remaining space.

2.weightSum property

The explanation of the android:weightSum attribute in the official document includes the following: "Define the maximum value of the weight synthesis. If this value is not specified, the cumulative value of the layout_weight attribute of all sub-masters and apprentices is used as the maximum value of the sum. Typical cases are: By specifying the layout_weight property of the subview to 0.5 and setting the weightSum property of LinearLayout to 1.0, the subview can occupy 50% of the available width and height".

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
 2     android:layout_width="match_parent"  
 3     android:layout_height="wrap_content"  
 4     android:gravity="center"  
 5     android:orientation="horizontal"  
 6     android:weightSum="1" >  
 7   
 8     <Button  
 9         android:layout_width="0dp"  
10         android:layout_height="wrap_content"  
11         android:layout_weight="0.5"  
12         android:text="test" />  
13   
14 </LinearLayout>