Android Common layout (framelayout, LinearLayout, relativelayout) detailed _android

Many developers have heard that the Android terminal has a wide variety of screen sizes and all sorts of screen resolutions, and that Android development is definitely a headache for screen adaptation. Because before Android came out, the UI solutions that the vast majority of developers knew were broadly divided into two categories:

1, in the web development of CSS, one layer to cascade style.
2, in the development of iOS to calculate the size of each uiview.

Both of these options, regardless of which scenario is facing a heavily fragmented Android terminal, are a nightmare. The good news is that Android offers another set of solutions to deal with serious terminal fragmentation, which is layout and 9-patch.

Here's the layout, when Android SDK just came out, Android offered Absolutelayout,framelayout,linearlayout, Relativelayout and tablelayout Five major layouts to address the problem of terminal fragmentation.

But soon Android found out that Absolutelayout was a stupid solution that no longer supports this layout in the Android 1.5 system, while Tablelayout is still supported in the remaining four layouts. But due to fragment and the emergence of new tablayout, bloggers here assert that Tablelayout also lives soon, was removed support just sooner or later.

So, Android's five basic layouts are now three (here's the basic layout, the new layouts introduced in the Android support package don't count), and here are the three basic layouts.

First, Framelayout
Framelayout should be the simplest layout of the Android system, and the elements in Framelayout, by default, are based on the top vertex of the framelayout control, one layer at a point, and the elements that are added to the front.

Here's a demo with the following code:

<framelayout
  xmlns:android= "http://schemas.android.com/apk/res/android"
  android:layout_width= "match _parent "
  android:layout_height=" match_parent ">
 
  <view
    android:layout_width=" 200DP
    " android:layout_height= "200DP"
    android:background= "#ff0000"/>
 
  <view
    android:layout_width= " 200DP "
    android:layout_height=" 200DP "
    android:background=" #000000 "/>
 
  <view
    android: Layout_width= "200DP"
    android:layout_height= "200DP"
    android:layout_margin= "100DP"
    android: background= "#00ff00"/>
 
</FrameLayout>

The results of the operation are as follows:

In the code, there are three view, and only two view, one black and one green, on the run result. This is because the red view is covered by the black view.

In Framelayout, you specify the position of the child element by the Android:layout_gravity attribute, and then adjust the position of the black view in the appeal example, so that the red view is displayed and the adjusted code is as follows:

<view
  android:layout_width= "200DP"
  android:layout_height= "200DP"
  android:layout_gravity= "bottom |right "
  android:background=" #000000 "/>

　

You can see that the android:layout_gravity attribute is added to the code above, and two values are specified, one for the bottom, and one for right, which means that the view will be placed in the lower right-hand corner of the framelayout. The results of the operation are shown in the following illustration:

Second, LinearLayout
the linearlayout is a linear layout that allows elements within it to be sorted in the specified direction. The direction of the LinearLayout is specified by the Android:orientation property and can be specified by the Android:gravity property.

or directly on the code to see the effect, the code is as follows:

<linearlayout
  xmlns:android= "http://schemas.android.com/apk/res/android"
  android:layout_width= " Match_parent "
  android:layout_height=" match_parent "
  android:orientation=" vertical "
  android:gravity=" "Center" >
 
  <view
    android:layout_width= "100DP"
    android:layout_height= "100DP"
    android: background= "#ff0000"/>
 
  <view
    android:layout_width= "100DP"
    android:layout_height= "100DP"
    android:background= "#000000"/>
 
  <view
    android:layout_width= "100DP"
    android:layout_ height= "100DP"
    android:background= "#00ff00"/>
</LinearLayout>

In code, the LinearLayout is set in portrait orientation and centered, so the results of the run are as shown in the following illustration:

In addition to Android:orientation will be set to vertical, can also be set to horizontal. Let the elements inside the linearlayout be arranged horizontally, changing the android:orientation attribute value in the example above to the result of the horizontal operation, as shown in the following figure:

Three, relativelayout
relativelayout is the most flexible and complex layout in the basic layout, and the elements within it can determine the layout by setting the relative relationship between each other. When using Relativelayout, it is recommended that you set an ID for each element inside it, and the following is still a Lezilai to demonstrate how this layout is used. The code is as follows:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" android:layout_width= "match_parent "android:layout_height=" match_parent "> <view android:id=" @+id/red "android:layout_width=" 100DP "Andro id:layout_height= "100DP" android:background= "#ff0000"/> <view android:id= "@+id/black" Android:layout_wid
    Th= "100DP" android:layout_height= "100DP" android:layout_torightof= "@id/red" android:layout_below= "@id/red" android:background= "#000000"/> <view android:id= "@+id/green" android:layout_width= "100DP" android:layou t_height= "100DP" android:layout_below= "@id/black" android:layout_alignparentright= "true" android:background= "# 00ff00 "/> <view android:id=" @+id/gray "android:layout_width=" 100DP "android:layout_height=" 100DP "an Droid:layout_centerinparent= "true" android:background= "#888888"/> <view android:id= "@+id/orange" Android : Layout_width= "100DP" android:layout_height= "100DP" android:layout_torightof= "@id/green" android:layout_below= "@id/gray" android:backgr
 ound= "#ff8800"/> </RelativeLayout>

To analyze the code first, you can see that each view is set with an ID value, Red,black,green,gray and orange respectively. And then through the code, you can see that black is at Red's right and below, Green is under black and right aligns its parent element (that is, relativelayout), gray centers the parent element (that is, relativelayout), Orange is at Green's right and underneath the gray, and the results are as follows:

Here is a summary of the properties associated with the layout in Relativelayout:

Android:layout_below: At the bottom of the specified element
Android:layout_above: Located above the specified element
Android:layout_toleftof: On the left of the specified element
Android:layout_torightof: At the right side of the specified element
Android:layout_centervertical: Align the parent element vertically
Android:layout_ Centerhorizontal: Horizontally align the parent element
Android:layout_centerinparent: center-align the parent element
Android:layout_alignparentright: Align to the right of the parent element
Android:layout_alignparentleft: left-aligned with the parent element
Android:layout_alignparenttop: aligned to the parent element
Android:layout_ Alignparentbottom: Aligns with the parent element
Android:layout_alignright: Right-aligned to the specified element
Android:layout_alignleft: left-aligned with the specified element
Android:layout_aligntop: Snap to the specified element
Android:layout_alignbottom: Align with the specified element
starting with Android 4.2, which starts with API level 17, Android has enhanced relativelayout to better respond to and localize this requirement, such as in some countries, text is read from right to left, which is called RTL. The following attributes have been added to respond to Rtl,relativelayout:

Android:layout_alignstart: aligns with the starting position of the specified element
Android:layout_tostartof: at the beginning of the specified element
Android:layout_alignparentstart: align with parent element and start side
Android:layout_alignend: aligns with the end of the specified element
android:layout_toendof: at the end of the specified element
Android:layout_alignparentend: aligns with the end position of the specified element
Here's the beginning and the end we can make the following understanding:

Start: In the country reading habit from left to right, the beginning is equal to the left side, the tostartof display effect equals Toleftof. But in the country that reads habits from right to left, then the start side becomes the right side, the tostartof display effect equals Torightof.
End: As in the face of the beginning of the understanding, the end of the left to right reading habits of the country is the right side, and vice versa on the left.

Original link: http://lyjbk.com/archives/158.html

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.