android三種布局之線性布局LineaLayout

首先要明白的是其一android中的組件使用的是盒子模型，與html標簽一樣有margin和padding屬性，但是名字不一樣。其二Android在布局中不使用px為單位，而是使用dp為長度單位，sp為字體大小單位

一、 線性布局LineaLayout

　　值得注意的是LinearLayout標簽有一個必要屬性android:orientation，用來指示組件是水平展開（horizontal）還是垂直展開（vertical）。下面給出一個LinearLayout的基本使用

　　1.水平展開--horizontal

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"><!--水平展開-->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@color/colorAccent"
        android:text="這是文字1!"
        android:textSize="25sp"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@color/colorPrimary"
        android:text="這是文字2"
        android:textSize="20sp"/>

</LinearLayout>

　　預覽圖：可以看出第二個TextView在第一個TextView的右方

　　2. 垂直展開--vertical

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"><!--垂直展開-->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@color/colorAccent"
        android:text="這是文字1!"
        android:textSize="25sp"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@color/colorPrimary"
        android:text="這是文字2"
        android:textSize="20sp"/>

</LinearLayout>

 

　　預覽圖：可以看出第二個TextView在第一個TextView的下方

　　3. 下面介紹線性布局的重要屬性gravity、layout_gravity和layout_weigt

　　　　3.1 gravity屬性 確定子元素的位置，並且一次性可以設置多個屬性值，用“|”隔開

　　　　　該屬性常用取值如下 

屬性值	說明
right	子元素放在布局右邊（vertival有效）
left	子元素放在布局左邊（vertival有效）
top	子元素放在布局頂部（horizontal有效）
bottom	子元素放在布局底部（horizontal有效）
center_vertical	子元素垂直居中（horizontal有效）
center_horizontal	子元素水平居中（vertical有效）
center	子元素居中顯示

　　

　　　　3.2 layout_gravity屬性 確定自身元素的位置，並且一次性可以設置多個屬性值，用“|”隔開

　　　　　該屬性常用取值如下 

屬性值	說明
right	在父元素中放在右邊（vertival有效）
left	在父元素中放在左邊（vertival有效）
top	在父元素中放在頂部（horizontal有效）
bottom	在父元素中放在底部（horizontal有效）
center_vertical	該元素垂直居中（horizontal有效）
center_horizontal	該元素水平居中（vertical有效）
center	該元素居中顯示

 

　　　　測試right、left和center_horizontal：

　　　

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"><!--垂直展開-->

    <!--該元素放在父元素的右邊，其中文字（相當於子元素）放在中間-->
    <TextView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_margin="10dp"
        android:layout_gravity="right"
        android:gravity="center"
        android:background="@color/colorAccent"
        android:text="這是文字1!"
        android:textSize="25sp"/>


    <!--該元素放在父元素的左邊，其中文字（相當於子元素）放在頂部-->
    <TextView
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_margin="10dp"
        android:layout_gravity="left"
        android:gravity="top"
        android:background="@color/colorPrimary"
        android:text="這是文字2"
        android:textSize="15sp"/>


    <!--該元素放在父元素的水平中間，其中文字（相當於子元素）放在底部並且中間-->
    <TextView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_margin="10dp"
        android:layout_gravity="center_horizontal"
        android:gravity="bottom|center"
        android:background="@color/colorPrimary"
        android:text="這是文字3"
        android:textSize="20sp"/>

</LinearLayout>

 

　　　　預覽圖

　　　　

 

　　　　3.3 layout_weight屬性 表示元素所占權重，份數

　　　　      layout_sum屬性 表示總權重，總份數

　　　　測試代碼:

<?xml version="1.0" encoding="utf-8"?>
<!--水平展開,其內容居中顯示
    總共6份-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:weightSum="6"
    android:gravity="center"
    >

    <!--layout_width屬性值為0dp時，layout_weight與顯示效果正比
        該元素占1份-->
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:background="@color/colorAccent"
        android:text="這是文字1!"
        android:textSize="15sp"/>

    <!--該元素占2份-->
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:gravity="center"
        android:background="@color/colorPrimary"
        android:text="這是文字2"
        android:textSize="15sp"/>

</LinearLayout>

 

　　　　預覽圖: 可以看出第二個TextView的寬度是第一個Text View的2倍。