Android常用布局

于 2024-10-11 18:23:37 发布
阅读量1.1k 收藏 29
点赞数 27
分类专栏： Android 文章标签： android 开发语言 android-studio android studio xml java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_76862031/article/details/142856337
版权

目录

布局文件中常见的属性

1. 基本布局属性

1）android:layout_width

2）android:layout_height

3）android:layout_margin

4）android:padding

2. 线性布局 (LinearLayout) 属性

1）android:orientation

2）android:gravity

3）android:layout_weight

4）案例LinearLayout水平布局

1.代码

2.效果

案例:LinearLayout垂直布局

1.代码

2.效果

3. 相对布局 (RelativeLayout) 属性

1）android:layout_alignParentTop/...Bottom/...Left/...Right

2）android:layout_centerInParent

3）android:layout_above/...below/...toLeftOf/...toRightOf

4）android:layout_alignWithParentIfMissing

案例:RelativeLayout相对布局的简单使用

1.代码

2.效果

4. 帧布局 (FrameLayout) 属性

1）android:foreground

2）android:layout_gravity

案例:帧布局的简单使用

1.代码

2.效果

5. 表格布局 (TableLayout) 和表格行 (TableRow) 属性

1）android:collapseColumns

2）android:stretchColumns

案例:表格布局的简单使用

1.代码

2.效果

3.注意

6. 网格布局 (GridLayout) 属性

1）android:rowCount/columnCount

2）android:alignmentMode

3）android:useDefaultMargins

案例:网格布局的简单使用

1.代码

2.效果

7. 其他常用属性

1）android:background

2）android:visibility

3）android:clickable

4）android:focusable

5）android:enabled

6）android:alpha

7）android:id

布局文件中常见的属性

1. 基本布局属性

1）android:layout_width

        设置视图的宽度，可以是具体数值（如 100dp）、match_parent（与父元素一样宽）或 wrap_content（根据内容自动调整宽度）。

2）android:layout_height

        设置视图的高度，选项同上。

3）android:layout_margin

  设置视图外边距，也可以分别设置四个方向的外边距

（android:layout_marginLeft, android:layout_marginTop, android:layout_marginRight, android:layout_marginBottom）。

4）android:padding

  设置视图内边距，同样可以分别设置四个方向的内边距（android:paddingLeft, android:paddingTop, android:paddingRight, android:paddingBottom）。

2. 线性布局 (LinearLayout) 属性

1）android:orientation

        设置子元素的排列方向，值为 vertical 或 horizontal。

2）android:gravity

        设置内容相对于视图的对齐方式。

3）android:layout_weight

        分配剩余空间给子视图的比例权重。

4）案例LinearLayout水平布局

1.代码
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <!--水平布局-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:ignore="MissingConstraints">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="buttonOne"

        />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="buttonTwo"

            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="buttonThree"

            />




    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

2.效果

案例:LinearLayout垂直布局

1.代码
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
    
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        tools:ignore="MissingConstraints">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="One"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Two"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Three"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Four"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Five"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Six"/>
    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

2.效果

3. 相对布局 (RelativeLayout) 属性

1）android:layout_alignParentTop/...Bottom/...Left/...Right

        将视图对齐到父容器的顶部/底部/左边/右边。

2）android:layout_centerInParent

        将视图居中于父容器。

3）android:layout_above/...below/...toLeftOf/...toRightOf

        相对于另一个视图定位。

4）android:layout_alignWithParentIfMissing

        如果指定的兄弟视图不存在，则与父视图对齐。

案例:RelativeLayout相对布局的简单使用

1.代码
<?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">
    <!--相对布局-->
    
    <!--按钮位于左上角-->
    
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="lefTop" 
        
        android:layout_alignParentLeft="true"
        
        />
    
    <!--按钮位于右上角-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="rightTOp"

        android:layout_alignParentRight="true"
        
        
        />
    <!--按钮上中-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topCenter"

        android:layout_centerHorizontal="true"


        />
    <!--按钮左中-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="leftCenter"

        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
       
        />
    
    <!--myCenter上方-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        
        android:layout_above="@+id/myCenter"
        android:layout_centerHorizontal="true"
        android:text="top"
        />
    
    
    <!--按钮居中-->
    <Button
        android:id="@+id/myCenter"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="center"
        
        android:layout_centerInParent="true"
        

        />
    <!--myCenter下方-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:layout_below="@+id/myCenter"
        android:layout_centerHorizontal="true"
        android:text="below"
        />
    
    
    <!--按钮右中-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="rightCenter"

        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"

        />
    <!--按钮在左下脚-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="leftButtom"

        android:layout_alignParentBottom="true"
        
        />
    <!--按钮在有下角-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="rightButtom"
        
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"

        />
    
    <!--按钮下中-->

    <!--按钮左中-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="buttomCenter"

        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"

        />
</RelativeLayout>

2.效果

4. 帧布局 (FrameLayout) 属性

1）android:foreground

设置前景图像。

2）android:layout_gravity

设置视图在其父容器中的位置。

案例:帧布局的简单使用

1.代码
<?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:gravity="center">

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        
        android:layout_gravity="center"
        >
        <Button
            android:layout_width="400dp"
            android:layout_height="400dp"
            android:background="#746232"
            android:layout_gravity="center"
            android:text="20" />
        <Button
            android:layout_width="350dp"
            android:layout_height="350dp"
            android:background="#F6EAF3"
            android:layout_gravity="center"
            android:text="20" />

        <Button
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:background="#F807C4"
            android:layout_gravity="center"
            
            android:text="20" />

        <Button
            android:layout_width="250dp"
            android:layout_height="250dp"
            android:background="#8BB3F0"
            android:layout_gravity="center"
            android:text="20" />


        <Button
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:background="#0AE649"
            android:layout_gravity="center"
            android:text="20" />

        <Button
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:background="#FF9800"
            android:layout_gravity="center"
            android:text="20" />
        
        

        <Button
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:background="#080CE2"
            android:layout_gravity="center"
            android:text="20" />

        <Button
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="#E96FC6"
            android:layout_gravity="center"
            android:text="20" />

        <Button
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:background="#0DD8F4"
            android:layout_gravity="center"
            android:text="20" />

       

    </FrameLayout>

        
</LinearLayout>

2.效果

5. 表格布局 (TableLayout) 和表格行 (TableRow) 属性

1）android:collapseColumns

  指定要折叠的列索引。

2）android:stretchColumns

  指定应伸展以填充可用空间的列索引。

案例:表格布局的简单使用

1.代码
<?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:background="#845612"

    

    >

    <TableRow

        android:background="#145678"
        android:layout_column="4"
        >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮"

            android:layout_column="0"
            />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2"

            android:layout_column="2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3"

            android:layout_column="1"
            />

    </TableRow>

    <TableRow
        android:background="#a45678"
        android:layout_column="3"
        >



        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2"

            android:layout_column="2"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3"

            android:layout_column="1"
            />

    </TableRow>

    <TableRow
        android:background="#645678"
        android:layout_column="3"
        >

        <Button
            android:layout_width="wrap_content"

            android:layout_height="wrap_content"
            android:text="按钮"

            android:layout_column="0"
            />


        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3"

            android:layout_column="1"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3"

            android:layout_column="3"
            />

    </TableRow>

</TableLayout>

2.效果

3.注意

修改主题，Theme.Design.NoActionBar,不然自定义的颜色无法使用

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" >

    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.Design.NoActionBar"
        tools:targetApi="31" >

        <activity
            android:name=".MainActivity"
            android:exported="true" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

6. 网格布局 (GridLayout) 属性

1）android:rowCount/columnCount

定义网格的行数和列数。

2）android:alignmentMode

设置如何对齐单元格内的内容。

3）android:useDefaultMargins

是否使用默认的边距。

案例:网格布局的简单使用

1.代码
<?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"
    tools:context=".MainActivity">

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnCount="3"
        android:rowCount="3"
        android:id="@+id/myGridTable">

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="0"
            android:layout_row="0"
            android:background="#31B6C3"
            android:text="1"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="1"
            android:layout_row="0"
            android:background="#DE117C"
            android:text="2"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="2"
            android:layout_row="0"
            android:background="#08D542"
            android:text="3"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="0"
            android:layout_row="1"
            android:background="#4B07EB"
            android:text="4"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="1"
            android:layout_row="1"
            android:background="#EB07A7"
            android:text="5"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="2"
            android:layout_row="1"
            android:background="#EB7A07"
            android:text="6"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="0"
            android:layout_row="2"
            android:background="#07EB8A"
            android:text="7"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="1"
            android:layout_row="2"
            android:background="#0EFDD9"
            android:text="8"
            android:gravity="center"
            android:layout_weight="1" />

        <TextView
            android:layout_width="125dp"
            android:layout_height="125dp"
            android:layout_column="2"
            android:layout_row="2"
            android:background="#FF0000"
            android:text="9"
            android:gravity="center"
            android:layout_weight="1" />

    </GridLayout>
</RelativeLayout>

2.效果

7. 其他常用属性

1）android:background

设置背景颜色或图片。

2）android:visibility

设置视图的可见性，值可以是 visible, invisible 或 gone。

3）android:clickable

设置视图是否可点击。

4）android:focusable

设置视图是否可以获得焦点。

5）android:enabled

设置视图是否启用。

6）android:alpha

设置视图透明度（0.0完全透明，1.0完全不透明）。

7）android:id

为视图提供一个唯一的标识符。

惜.己
关注
专栏目录
Android页面布局
05-11
android移动开发最常用的几种布局：线性布局、表格布局、相对布局、帧布局，以及布局嵌套。
android常用布局的使用
05-29
在Android开发中，布局（Layout）是构建用户界面的基础元素，它定义了屏幕上控件的排列方式和相互关系。本文将深入探讨Android中常见的几种布局及其使用方法，以帮助开发者更好地构建美观且功能丰富的应用程序。 一...
Android布局
编程资料大全
12-07 114
1.什么是布局 一个Android应用的用户界面是由View和ViewGroup构建的，他们有很多的种类，并且都是View的子类，View类的一些子类被称为“widgets(工具)”，他们提供了诸如文本输入框和按钮之类的UI对象的完整实现。ViewGroup是View的一个扩展，它可以容纳多个字View。ViewGroup类同样可以被扩展用作layout（布局管理器），如LinearLayo...
Android中有哪些布局方式？
最新发布
Dingdangr的博客
10-10 1393
Android提供了多种布局方式，每种布局方式都有其特定的应用场景和特点。在选择布局方式时，需要根据具体的需求和场景进行权衡和选择。同时，也需要注意布局的兼容性和性能问题，确保在不同设备和屏幕尺寸上都能获得良好的用户体验。在实际开发中，可以灵活运用多种布局方式组合使用，以实现更加复杂和美观的用户界面设计。
android 常用布局有哪些
jianjianyuer的专栏
04-28 9244
布局：     在 android 中我们常用的布局方式有这么几种： 1.LinearLayout ( 线性布局 ) ：(里面只可以有一个控件，并且不能设计这个控件的位置，控件会放到左上角)                                            线性布局分为水平线性和垂直线性二者的属性分别为： android:orientation=" horizontal
android界面布局
...
01-15 4653
用来设置布局宽度。用来设置布局高度。以上两个属性在布局管理器中一般设置为match_parent，即与父容器相同。设置底内边距。设置左内边距。设置右内边距。设置顶内边距。以上四个属性可以设置为具体数值，比如16dp；也可以使用尺寸资源进行定义一.相对布局是一个以相对位置显示子视图的视图组。每个视图的位置可以指定为相对于同级元素的位置（例如，在另一个视图的左侧或下方）或相对于父级区域的位置（例如在底部、左侧或中心对齐）。
分享五种Android常用布局方式
09-03
Android布局是应用界面开发的重要一环，在Android中，共有五种布局方式，分别是：FrameLayout（框架布局），LinearLayout （线性布局），AbsoluteLayout（绝对布局），RelativeLayout（相对布局），TableLayout...
android常用布局和参数含义.doc
07-04
本文将详细解释几种常用的布局类型及其相关的参数含义，帮助开发者更好地理解和使用这些布局。 首先，我们来看基本的控制参数： 1. `Android:layout_width` 和 `Android:layout_height` 分别用于指定组件的宽度和...
Android常用布局（FrameLayout、LinearLayout、RelativeLayout）详解
01-04
很多开发者一听说Android终端的屏幕尺寸五花八门，屏幕分辨率千奇百怪，就觉得Android开发在屏幕适配方面是必定是一件头疼的事情...这里想来说说布局，在Android SDK刚刚问世的时候，Android提供了AbsoluteLayout，Fra
Android基础：Android布局
热门推荐
在路上
02-03 1万+
线性布局，LinearLayout, 相对布局，RelativeLayout
android常用的布局
weixin_43340403的博客
04-29 250
常用布局 共有属性： android:layout_width 宽度 android:layout_height 高度 android:layout_padding 内边距 android:layout_margin 外边距 1、LinearLayout线性布局 android:layout_orientation 方向 horizontal 水平（默认） vertical 垂直 ...
Android中的常用布局
weixin_42687829的博客
09-15 362
        布局就是把界面中的控件按照某种规律摆放到指定的位置，主要是为了解决应用程序在不同手机中的显示问题。Android实现布局有两种方式：（1）代码；（2）xml配置文件，都是放在res/layout目录下，注：也可以同时使用xml和代码。 1、线性布局（LinearLayout）：线性布局会将其中的控件一个接一个排列，可以横排也可以竖排。       常用属性：（1）设置排列方向：...
【Android】之【常用布局】
Crazy程序猿
04-13 1017
Android常用布局介绍： 1、线性布局LinearLayout 2、相对布局RelativeLayout 3、绝对布局AbsoluteLayout 4、帧布局FrameLayout 5、表格布局TableLayout 6、网格布局GridLayout 7、约束布局ConstraintLayout
Android 常用布局介绍
陈Sir的博客
08-04 3829
Android 常用布局简单介绍
Android 应用开发 常用布局
abcdefg1289的博客
03-21 488
网格布局默认从左到右，从上到下排列，它先从第一行从左往右放置下级视图，塞满之后另起一行放置其余的下级视图。除了方向之外，线性布局还有权重的概念，指的是线性布局的下级视图各自拥有多大比例的宽和高，通过layout_weight进行设置，一旦设置了这个值，就要求layout_width或layout_height填0dp,哪个值填0dp，下级视图就从对应方向按照权重分割布局。相对布局需要指定参照物，一种是下级视图平级的视图，另一种是该视图的上级视图，也就是它归属的RelativeLayout。
经典——Android 布局
青峰专栏
04-02 685
<br />http://www.eoeandroid.com/forum-viewthread-tid-533-highlight-%E5%B8%83%E5%B1%80.html
Android常用界面布局
10-26
Android常用的界面布局有五种：LinearLayout（线性布局）、RelativeLayout（相对布局）、TableLayout（表格布局）、FrameLayout（框架布局/帧布局）和ConstraintLayout（约束布局）。其中，LinearLayout和RelativeLayout是最常用的两种布局。LinearLayout按照水平或垂直方向排列控件，RelativeLayout则是通过相对位置来排列控件。TableLayout适合用于显示表格数据，FrameLayout适合用于单个控件的布局，而ConstraintLayout则是目前官方推荐的布局，可以通过约束关系来排列控件，适用于复杂的布局需求。在使用这些布局时，需要注意设置控件与布局或其他控件之间的距离，可以使用android:layout_margin和android:padding属性来实现。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值