Android basic tutorial (ii) Five layout objects-framelayout, linearlayout, absolutelayout, relativelayout, tablelayout.

Source: Internet
Author: User

Hello everyone, let's talk about the five layout objects used by Android in this section. They are respectively framelayout (Framework layout: I don't know if they are translated in this way), linearlayout (linear layout ), absolutelayout (absolute layout), relativelayout (relative layout), tablelayout (table layout ).

 

Framelayout:

 

Framelayout is the simplest layout object. It is customized as a blank standby area on your screen, where you can then fill in a single object-
For example, a picture you want to publish. All child elements are fixed in the upper left corner of the screen. You cannot specify a position for a child element in framelayout. The next child element is directly in front
Overwrite and fill a child element to block them in part or whole (unless the last child element is transparent ).

 

Let's take a look:

 

 

WhereMain. xml
The Code is as follows:

 

<? XML version = "1.0" encoding = "UTF-8"?>
<Framelayout xmlns: Android = "http://schemas.android.com/apk/res/android"

Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
>

 <! -- We have added a button here -->

<Button

Android: text = "button"

Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
/>

<Textview

Android: text = "textview"
Android: textcolor = "# 0000ff"


Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
/>

</Framelayout>


 

Linearlayout:

 

Linearlayout lists all child elements based on the vertical or horizontal attribute values you set for it. All child elements are stacked after other elements, so each row of a vertical list only has
One element, regardless of how wide they are, and a horizontal list will have only one row height (the height is the height of the highest child element plus the border height ). Linearlayout
And align with each other (right, center, or left ).

 

Linearlayout can also be specified for individual child elements.Weight
. The advantage is that it allows sub-elements to fill the remaining space on the screen. This also avoids the crowding of a small object in a large screen.
In a heap, they are allowed to zoom in and fill the blank space. Specify a sub-elementWeight
Value, and the remaining space is specified according toWeight
Proportional allocation to these child elements. Default
Weight
The value is 0. For example, if there are three text boxes, two of them specifyWeight
If the value is 1, the two text boxes are proportionally enlarged and the remaining space is filled, while the third text box
Do not zoom in.

 

Let's take a look:

 

 

WhereMain. XM
L The Code is as follows:

 

<? XML version = "1.0" encoding = "UTF-8"?>
<Linearlayout xmlns: Android = "http://schemas.android.com/apk/res/android"

Android: Orientation ="Vertical"

Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent">
<Linearlayout

Android: Orientation ="Vertical"

Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
Android: layout_weight = "2">

<Textview
Android: text = "welcome to Mr Wei's blog"

Android: textsize = "15pt"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
/>
</Linearlayout>

<Linearlayout

Android: Orientation ="Horizontal"

Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
Android: layout_weight = "1">


<Textview

Android: text = "red"

Android: gravity = "center_horizontal"
// The word is horizontally centered here
Android: Background = "# aa0000"
Android: layout_width = "wrap_content"
Android: layout_height = "fill_parent"
Android: layout_weight = "1"/>

<Textview

Android: text = "green"
Android: gravity ="Center_horizontal
"
Android: Background = "#00aa00"
Android: layout_width = "wrap_content"
Android: layout_height = "fill_parent"
Android: layout_weight = "1"/>

</Linearlayout>
</Linearlayout>

 

Absolutelayout:

 

Absolutelayout
The sub-element can specify the exact x/y coordinate value and display it on the screen. (0,
0) is the upper left corner. When you move down or to the right, the coordinate value increases.Absolutelayout
There is no page border, and elements can overlap with each other (although not recommended ). We generally do not recommend
Absolutelayout
Unless you have a legitimate reason to use it, because it makes the interface code too rigid, so that it can work well on different devices.

 

Let's take a look:

 

 

WhereMain. XM
L The Code is as follows:

 

<? XML version = "1.0" encoding = "UTF-8"?>
<Absolutelayout xmlns: Android = "http://schemas.android.com/apk/res/android"

Android: Orientation = "vertical"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
>
<Edittext

Android: text = "welcome to Mr Wei's blog"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
/>

<Button

Android: layout_x = "250px"
// Set the X coordinate of the button
Android: layout_y = "40px"
// Set the Y coordinate of the button
Android: layout_width = "70px"
// Set the button width
Android: layout_height = "wrap_content"
Android: text = "button"

/>

</Absolutelayout>


Relativelayout:

 

Relativelayout
Allows child elements to specify their positions relative to other elements or parent elements (throughID
). Therefore, you can align them right, up or down, or in the center of the screen.
Arrange two elements. Elements are arranged in order. Therefore, if the first element is in the center of the screen, other elements relative to the element are arranged in the relative position in the center of the screen. If you useXML
To specify this
Layout

Before you define it, the associated elements must be defined.

 

Let's take a look:

 

 

WhereMain. xml
The Code is as follows:

 

<? XML version = "1.0" encoding = "UTF-8"?>
<Relativelayout xmlns: Android = "http://schemas.android.com/apk/res/android"

Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent">
<Textview

Android: Id = "@ + ID/label"

Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: text = "welcome to Mr Wei's blog:"/>

<Edittext

Android: Id = "@ + ID/entry"

Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: layout_below = "@ ID/label"/>

<Button

Android: Id = "@ + ID/OK"

Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_below = "@ ID/entry"

Android: layout_alignparentright = "true"
Android: layout_marginleft = "10dip"
Android: text = "OK"/>


 <Button

Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_toleftof = "@ ID/OK"
Android: layout_aligntop = "@ ID/OK"
Android: text = "cancel"/>


</Relativelayout>

 

Tablelayout:

 

Tablelayout
Assign the positions of child elements to rows or columns. OneTablelayout
By manyTablerow
Composition, eachTablerow
Define
Row
(In fact, you can define other sub-objects, which will be explained below ).Tablelayout
Container not displayedRow
,Cloumns
OrCell
. Each
Row
With 0 or moreCell
; EachCell
HaveView
Object. A table consists of columns and rows in multiple cells. The table allows cells to be empty. Cells cannot span columns.Html

.

 

Let's take a look:

 

 

WhereMain. xml
The Code is as follows:

 

<? XML version = "1.0" encoding = "UTF-8"?>
<Tablelayout xmlns: Android = "http://schemas.android.com/apk/res/android"

Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"
Android: stretchcolumns = "1">
<Tablerow>

<Textview Android: layout_column = "1" Android: text = "open..."/>
<Textview Android: text = "Ctrl-o"Android: gravity = "right"
/>
</Tablerow>

<Tablerow>

<Textview Android: layout_column = "1" Android: text = "Save..."/>
<Textview Android: text = "Ctrl-s"Android: gravity = "right"
/>
</Tablerow>

<View Android: layout_height = "2dip" Android: Background = "# ff909090"/>
// Here is the separator line
<Tablerow>

<Textview Android: text = "X"/>
<Textview Android: text = "Export..."/>
<Textview Android: text = "Ctrl-e"Android: gravity = "Right
"/>
</Tablerow>

<View Android: layout_height = "2dip" Android: Background = "# ff909090"/>

<Tablerow>

<Textview Android: layout_column = "1" Android: text = "quit"
Android: padding = "3dip"/>
</Tablerow>

</Tablelayout>

 

The above are the five layout objects of Android. This project is so huge that it took me more than an hour to help you ~ Leave more messages!

 

References: http://www.androidcn.net/wiki/index.php/Devel/ui/layout

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.