寫(xiě)在前面
一直想寫(xiě)一寫(xiě)布局哆料，趁今天有空好好總結(jié)一下歹篓，留著以后看仰猖。
綜述
Android的布局有好多好多種券册，官方的、自定義的等等市咽，五花八門(mén)。原來(lái)安卓有五大基本布局抵蚊，現(xiàn)在共有六種施绎，前五種是傳統(tǒng)的，還有一種是比較新的贞绳。
五種傳統(tǒng)布局
- LinearLayout（線性布局）
- RelativeLayout（相對(duì)布局）
- FrameLayout（幀布局）
- AbsoluteLayout（絕對(duì)布局）
- TableLayout（表格布局）
其中谷醉，最常用的布局是前三種，絕對(duì)布局用過(guò)一點(diǎn)冈闭，表格布局根本沒(méi)用過(guò)（可能會(huì)很好用吧俱尼，但是前幾種滿足了我的日常需求）
新布局
- ConstraintLayout（約束布局）
谷歌爸爸在2016年新出的布局，現(xiàn)在取代RelativeLayout成了創(chuàng)建空Activity的默認(rèn)布局萎攒，非常非常強(qiáng)大遇八，操作非常簡(jiǎn)潔。
接下來(lái)主要對(duì)LinearLayout（線性布局）耍休、RelativeLayout（相對(duì)布局）刃永、FrameLayout（幀布局）、ConstraintLayout（約束布局）進(jìn)行介紹
一羊精、LinearLayout
0.簡(jiǎn)介
線性布局斯够，最常用的布局之一，所有包含在線性布局里的控件在線性方向上依次排列喧锦。接下來(lái)看看一些線性布局常用的屬性读规。
1.方向
在線性布局里面的控件，是按照線性的順序進(jìn)行排列的燃少，方向有兩種：橫向和縱向束亏。
屬性和屬性值：
android:orientation="horizontal" //水平
android:orientation="vertical" //垂直
實(shí)例：
//水平
android:orientation="horizontal"
//垂直
android:orientation="vertical"
2.對(duì)齊方式
屬性：
android:gravity
android:layout_gravity
需要注意的是，這兩個(gè)屬性是有區(qū)別的：
android:gravity是指本元素的子元素相對(duì)它的對(duì)齊方式,
android:layout_gravity是指本元素相對(duì)它的父元素的對(duì)齊方式供汛。
相同的枪汪，對(duì)于其他屬性涌穆，如果加上layout_前綴，就代表著本元素相對(duì)父元素的屬性雀久。
常用的屬性值：
-
android:gravity="center_horizontal"子控件水平方向居中 -
android:gravity="center_vertical"子控件豎直方向居中 -
android:gravity="center"子控件豎直方向和水平方向居中 -
android:gravity= start || end || top || bottom子控件左對(duì)齊 || 右對(duì)齊 || 頂部對(duì)齊 || 底部對(duì)齊 -
android:gravity= left || right子控件左對(duì)齊 || 右對(duì)齊
這里的start和left屬性宿稀，end和right屬性需要注意一下，這里寫(xiě)的是對(duì)于中國(guó)的情況而言赖捌。實(shí)際上祝沸，他們兩個(gè)是不同的，left是絕對(duì)的左邊越庇，而start會(huì)根據(jù)不同的國(guó)家習(xí)慣改變罩锐。比如在從右向左順序閱讀的國(guó)家，start代表的就是在右邊
實(shí)例：
效果一：第一個(gè)子控件設(shè)置水平垂直
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
tools:context="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_gravity="center_horizontal" //子控件設(shè)置水平垂直
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>
效果二：設(shè)置LinearLayout水平垂直
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
android:gravity="center_horizontal" //設(shè)置LinearLayout水平垂直
tools:context="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>
3.子控件大小
屬性：
layout_height
layout_width
layout_weight
屬性值：
-
layout_height= "wrap_content"根據(jù)子控件內(nèi)容的大小決定大小 -
layout_height= "match_parent"子控件填滿父容器 -
layout_height= "xdp"直接設(shè)置大小
比較特殊的：
layout_height= "0dp"-
layout_weight= "1"
當(dāng)為0dp大小時(shí)卤唉，需要配合weight使用涩惑，表示比例
實(shí)例：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="horizontal"
android:gravity="center"
tools:context="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" //設(shè)置占比例為1
android:text="Hello World!"
android:background="#9c9292"/>
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" //設(shè)置占比例為1
android:text="Hello World!"
android:background="#0d6074"/>
</LinearLayout>
上面的代碼設(shè)置兩個(gè)TextView的weight值均為1，則這兩個(gè)TextView一人占一半空間
如果第一個(gè)設(shè)置成2呢桑驱，兩個(gè)空間水平位置占比就變成了2：1
二竭恬、RelativeLayout
0.簡(jiǎn)介
相對(duì)布局，也是非常常用的布局之一熬的，和LinearLayout嚴(yán)格的線性排列不同痊硕，相對(duì)布局更隨意，它可以讓子控件出現(xiàn)在整個(gè)布局的任何位置押框。屬性還是比較多的岔绸，不過(guò)很有規(guī)律，明白一個(gè)就明白了其他所有的橡伞。所以下面對(duì)屬性分類介紹盒揉。
1.屬性值為true或false
屬性和屬性值：
android:layout_centerHrizontal 水平居中
android:layout_centerVertical 垂直居中
android:layout_centerInparent 相對(duì)于父元素完全居中
android:layout_alignParentBottom 貼緊父元素的下邊緣
android:layout_alignParentLeft 貼緊父元素的左邊緣
android:layout_alignParentRight 貼緊父元素的右邊緣
android:layout_alignParentTop 貼緊父元素的上邊緣
看命名就能看出這個(gè)屬性是啥意思。align是排列的意思骑歹，alignParent就是排列在父容器的某個(gè)位置预烙。
實(shí)例：
把三個(gè)TextView上中下排列
<?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="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:text="Hello World!"
android:background="#9c9292" />
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:text="Hello World!"
android:background="#0d6074" />
<TextView
android:id="@+id/tx_three"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Hello World!"
android:background="#a73956" />
</RelativeLayout>
- 使用的屬性用兩個(gè)空行標(biāo)示
這里需要注意的是，在最新版本的Andorid中道媚，單獨(dú)使用包含Start或者End屬性的話扁掸，會(huì)報(bào)錯(cuò)，提示需要再加入Left和Right屬性最域；而單獨(dú)使用Left和Right屬性谴分，會(huì)提示一個(gè)warning，提示推薦加入Start或者End屬性
2.屬性值必須為id的引用名[“@id/id-name]
屬性和屬性值：
android:layout_below 在某元素的下方
android:layout_above 在某元素的的上方
android:layout_toLeftOf 在某元素的左邊
android:layout_toRightOf 在某元素的右邊
android:layout_alignTop 本元素的上邊緣和某元素的的上邊緣對(duì)齊
android:layout_alignLeft 本元素的左邊緣和某元素的的左邊緣對(duì)齊
android:layout_alignBottom 本元素的下邊緣和某元素的的下邊緣對(duì)齊
android:layout_alignRight 本元素的右邊緣和某元素的的右邊緣對(duì)齊
根據(jù)另一個(gè)控件的位置來(lái)確定控件的位置镀脂。
實(shí)例：
把三個(gè)控件排成階梯狀
<?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="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:layout_alignStart="@+id/tx_three"
android:layout_alignLeft="@+id/tx_three"
android:layout_above="@+id/tx_three"
android:text="Hello World!"
android:background="#9c9292" />
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:layout_below="@+id/tx_three"
android:layout_alignEnd="@+id/tx_three"
android:layout_alignRight="@+id/tx_three"
android:text="Hello World!"
android:background="#0d6074" />
<TextView
android:id="@+id/tx_three"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Hello World!"
android:background="#a73956" />
</RelativeLayout>
3.屬性值為具體的像素值牺蹄，如30dip，40px
屬性和屬性值：
android:layout_marginBottom 離某元素底邊緣的距離
android:layout_marginLeft 離某元素左邊緣的距離
android:layout_marginRight 離某元素右邊緣的距離
android:layout_marginTop 離某元素上邊緣的距離
這里需要注意薄翅，有一個(gè)padding屬性沙兰，和margin屬性非常相似氓奈，我原來(lái)總是把這兩個(gè)屬性搞混。
padding和margin屬性詳解
先看兩個(gè)單詞的釋義：
margin 邊緣
padding 襯墊鼎天，填充
然后應(yīng)該就能區(qū)分出這兩個(gè)屬性了舀奶，一個(gè)是邊緣（外邊距），指該控件距離父控件或其他控件的邊距斋射；另一個(gè)是填充（內(nèi)邊距）育勺，指該控件內(nèi)部?jī)?nèi)容，如文本/圖片距離該控件的邊距罗岖。
-
貼一張圖：
padding和margin 再舉個(gè)栗子：
還是上面的代碼涧至，把兩個(gè)上下兩個(gè)控件改成相同的。
然后給下面的控件添加一些屬性桑包，讓內(nèi)邊距增加
android:paddingTop="8dp"
android:paddingLeft="20dp"
android:paddingStart="60dp"
然后就變成這樣了：
可以看到TextView里面的文字位置變化了南蓬。
如果添加margin屬性呢？
android:layout_marginTop="8dp"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
值和padding一樣捡多，然后變成了這樣：
可以看到TextView里面文字的位置并沒(méi)有發(fā)生變化蓖康，反而是TextView本身發(fā)生了變化。
自己寫(xiě)寫(xiě)Demo垒手，體會(huì)體會(huì)外邊距和內(nèi)邊距的區(qū)別吧。
三倒信、FrameLayout
0.幀布局
可能是最簡(jiǎn)單的一種布局科贬，沒(méi)有任何定位方式，當(dāng)我們往里面添加控件的時(shí)候鳖悠，會(huì)默認(rèn)把他們放到這塊區(qū)域的左上角榜掌，幀布局的大小由控件中最大的子控件決定，如果控件的大小一樣大的話乘综，那么同一時(shí)刻就只能看到最上面的那個(gè)組件憎账，后續(xù)添加的控件會(huì)覆蓋前一個(gè)。由于幀布局的特性卡辰，它的應(yīng)用場(chǎng)景并不是很多胞皱，不過(guò)它經(jīng)常配合Fragment使用。
1.屬性
android:foreground //設(shè)置改幀布局容器的前景圖像
android:foregroundGravity //設(shè)置前景圖像顯示的位置
實(shí)例：
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="com.example.icephone_1.layouttest.MainActivity">
<TextView
android:id="@+id/tx_one"
android:textSize="30sp"
android:layout_width="300dp"
android:layout_height="300dp"
android:text="Hello World!"
android:background="#9c9292" />
<TextView
android:id="@+id/tx_two"
android:textSize="30sp"
android:layout_width="200dp"
android:layout_height="200dp"
android:text="Hello World!"
android:background="#1c7649" />
<TextView
android:id="@+id/tx_three"
android:textSize="30sp"
android:layout_width="100dp"
android:layout_height="100dp"
android:text="Hello World!"
android:background="#a73956" />
</FrameLayout>
效果
四九妈、ConstraintLayout
0.約束布局
ConstraintLayout約束布局的含義: 根據(jù)布局中的其他元素或視圖, 確定View在屏幕中的位置, 受到三類約束, 即其他視圖, 父容器(parent), 基準(zhǔn)線(Guideline).
1.仔細(xì)想了想
還是算了吧QAQ
不寫(xiě)了反砌，前輩寫(xiě)的太好了.....
仔細(xì)研讀下面??的幾篇文章，收獲一定很大
ConstraintLayout完全解析
Android ConstraintLayout詳解
為什么ConstraintLayout代替其他布局?
五萌朱、參考資料
以上
隨意轉(zhuǎn)載宴树，注明出處
