Relative layout and table layout of Android learning notes

Development Environment:

Win XP + eclipse-jee-helios (version 3.6) + ADT (version 10.0.1) + Android SDK (version 10 );

Test environment for simulators and real machines: Android2.2

1. RelativeLayout-relative Layout

You can view the Android development documentation to see RelativeLayout (relative layout example). The implementation effect is as follows:

650) this. width = 650; "src =" http://www.bkjia.com/uploads/allimg/131228/100U3GZ-0.png "title =" designing_ui_layout_example.png "/>

The code for implementing this layout effect 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="wrap_content"                android:background="@drawable/blue"                android:padding="10px" >    <TextView android:id="@+id/label"              android:layout_width="fill_parent"              android:layout_height="wrap_content"              android:text="Type here:" />    <EditText android:id="@+id/entry"              android:layout_width="fill_parent"              android:layout_height="wrap_content"              android:background="@android:drawable/editbox_background"              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="10px"            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>

Analysis:Relative layout, and who is under, left, right, top at the same level, such

android:layout_alignTop="@id/ok"

The margin of the distance control.

Through the above learning, we can send the text message sender of the Android Project Study Notes

InVertical linear LayoutSet as follows:Nested relative layout in vertical linear LayoutForm,

650) this. width = 650; "src =" http://www.bkjia.com/uploads/allimg/131228/100U3N32-1.png "title =" zz.png "/>

The code for implementing the layout 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"    >                                                                                <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"    >        <TextView            android:layout_width="100dp"            android:layout_height="wrap_content"            android:text="@string/number"            android:id="@+id/numberlable"        />        <EditText            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:id="@+id/number"            android:layout_toRightOf="@id/numberlable"            android:layout_alignTop="@id/numberlable"            android:layout_marginLeft="5dp"        />    </RelativeLayout>                                                                                  <TextView    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:text="@string/content"    />    <EditText        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:minLines="3"        android:id="@+id/content"    />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="@string/button"        android:id="@+id/button"    /></LinearLayout>

Analysis:You can see that the layout can be nested and used, similar to the table, div, and other labels in the web page.

2. TableLayout-table layout

The table layout in the development document is as follows:

650) this. width = 650; "src =" http://www.bkjia.com/uploads/allimg/131228/100U34156-2.png "title =" table_layout.png "/>

The code to achieve the above effect 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:text="@string/table_layout_4_open"            android:padding="3dip" />        <TextView            android:text="@string/table_layout_4_open_shortcut"            android:gravity="right"            android:padding="3dip" />    </TableRow>    <TableRow>        <TextView            android:text="@string/table_layout_4_save"            android:padding="3dip" />        <TextView            android:text="@string/table_layout_4_save_shortcut"            android:gravity="right"            android:padding="3dip" />    </TableRow></TableLayout>

Analysis:This layout is particularly similar to the table label in the webpage layout, which is two rows and two columns,

<TableRow></TableRow>

Represents a row. in a row, there are two display controls.<TextView/>Represents two columns.

This article from the "Flowers bloom" blog, please be sure to keep this source http://020618.blog.51cto.com/6098149/1293370