布局管理器

最新推荐文章于 2025-05-17 13:07:24 发布

Dilly__dally

最新推荐文章于 2025-05-17 13:07:24 发布

阅读量209

点赞数

CC 4.0 BY-SA版权

分类专栏：安卓

本文链接：https://blog.youkuaiyun.com/Dilly__dally/article/details/83317633

安卓专栏收录该内容

3 篇文章

订阅专栏

相对布局管理器（relativelayout）

width和height设为match-parent
android:gravity（各子组件的摆放方式）android:ignoregravity="@id/…"（哪个组件不受前面属性所影响）
Relativelayout.LayoutParams （控制相对布局管理器的各组件的分布方式）
组件参考位置
组件与布局管理器哪边对齐
组件与哪个组件的上下左右对齐
组件位于布局管理器的哪个位置

示例：软件更新界面

<?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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:background="@mipmap/bg"
    tools:context="com.example.mcq.softwareupdate.MainActivity">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="发现有新版本，您想现在安装吗？" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="以后再说"
        android:id="@+id/button2"
        android:layout_below="@id/textView1"
        android:layout_alignRight="@id/textView1"

        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="现在更新"
        android:id="@+id/button1"
        android:layout_below="@id/textView1"
        android:layout_toLeftOf="@id/button2"
        />
</RelativeLayout>

线性布局管理器（linearlayout）

垂直布局管理器每一行只能放一个组件，不会换行，当组件排到边缘以后则不会显示出来。
layout_weight属性，默认为0，对剩余空间按权重分配

范例：微信登录界面

<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="com.example.mcq.weixindenglu.MainActivity">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="20dp"
        android:hint="微信号/QQ号/Email"
        android:drawableLeft="@mipmap/zhanghao"/>
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="20dp"
        android:hint="密码"
        android:drawableLeft="@mipmap/mima"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="登录"
        android:textColor="#FFFFFF"
        android:background="#FF009688"

        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="登录遇到问题？"
        android:paddingTop="20dp"
        android:layout_gravity="center"
        />
</LinearLayout>

帧布局管理器（FrameLayout）

前景（不能被覆盖的，位于所有内容的最上方）设置：android:foreground

范例（显示层叠的正方形）：

<?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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:foreground="@mipmap/mr"
    android:foregroundGravity="right|bottom"
    tools:context="com.example.mcq.demo2.MainActivity">

    <TextView
        android:layout_width="280dp"
        android:layout_height="280dp"
        android:layout_gravity="center"
        android:background="#FF0000FF"
        android:textColor="#FFFFFF"
        android:text="蓝色背景的textview" />
    <TextView
        android:layout_width="230dp"
        android:layout_height="230dp"
        android:layout_gravity="center"
        android:background="#FF0077FF"
        android:textColor="#FFFFFF"
        android:text="天蓝色背景的textview" />
    <TextView
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:layout_gravity="center"
        android:background="#FF00B4FF"
        android:textColor="#FFFFFF"
        android:text="水蓝色背景的textview" />
</FrameLayout>

表格布局管理器（TableLayout）

android:collapseColumns="1" //将第2列隐藏
android:stretchColumns="1" //将第二列允许被拉伸（允许使用剩余空间）
android:shrinkColumns="1" //将第二列允许被收缩（其他列空间不够使时收缩第二列）
某一行空间不够时内容显示不全。
范例（喜马拉雅的登录界面）：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout 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:background="@mipmap/biaoge"
    android:stretchColumns="0,3"
    tools:context="mingrisoft.com.MainActivity">

    <!--第一行-->
    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="200dp"
        >
        <TextView />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:text="账 号:"
            android:gravity="center_horizontal"
            />
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="邮箱或者手机号"
            />
        <TextView />
    </TableRow>
    <!--第二行-->
    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="20dp"
        >
        <TextView />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:text="密 码:"
            android:gravity="center_horizontal"
            />
        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:hint="输入6-16位数字或字母"
            />
        <TextView />
    </TableRow>
    <!--第三行-->
    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="注 册"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#FF8247"
            android:text="登 录"/>
        <TextView />
    </TableRow>
    <!--第四行-->
    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="20dp"
        >
        <TextView />
        <TextView />
        <TextView
            android:text="忘记密码？"
            android:textColor="#FF4500"
            android:gravity="right"
            />
        <TextView />
    </TableRow>

</TableLayout>

网格布局管理器（GridLayout）

内容可以跨行、跨列显示、自动换行，而表格布局管理器只能跨列
android:columnCount="2" //设置最大列数为2列，rowCount类似
android:orientation="vertical" //设置垂直排列
android layout_column="0" //设此部件位于第一列，layout_row类似
android rowSpan="2" //设置跨两行显示，还要写android layout_gravity="fill"才行
范例（qq聊天信息列表）

<?xml version="1.0" encoding="utf-8"?>
<GridLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:columnCount="6"
    android:background="@mipmap/bg"
    tools:context="com.example.mcq.demo4.MainActivity">

    <ImageView
        android:id="@+id/imageview1"
        android:src="@mipmap/a1"
        android:layout_gravity="end"
        android:layout_columnSpan="4"
        android:layout_column="1"
        android:layout_row="0"
        android:layout_marginRight="5dp"
        android:layout_marginBottom="20dp"

        />
    <ImageView
        android:id="@+id/iamgeview2"
        android:src="@mipmap/ico2"
        android:layout_column="5"
        android:layout_row="0"
        />
    <ImageView
        android:id="@+id/iamgeview3"
        android:src="@mipmap/ico1"
        android:layout_column="0"
        android:layout_row="1"
        />
    <ImageView
        android:id="@+id/imageview4"
        android:src="@mipmap/b1"
        android:layout_row="1"
        android:layout_marginBottom="20dp"

        />
    <ImageView
        android:id="@+id/imageview1"
        android:src="@mipmap/a2"
        android:layout_gravity="end"
        android:layout_columnSpan="4"
        android:layout_column="1"
        android:layout_row="2"
        android:layout_marginRight="5dp"
        android:layout_marginBottom="20dp"

        />
    <ImageView
        android:id="@+id/iamgeview2"
        android:src="@mipmap/ico2"
        android:layout_column="5"
        android:layout_row="2"
        />
    <ImageView
        android:id="@+id/iamgeview3"
        android:src="@mipmap/ico1"
        android:layout_column="0"
        android:layout_row="3"
        />
    <ImageView
        android:id="@+id/imageview4"
        android:src="@mipmap/b2"
        android:layout_row="3"
        android:layout_marginBottom="20dp"

        />
</GridLayout>

布局管理器的嵌套

根布局管理器必须包含xmlns属性
在一个布局文件中，最多只能有一个根布局管理器，如果需要有多个还需要使用一个根布局管理器将他们括起来
不能嵌套太深，嵌套太深会影响性能

范例（微信朋友圈界面）

<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="com.example.mcq.demo5.MainActivity">
    <!-- 第一条信息 -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp" >
        <ImageView
            android:id="@+id/ico1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_margin="10dp"
            android:src="@mipmap/v_ico1" />
        <TextView
            android:id="@+id/name1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_toRightOf="@+id/ico1"
            android:text="雪绒花"
            android:textColor="#576B95" />
        <TextView
            android:id="@+id/content1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/name1"
            android:layout_marginBottom="5dp"
            android:layout_marginTop="5dp"
            android:layout_toRightOf="@+id/ico1"
            android:minLines="3"
            android:text="祝我的亲人、朋友们新年快乐！" />
        <TextView
            android:id="@+id/time1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/content1"
            android:layout_marginTop="3dp"
            android:layout_toRightOf="@id/ico1"
            android:text="昨天"
            android:textColor="#9A9A9A" />
        <ImageView
            android:id="@+id/comment1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@id/content1"
            android:src="@mipmap/comment" />
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/line" />
    </RelativeLayout>
    <!-- 分隔线 -->
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@mipmap/line" />
    <!-- 第二条信息 -->

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp" >

        <ImageView
            android:id="@+id/ico2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_margin="10dp"
            android:src="@mipmap/v_ico2" />

        <TextView
            android:id="@+id/name2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_toRightOf="@id/ico2"
            android:text="淡淡的印象"
            android:textColor="#576B95" />

        <TextView
            android:id="@+id/content2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/name2"
            android:layout_marginBottom="5dp"
            android:layout_marginTop="5dp"
            android:layout_toRightOf="@id/ico2"
            android:minLines="3"
            android:text="奋斗就是每一天都很难，可一年比一年容易。不奋斗就是每一天都很容易，可一年比一年难。怕吃苦的人吃苦一辈子，不怕吃苦的人吃苦一阵子。所以拼着一切代价奔你的前程；拼一个春夏秋冬，赢一个无悔人生！" />

        <TextView
            android:id="@+id/time2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/content2"
            android:layout_marginTop="3dp"
            android:layout_toRightOf="@id/ico2"
            android:text="6小时前"
            android:textColor="#9A9A9A" />

        <ImageView
            android:id="@+id/comment2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@id/content2"
            android:src="@mipmap/comment" />
    </RelativeLayout>
    <!-- 分隔线 -->
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@mipmap/line" />

</LinearLayout>