Android|佈局及標籤屬性

六大布局:線性佈局,相對佈局,絕對佈局,表格佈局,幀佈局,網格佈局。

線性佈局(LinearLayout):
  <LinerLayout>作爲根標籤。線性佈局內控件垂直或者水平排列。通過orientation屬性來指定。取值:horizontal(水平)默認值,vertical(垂直)。

  柵格化排列:通過layout_heightlayout_widthlayout_height屬性聯合控制。

  示例:水平方向3個button平分寬度。指定layout_height都相同,並且layout_width要爲0dp。

效果圖:
在這裏插入圖片描述

<?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:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.Main4Activity">
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="50dp"
        android:text="我佔1格"
        android:textSize="15sp"/>
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="50dp"
        android:text="我佔1格"
        android:textSize="15sp"/>
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="50dp"
        android:text="我佔1格"
        android:textSize="15sp"/>
</LinearLayout>

解釋:
  上面示例中我們可以看到一行中3個button的weight加在一起等於3,就說明把寬度平均分成3份,每個button的weight等於1,1/3所以每個button各佔一份。當然我們也可以指定讓第一個按鈕佔1格,第二個按鈕佔2格,第三個按鈕佔3格。

效果圖:
在這裏插入圖片描述

<?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:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.Main4Activity">
    <Button
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_weight="1"
        android:text="佔1格"
        android:textSize="15sp"/>
    <Button
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_weight="2"
        android:text="佔2格"
        android:textSize="15sp"/>
    <Button
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_weight="3"
        android:text="佔3格"
        android:textSize="15sp"/>
</LinearLayout>

相對佈局(RelativeLayout):
  <RelativeLayout>作爲根標籤。相對於 父控件 或者 指定 id 控件 佈局。

  佈局內控件的常用屬性:
    居中:
    layout_centerVertical:指定爲true時垂直居中。
    layout_centerHorizontal:指定爲true時水平居中。

    相對於 父控件:
    layout_alignParentTop:和父控件頂部對齊。
    layout_alignParentRight:和父控件右側對齊。
    layout_alignParentBottom:和父控件底部對齊。
    layout_alignParentLeft:和父控件左側對齊。

    相對於 指定 id 控件:
    layout_above:跟隨到指定控件上方。
    layout_below:跟隨到指定控件下方。
    layout_toRightOf:跟隨到指定控件右側。
    layout_toLeftOf:跟隨到指定控件左側。
示例:
效果圖:
在這裏插入圖片描述

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.Main2Activity">
    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="按鈕1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toLeftOf="@+id/btn1"
        android:text="按鈕2"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:layout_toRightOf="@+id/btn1"
        android:text="按鈕3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_above="@+id/btn1"
        android:text="按鈕4"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/btn1"
        layout
        android:text="按鈕5"/>
</RelativeLayout>

效果圖:
在這裏插入圖片描述

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.Main2Activity">
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="按鈕1"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="按鈕2"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:text="按鈕3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:text="按鈕3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按鈕3"/>
	<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:text="按鈕3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:text="按鈕3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按鈕3"/>
</RelativeLayout>

絕對佈局(AbsoluteLayout):

  <AbsoluteLayout>作爲根標籤。控件通過 layout_xlayout_y來指定其位置。

注:AbsoluteLayout is deprecated.


表格佈局(TableLayout):
  <TableLayout>作爲根標籤。在<TableLayout>標籤內使用<TableRow>標籤來組織控件。控件對lay_weight屬性生效。
效果圖:
在這裏插入圖片描述

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    tools:cotext=".MainActivity">
    <TableRow>
        <Button android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent"/>
        <Button android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent"/>
        <Button android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent"/>
        <Button android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent"/>
        <Button android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent"/>
    </TableRow>
</TableLayout>
餘下的兩個佈局會後續補充。
發佈了46 篇原創文章 · 獲贊 1 · 訪問量 2498
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章