Android：week 3總結 Android佈局一之相關練習

例一：

用LinearLayout實現的效果：    

注意的地方是，LinearLayout嵌套的第一個LinearLayout的android：gravity="right |center"，即內容在右邊的中間。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tool="http://schemas.android.com/tools"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    tool:context=".MainActivity"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="##F5F5F5">
        <TextView
            android:layout_margin="10sp"
            android:layout_width="match_parent"
            android:layout_height="150sp"
            android:text="1+1"
            android:textSize="50sp"
            android:gravity="right |center"
            android:paddingRight="20sp"
            android:background="#DCDCDC"/>
<!--        字符與上下左右的間距-->
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5">
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="DEL"
            android:textSize="50sp"
            android:layout_marginRight="10sp"
            android:layout_marginLeft="10sp"
            android:background="#C0C0C0">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="7"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginLeft="10sp">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="8"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="9"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="÷"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginRight="10sp">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginLeft="10sp">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="5"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="6"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="×"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginRight="10sp">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginLeft="10sp">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="3"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="-"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginRight="10sp">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="."
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginLeft="10sp">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="0"
            android:textSize="50sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="="
            android:textSize="50sp"
            android:layout_weight="1"
            android:background="#FF7F50">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="+"
            android:textSize="50sp"
            android:layout_weight="1"
            android:layout_marginRight="10sp">
        </Button>
    </LinearLayout>
</LinearLayout>

用RelativeLayout實現效果： 

 

這裏需要注意的是text文本添加不能直接添加，需要在strings.xml裏面添加。另外，我修改每個按鈕的寬度才使沒有空餘，其他方法還不曉得。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tool="http://schemas.android.com/tools"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    tool:context=".MainActivity">
    <Button
        android:id="@+id/bt1"
        android:layout_width="match_parent"
        android:layout_height="150sp"
        android:text="1+1"
        android:textSize="50sp"
        android:gravity="right|center">
    </Button>
    <Button
        android:id="@+id/bt2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/del"
        android:textSize="50sp"
        android:layout_below="@id/bt1">
    </Button>
    <Button
        android:id="@+id/bt31"
        android:layout_marginLeft="5sp"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="7"
        android:textSize="50sp"
        android:layout_below="@id/bt2">
    </Button>
    <Button
        android:id="@+id/bt32"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="8"
        android:textSize="50sp"
        android:layout_below="@id/bt2"
        android:layout_toRightOf="@id/bt31">
    </Button>
    <Button
        android:id="@+id/bt33"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="9"
        android:textSize="50sp"
        android:layout_below="@id/bt2"
        android:layout_toRightOf="@id/bt32">
    </Button>
    <Button
        android:id="@+id/bt34"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="÷"
        android:textSize="50sp"
        android:layout_below="@id/bt2"
        android:layout_toRightOf="@id/bt33">
    </Button>
    <Button
        android:id="@+id/bt41"
        android:layout_marginLeft="5sp"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="4"
        android:textSize="50sp"
        android:layout_below="@id/bt31">
    </Button>
    <Button
        android:id="@+id/bt42"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="5"
        android:textSize="50sp"
        android:layout_below="@id/bt32"
        android:layout_toRightOf="@id/bt41">
    </Button>
    <Button
        android:id="@+id/bt43"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="6"
        android:textSize="50sp"
        android:layout_below="@id/bt33"
        android:layout_toRightOf="@id/bt42">
    </Button>
    <Button
        android:id="@+id/bt44"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="×"
        android:textSize="50sp"
        android:layout_below="@id/bt34"
        android:layout_toRightOf="@id/bt43">
    </Button>
    <Button
        android:id="@+id/bt51"
        android:layout_marginLeft="5sp"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="1"
        android:textSize="50sp"
        android:layout_below="@id/bt41">
    </Button>
    <Button
        android:id="@+id/bt52"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="2"
        android:textSize="50sp"
        android:layout_below="@id/bt42"
        android:layout_toRightOf="@id/bt51">
    </Button>
    <Button
        android:id="@+id/bt53"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="3"
        android:textSize="50sp"
        android:layout_below="@id/bt43"
        android:layout_toRightOf="@id/bt52">
    </Button>
    <Button
        android:id="@+id/bt54"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="-"
        android:textSize="50sp"
        android:layout_below="@id/bt44"
        android:layout_toRightOf="@id/bt53">
    </Button>
    <Button
        android:id="@+id/bt61"
        android:layout_marginLeft="5sp"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="."
        android:textSize="50sp"
        android:layout_below="@id/bt51">
    </Button>
    <Button
        android:id="@+id/bt62"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="0"
        android:textSize="50sp"
        android:layout_below="@id/bt52"
        android:layout_toRightOf="@id/bt61">
    </Button>
    <Button
        android:id="@+id/bt63"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="="
        android:textSize="50sp"
        android:layout_below="@id/bt53"
        android:layout_toRightOf="@id/bt62">
    </Button>
    <Button
        android:id="@+id/bt64"
        android:layout_width="100sp"
        android:layout_height="wrap_content"
        android:text="+"
        android:textSize="50sp"
        android:layout_below="@id/bt54"
        android:layout_toRightOf="@id/bt63">
    </Button>
</RelativeLayout>

例二：

用LinearLayout實現的效果：

需要特別注意的使最後兩行如何使用線性佈局：

       如圖：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tool="http://schemas.android.com/tools"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    tool:context=".MainActivity"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="100sp"
        android:text="24242"
        android:textSize="50sp"
        android:gravity="right|center"
        android:background="#000000"
        android:textColor="#FFFFFF"
        android:layout_margin="10sp">
    </TextView>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70sp">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="MC"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="M+"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="M-"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="MR"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70sp">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="C"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="±"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="/"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="*"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70sp">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="7"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="8"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="9"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="-"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70sp">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="5"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="6"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="+"
            android:textSize="30sp"
            android:layout_weight="1">
        </Button>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="135sp"
        android:orientation="horizontal">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_weight="3">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10sp">
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="1"
                    android:textSize="30sp"
                    android:layout_weight="1">
                </Button>
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="2"
                    android:textSize="30sp"
                    android:layout_weight="1">
                </Button>
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="3"
                    android:textSize="30sp"
                    android:layout_weight="1">
                </Button>
            </LinearLayout>
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <Button
                    android:layout_width="207dp"
                    android:layout_height="wrap_content"
                    android:text="0"
                    android:textSize="30sp"></Button>

                <Button
                    android:layout_width="100dp"
                    android:layout_height="wrap_content"
                    android:text="."
                    android:textSize="30sp"></Button>
            </LinearLayout>

        </LinearLayout>
        <LinearLayout
            android:layout_width="102sp"
            android:layout_height="match_parent"
            android:layout_weight="1">
            <Button
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="="
                android:textSize="30sp"></Button>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

另外：

字符一般用sp

orientation在相對佈局無用。