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，宽度为整个屏幕的宽度。