Android UI设计的FrameLayout与TableLayout布局

最新推荐文章于 2022-03-14 22:54:41 发布

danfengw

最新推荐文章于 2022-03-14 22:54:41 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： Android UI基本控件的使用

本文链接：https://blog.youkuaiyun.com/danfengw/article/details/47776401

Android UI基本控件的使用专栏收录该内容

30 篇文章

订阅专栏

本文介绍了Android UI设计中的FrameLayout和TableLayout。FrameLayout主要用于fragment，其visibility属性包括visible、invisible和gone。TableLayout则需要指定Table Row和Column，并提供了stretchColumns、shrinkColumns和collapseColumns属性来调整布局，以及layout_span属性来设置行数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

FrameLayout

帧布局在fragment中必须使用时才会使用，一般不使用
属性
visibility：
visible：显示
invisible：不显示但是占用空间
gone：不显示也不占用，相当于没有
该属性在Android的所有布局中通用，其他属性的使用与线性布局相似。

<?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">
    <Button
        android:layout_width="240dp"
        android:layout_height="240dp"
        android:text="Button1"
        android:visibility="visible"
        android:background="#ff0000"
        />
    <Button
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:text="Button2"
        android:visibility="invisible"
        android:background="#0fff00"
        />
    <Button
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:text="Button3"
        android:visibility="gone"
        android:layout_marginBottom="15dp"
        android:background="#00fff00"
        />
    <Button
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:text="Button3"
        android:visibility="visible"
       android:layout_marginLeft="20dp"
        android:layout_marginTop="20dp"
        android:background="#f0ff00"
        />
</FrameLayout>

使用visible
这里写图片描述
使用invisible

TableLayout

TableLayout中每写一行或一列都要写相应的Table Row()或是Table Columns()
属性
stretchColumns:空白填充
shrinkColumns：设置行不被挤出屏幕
collapseColumns：隐藏列
Layout_span:设置某行的行数

<?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="1"
    android:shrinkColumns="1"
   >
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button22222222222222222222222222222"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
</TableLayout>

未使用stretchColumns
这里写图片描述
使用stretchColumns（空白填充）

使用collapseColumns（隐藏列）

使用shrinkColumns（保证其他组件不被挤出屏幕）

layout_span的使用

<?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>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_span="2"
            android:text="Button22222222222222222222222222222"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"
            />
    </TableRow>
</TableLayout>

这里写图片描述