Android之四大布局 (四)

最新推荐文章于 2022-09-09 17:05:08 发布

原创最新推荐文章于 2022-09-09 17:05:08 发布 · 212 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Android之四大布局 (四)

Android 专栏收录该内容

128 篇文章

订阅专栏

本文深入解析了Android开发中常用的四种布局：LinearLayout、RelativeLayout、FrameLayout和TableLayout的使用方法及特性，通过具体XML代码示例展示了如何创建垂直、水平布局，相对定位，帧布局和表格布局。

Android之四大布局 (四)

LinearLayou

在这里插入图片描述

<?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:orientation="vertical">

    <LinearLayout
        android:orientation="vertical"
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:layout_height="0dp">

        <TextView
            android:background="#f00"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp">
        </TextView>

        <TextView
            android:background="#0f0"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp">
        </TextView>

    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:layout_height="0dp">

        <TextView
            android:background="#00f"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent">
        </TextView>

        <TextView
            android:background="#f0f"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent">
        </TextView>

    </LinearLayout>

</LinearLayout>

RelativeLayout

在这里插入图片描述

<?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">


    <TextView
        android:layout_centerInParent="true"
        android:background="#f00"
        android:layout_width="100dp"
        android:layout_height="100dp">
    </TextView>

    <TextView
        android:id="@+id/green"
        android:layout_centerHorizontal="true"
        android:background="#0f0"
        android:layout_width="100dp"
        android:layout_height="100dp">
    </TextView>

    <TextView
        android:layout_centerVertical="true"
        android:background="#00f"
        android:layout_width="100dp"
        android:layout_height="100dp">
    </TextView>

    <TextView
        android:background="#f0f"
        android:layout_width="100dp"
        android:layout_height="100dp">
    </TextView>

    <TextView
        android:layout_marginLeft="250dp"
        android:layout_marginTop="60dp"
        android:layout_below="@id/green"
        android:background="#789"
        android:layout_width="100dp"
        android:layout_height="100dp">
    </TextView>

</RelativeLayout>

FrameLayout

按帧显示,可重叠覆盖

注意看控件的高度,存在控件之间的覆盖
在这里插入图片描述

<?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">


    <TextView
        android:background="#f00"
        android:layout_width="match_parent"
        android:layout_height="500dp">
    </TextView>

    <TextView
        android:background="#0f0"
        android:layout_width="match_parent"
        android:layout_height="400dp">
    </TextView>

    <TextView
        android:background="#00f"
        android:layout_width="match_parent"
        android:layout_height="300dp">
    </TextView>
    
    <TextView
        android:background="#f0f"
        android:layout_width="match_parent"
        android:layout_height="200dp">
    </TextView>
</FrameLayout>

TableLayout

在这里插入图片描述

<?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">

    <TableRow android:padding="5dp">
        <TextView
            android:layout_margin="5dp"
            android:background="#f00"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>
        <TextView
            android:layout_margin="5dp"
            android:background="#ff0"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>
        <TextView
            android:layout_margin="5dp"
            android:background="#f0f"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>

    </TableRow>


    <TableRow android:padding="5dp">
        <TextView
            android:layout_margin="5dp"
            android:background="#f85"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>

        <TextView
            android:layout_margin="5dp"
            android:background="#00f"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>
        <TextView
            android:layout_margin="5dp"
            android:background="#993"
            android:layout_width="100dp"
            android:layout_height="100dp">
        </TextView>
    </TableRow>



</TableLayout>