Android常用的界面布局方式 android的界面布局有哪些

文章目录

 一、线性布局

二、相对布局

三、帧布局

四、表格布局

五、约束布局

总结

---

 一、线性布局

水平或垂直方式来显示界面中的控件。当控件水平排列时，显示顺序依次为从左到右，当控件垂直排列时，显示顺序依次为从上到下。

代码示例：

<?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:background="@color/design_default_color_secondary"
    >


    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="按钮1"
        android:layout_weight="1"
        android:layout_marginRight="5dp"
        >
    </Button>
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="按钮2"
        android:layout_weight="1"
        android:layout_marginRight="10dp"
        >
    </Button>
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="按钮3"
        android:layout_weight="2"
        >
    </Button>

</LinearLayout>

注意：

• LinearLayout布局中的android:layout_width属性值不可设为wrap_content
• 因为LinearLayout的优先级比Button高，如果设置为wrap_content，则Button控件的android:layout_weight属性会失去作用
• 当控件使用权重属性时，布局的宽度属性值通常设置为0dp
  

---

二、相对布局

相对定位的方式指定子控件位置，即以其它控件或父容器为参照物，摆放控件的位置。

 

 相对布局控件位置属性：

 代码示例：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/design_default_color_secondary">
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:text="按钮1"
        android:layout_marginBottom="20dp"
        >
    </Button>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮2"
        android:layout_centerInParent="true"
        android:layout_marginTop="260dp"
        android:id="@+id/button2"
        >
    </Button>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮3"
        android:layout_toRightOf="@id/button2"
        android:layout_alignBottom="@id/button2"
        android:layout_marginBottom="100dp"
        >
    </Button>
    
</RelativeLayout>

 

---

三、帧布局

空白区域，添加到该区域中的每个子控件占一帧，这些帧会一个一个叠加在一起，后加入的控件会叠加在上一个控件上层。所有控件都默认显示在屏幕左上角。

 

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:foreground="@mipmap/ic_launcher"
    android:foregroundGravity="left"
    >
    <Button
        android:layout_width="211dp"
        android:layout_height="395dp"
        android:text="按钮1"
        >
    </Button>
</FrameLayout>

---

四、表格布局

行、列的形式来管理控件，它不需要明确声明包含多少行、多少列，而是通过在TableLayout布局中添加TableRow布局来控制表格的行数，通过在TableRow布局中添加控件来控制表格的列数。

 

 表格布局属性：

表格布局控件属性：

 代码示例：

<?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"
    android:stretchColumns="0">
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮1"
            android:layout_column="0">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2"
            android:layout_column="0">
        </Button>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3"
            android:layout_column="0">
        </Button>
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:text="按钮4">
        </Button>
        <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_column="2"
        android:text="按钮5">
    </Button>
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:text="按钮6">
            
        </Button>
    </TableRow>

</TableLayout>

 

---

五、约束布局

横向和纵向上以添加约束关系的方式进行相对定位，其中，横向边包括Left、Start、Right、End，纵向边包括Top、Bottom、Baseline（文本底部的基准线）。

 

 约束布局下相对定位关系的属性：

 注意点：

•  在ConstraintLayout布局中，控件可以通过添加约束的方式确定该控件在父布局（ConstraintLayout）中的相对位置。
• 当相同方向上（横向或纵向），控件两边同时向ConstraintLayout添加约束，则控件在添加约束的方向上居中显示。
• 父布局中横向居中
• 在约束是同向相反的情况下，默认控件是居中的，但是也像拔河一样，两个约束的力大小不等时，就会产生倾向。

 

Chain的样式：

---

总结

ViewGroup，因此它们也支持在ViewGroup中定义的属性，这些属性可以看作是布局的通用属性。

 END.