Android基礎：常見佈局

時間 2019-12-05

原文原文鏈接

Android中的UI通常都是由多個Activity組成，視圖都是經過一個個組件構成，像Button、TextView、ImageView等，而包裹這些組件的咱們稱之爲佈局。css

Android中傳統的五大布局分別是LinearLayout(線性佈局)、RelativeLayout(相對佈局)、FrameLayout(幀佈局)、AbsoluteLayout(絕對佈局)、TableLayout(表格佈局)。前端

在Android Studio 2.2之後新增了一個佈局：ConstraintLayout(約束佈局)。 android

（ps: FlexboxLayout 是後加的）

Linearlayout

LinearLayout,咱們稱之爲線性佈局，由於它的佈局的排列是線性的，要麼水平，要麼垂直，經過android:orientation="vertical|horizontal"來控制。git

屬性

咱們用一張圖來歸納下LinearLayout的所持有的屬性及其用法。github

說下layout_gravity和gravity的區別，第一個是用來設置自己控件在父控件中的對齊方式，第二個是用來設置控件內的對齊方式，和margin和padding做用相似，一個對外，一個對內。編程

linearLayout最具備特色的一個屬性就是layout_weight。bash

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content" 
            android:layout_weight="2"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"/>
    </LinearLayout>
複製代碼

看上面這個例子，作一下簡單解釋：這就至關於把一個屏幕的寬度平分爲6份，第一個TextView佔一份，第二個佔兩份，第三個佔三份。app

RelativeLayout

RelativeLayout,相對佈局，能夠設置控件之間的位置關係。框架

咱們看一個RelativeLayout的特有屬性。ide

FrameLayout

FrameLayout,框架佈局，也叫作幀佈局，新加入的控件永遠在前一個控件之上，都是放在左上角位置，這也是它的特色之一。

AbsoluteLayout

AbsoluteLayout,絕對佈局，經過座標來肯定控件的位置。左上角爲(0.0).

相對來講，它的特有屬性就是layout_x 和layout_y，分別制定控件的x座標和y座標。

AbsoluteLayout如今已經被廢棄了，不推薦使用，只作個瞭解就好。

TableLayout

TableLayout將子元素排成行和列，由多個TableRow 對象組成，每一個TableRow表明一行。

TableLayout的子節點不能制定layout_width屬性，寬度老是MATCH_PARENT。

下面是其特有的屬性：

ConstraintLayout

ConstraintLayout可讓咱們更好地進行可視化編程，同時它也會減少嵌套的層級，有利於快速渲染。

每一個控件有水平和垂直兩個方向上的約束，共四個約束。

對於ConstraintLayout包含的控件不建議使用MATCH_PARENT,建議使用MATCH_CONSTRAINT(0dp)和水平垂直約束來設置。

看下其特有的屬性：

借用官網上的圖片，來看下兩個控件的位置關係。

看圖，就能夠很好地去理解 layout_constraintLeft_toRightOf這個屬性的意思：控件的左側位於約束控件的右側，就至關於控件在另外一個控件的右邊。

ConstraintLayout能夠設置相對於隱藏控件的距離，也就是圖中的屬性layout_goneMarginStart等。

bias傾斜

當咱們想設置一個水平居中的效果時，這樣設置：

<android.support.constraint.ConstraintLayout ...>
             <Button android:id="@+id/button" ...
                 app:layout_constraintLeft_toLeftOf="parent"
                 app:layout_constraintRight_toRightOf="parent/> </> 複製代碼

顯示的效果就是這樣：

若是再加上一個這個屬性呢？

app:layout_constraintHorizontal_bias="0.3"
複製代碼

能夠看到效果變成了這個樣子：

bias默認設置的是左邊和上邊的拉力，0～1之間。越大越靠右或者越靠下。

圓形定位

圓形定位是在1.1以後出現的，您能夠在一個角度和一個距離上約束一個小部件中心相對於另外一個小部件中心。

例如：

<Button android:id="@+id/buttonA" ... />
  <Button android:id="@+id/buttonB" ...
      app:layout_constraintCircle="@+id/buttonA"
      app:layout_constraintCircleRadius="50dp"
      app:layout_constraintCircleAngle="60" />      
複製代碼

強制約束

控件的寬度設置爲WRAP_CONTENT時，若是控件的寬度超過了約束的寬度，這時約束就會失效。能夠經過設置強制約束來限制控件的寬度在咱們所但願的約束以內。

例如：

<Button
        android:id="@+id/btn_A"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="16dp"
        android:text="A"
        app:layout_constraintLeft_toLeftOf="parent"/>

    <Button
        android:id="@+id/btn_B"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="B"
        app:layout_constraintLeft_toRightOf="@+id/btn_A"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/btn_A"/>
複製代碼

若是button B的內容過長，約束就會失效，能夠加上這句來強制約束：

app:layout_constrainedWidth=」true」
複製代碼

ratio 比率

咱們能夠用ConstraintLayout來設置寬高比，前提是該控件的寬高至少有一個爲0dp。

看下面的例子：

<Button android:layout_width="wrap_content"
                   android:layout_height="0dp"
                   app:layout_constraintDimensionRatio="1:1" />
複製代碼

這樣顯示的就是一個正方形。

<Button android:layout_width="0dp"
                   android:layout_height="0dp"
                   app:layout_constraintDimensionRatio="H,16:6"
                   app:layout_constraintLeft_toLeftOf="parent"
                   app:layout_constraintRight_toRightOf="parent"/>
複製代碼

其中的H是指約束高，寬高比爲16:6，寬度爲整個屏幕的寬度。