Android開發計算機之布局

標籤：android開發   布局   

    學習了一段時間的安卓，現在開始操作一個小例子——計算機。相信我們的手機中都有計算機這個軟體，但是你知道它是怎麼進行具體操作的嗎？其實我暫時也還不知道，現在就簡單的布局來做一個小總結。

    對於一個軟體，漂亮的使用者介面（UI）總能給使用者留下深刻印象，這也是我們聽了介面設計課之後應有的思想。對於Android這樣的手機應用軟體而言，使用者介面更是不可忽略的。在Android中，View是所有可視化控制項的基類，它有五大布局方式：

 

線性布局

線性布局（LinearLayout）是較簡單的一個布局，它提供了控制項水平或者垂直方向的相片順序。

表格布局

表格布局（TableLayout）是按照行列來組織子視圖的布局，包含一系列的TableRow隊形，用於定義行。

相對布局

相對布局（RelativeLayout）是指在容器內部的子項目可以使用彼此之間的相對位置或與容器間的相對位置來進行定位。

幀布局

幀布局（FrameLayout）是五大布局中最簡單的一個布局，在這個布局中，整個介面被當成空白地區，所有子項目都不能都不能指定位置放置，全都放在空白地區的左上方，並且後面的子項目直接覆蓋在前面的子項目上，將前面的子項目部分或全部遮擋。

絕對布局

絕對布局（AbsoluteLayout）是指所有控制項的排列由開發人員通過控制項的座標來指定，容器不負責管理子控制項的位置。

    上面說了Android的五大布局，在進行實際設計的時候，開發人員根據介面的需求選擇相應的布局。此外，五大布局還可以相互的嵌套。下面是設計Android電腦的介面的例子，採用了布局的嵌套。修改

主Activity的布局檔案main.xml，代碼如下：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <TextView        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:text="本案例示範布局的嵌套"         android:textSize="20px"/>        <TextView        android:layout_width="fill_parent"        android:layout_height="50px"        android:textSize="40px"android:gravity="right"        android:background="#fff" />        <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >                <Button            android:id="@+id/num1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentLeft="true"            android:padding="20px"            android:text="1"            android:textSize="20px" />        <Button            android:id="@+id/num2"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num1"            android:padding="20px"            android:text="2"            android:textSize="20px" />        <Button            android:id="@+id/num3"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num2"            android:padding="20px"            android:text="3"            android:textSize="20px" />                <Button            android:id="@+id/back"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num3"            android:padding="20px"            android:text="BACK"            android:textSize="20px" />        <Button            android:id="@+id/add"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/back"            android:padding="20px"            android:text="+"            android:textSize="20px" />            </RelativeLayout>            <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >                <Button            android:id="@+id/num11"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_below="@id/num1"            android:padding="20px"            android:text="4"            android:textSize="20px" />        <Button            android:id="@+id/num12"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num11"            android:padding="20px"            android:text="5"            android:textSize="20px" />        <Button            android:id="@+id/num13"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num12"            android:padding="20px"            android:text="6"            android:textSize="20px" />                <Button            android:id="@+id/left"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num13"            android:padding="20px"            android:text="("            android:textSize="20px" />        <Button            android:id="@+id/jian"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/left"            android:padding="20px"            android:text="-"            android:textSize="20px" />            </RelativeLayout>                <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >                <Button            android:id="@+id/num21"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_below="@id/num11"            android:padding="20px"            android:text="7"            android:textSize="20px" />        <Button            android:id="@+id/num22"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num21"            android:padding="20px"            android:text="8"            android:textSize="20px" />        <Button            android:id="@+id/num23"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num22"            android:padding="20px"            android:text="9"            android:textSize="20px" />                <Button            android:id="@+id/right"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num23"            android:padding="20px"            android:text=")"            android:textSize="20px" />        <Button            android:id="@+id/chen"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/right"            android:padding="20px"            android:text="*"            android:textSize="20px" />            </RelativeLayout>    <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >                <Button            android:id="@+id/num31"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_below="@id/num21"            android:padding="20px"            android:text="0"            android:textSize="20px" />        <Button            android:id="@+id/num32"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num31"            android:padding="20px"            android:text="CE"            android:textSize="20px" />        <Button            android:id="@+id/num33"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num32"            android:padding="20px"            android:text="."            android:textSize="20px" />                <Button            android:id="@+id/equal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/num33"            android:padding="20px"            android:text="="            android:textSize="20px" />        <Button            android:id="@+id/gang"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_toRightOf="@id/equal"            android:padding="20px"            android:text="/"            android:textSize="20px" />            </RelativeLayout></LinearLayout>

如下：

Android開發計算機之布局