Android五种布局

提示：新手请勿喷，谢谢
  
  

---

媒介

提示：这里可以添加本文要记录的大概内容：
在Android开辟中，布局是构建用户界面的底子。差别的布局方式实用于差别的场景，选择符合的布局可以极大地提高开辟效率和用户体验。本文将具体介绍线性布局、束缚布局、表格布局、帧布局和相对布局的特点、实用场景以及在现实项目中的应用方法。

提示：以下是本篇文章正文内容，下面案例可供参考
一、线性布局（LinearLayout）

特点

1.线性布局主要以水平或垂直方式去显示界面中的控件。留意：子控件之间不能重叠，可以设置权重。
2.通过设置LinearLayout的orientation属性，可以指定布局的排列方式。如果orientation属性设置为"horizontal"，则子视图水平排列（显示顺序依次从左到右）；如果orientation属性设置为"vertical"，则子视图垂直排列（显示顺序依次从上到下）。
实用场景

当需要简朴、直观地排列控件时，线性布局是一个很好的选择。比方，登录界面中的用户名和密码输入框以及登录按钮就可以使用线性布局来实现。
二、实例

1.水平方向排列

代码如下（示例）：

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3.     xmlns:app="http://schemas.android.com/apk/res-auto"
4.     xmlns:tools="http://schemas.android.com/tools"
5.     android:layout_width="match_parent"
6.     android:layout_height="match_parent"
7.     tools:context=".MainActivity"
8.     android:orientation="horizontal">
10.     <EditText
11.         android:id="@+id/username"
12.         android:layout_width="109dp"
13.         android:layout_height="88dp"
14.         android:hint="Username" />
16.     <EditText
17.         android:id="@+id/password"
18.         android:layout_width="wrap_content"
19.         android:layout_height="90dp"
20.         android:hint="Password"
21.         android:inputType="textPassword" />
23.     <Button
24.         android:id="@+id/loginButton"
25.         android:layout_width="112dp" // 注意这是所分配的权重，只有在linearlayout中，该属性才有效；
26.         android:layout_height="88dp"
27.         android:text="Login" />
29. </LinearLayout>

复制代码

当androidrientation="horizontal"时，三个组件是呈现水平方向排列
结果图如下（实例）：

2.垂直方向排列

代码如下（示例）：

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3.     xmlns:app="http://schemas.android.com/apk/res-auto"
4.     xmlns:tools="http://schemas.android.com/tools"
5.     android:layout_width="match_parent"
6.     android:layout_height="match_parent"
7.     tools:context=".MainActivity"
8.     android:orientation="vertical">
10.     <EditText
11.         android:id="@+id/username"
12.         android:layout_width="109dp"
13.         android:layout_height="88dp"
14.         android:hint="Username" />
16.     <EditText
17.         android:id="@+id/password"
18.         android:layout_width="wrap_content"
19.         android:layout_height="90dp"
20.         android:hint="Password"
21.         android:inputType="textPassword" />
23.     <Button
24.         android:id="@+id/loginButton"
25.         android:layout_width="112dp"
26.         android:layout_height="88dp"
27.         android:text="Login" />
29. </LinearLayout>

复制代码

当androidrientation="vertical"时，三个组件是呈现垂直方向排列
结果图如下（实例）：

二、束缚布局（ConstraintLayout）

特点

1.束缚布局是一种灵活且功能强大的布局方式，它允许我们通过设置束缚条件来确定子视图的位置和大小。
2.可以创建复杂的布局而不需要嵌套其他布局，从而提高性能。
3.ConstraintLayout布局中的控件可以在横向和纵向上以添加束缚关系的方式举行相对定位，此中，横向边包括Left、Start、Right、End，纵向边包括Top、Buttom、Baseline（文本底部的基准线）。

实用场景

当需要创建复杂的用户界面时，束缚布局是一个很好的选择。比方，一个包罗多个表单字段和个人资料图片的用户注册表单可以使用束缚布局来实现。
二、实例

代码如下（示例）：

1. <androidx.constraintlayout.widget.ConstraintLayout
2.     xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent">
6.     <ImageView
7.         android:id="@+id/profilePicture"
8.         android:layout_width="100dp"
9.         android:layout_height="100dp"
10.         android:src="@drawable/ic_launcher_background"
11.         app:layout_constraintTop_toTopOf="parent"
12.         app:layout_constraintStart_toStartOf="parent"
13.         app:layout_constraintEnd_toEndOf="parent"/>
15.     <EditText
16.         android:id="@+id/username"
17.         android:layout_width="0dp"
18.         android:layout_height="wrap_content"
19.         android:hint="Username"
20.         app:layout_constraintTop_toBottomOf="@id/profilePicture"
21.         app:layout_constraintStart_toStartOf="parent"
22.         app:layout_constraintEnd_toEndOf="parent"/>
24.     <!-- 更多控件... -->
25. </androidx.constraintlayout.widget.ConstraintLayout>

复制代码

结果图如下（实例）：

三、表格布局（TableLayout）

特点

1.表格布局允许我们以行和列的情势来组织子视图。
2.每一行可以包罗一个或多个单位格，每个单位格可以包罗一个控件。
3.TableRow：表示表格中的一行。每向TableLayout添加一个TableRow，就增加了一个表格行。TableRow也是容器，可以不断地添加其他组件，每添加一个子组件，该表格就增加一列。
4.其他组件：如果直接向TableLayout中添加组件（而不是添加到TableRow中），那么这个组件将直接占用一行。

实用场景

当需要创建类似电子表格的布局时，表格布局是一个很好的选择。比方，一个简朴的计算器界面可以使用表格布局来实现。
二、实例

代码如下（示例）：

1. <TableLayout
2.     xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent">
6.     <TableRow>//当向TableLayout中添加组件时，如果希望这些组件出现在同一行中，则必须将它们放在TableRow中。
7.         <Button android:text="7"/>
8.         <Button android:text="8"/>
9.         <Button android:text="9"/>
10.     </TableRow>
11.     <TableRow>
12.         <Button android:text="4"/>
13.         <Button android:text="5"/>
14.         <Button android:text="6"/>
15.     </TableRow>
16.     <!-- 更多行... -->
17. </TableLayout>

复制代码

结果图如下（实例）：

四、帧布局（FrameLayout）

特点

1.帧布局是一种简朴的布局方式，它允许我们将多个控件堆叠在一起，后添加的视图会覆盖在前面添加的视图之上（以是需要留意子视图的添加顺序。如果需要显示某个元素，应确保它是最后添加的。）。
2.帧布局没有复杂的定位方式，相对简朴且轻量，实用于快速布局。
3.留意：由于帧布局（FrameLayout）没有方便的定位方式，如果布局过于复杂，大概会导致代码难以维护。因此，在现实开辟中，应根据需求选择符合的布局方式。

实用场景

当需要在屏幕上放置浮动按钮或其他覆盖物时，帧布局是一个很好的选择。比方，一个带有浮动操作按钮的地图应用可以使用帧布局来实现。
二、实例

代码如下（示例）：

1. <FrameLayout
2.     xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent">
6.     <ImageView
7.         android:layout_width="match_parent"
8.         android:layout_height="match_parent"
9.         android:src="@drawable/map"/>
11.     <Button
12.         android:layout_width="wrap_content"
13.         android:layout_height="wrap_content"
14.         android:text="Fab"
15.         android:layout_gravity="bottom|end"/>
16. </FrameLayout>

复制代码

结果图如下（实例）：

五、相对布局（RelativeLayout）

特点

1.相对布局允许开辟者通过定位子视图相对于父视图或其他子视图的位置来举行布局。在相对布局中，子视图的位置是相对于其他视图或父布局来确定的。
2.可以设置相对于父视图或兄弟视图的位置关系。
3.相对布局灵活性高，提供了多种属性来控制子视图的位置。
4.相对布局顺应性强，可以根据子视图之间的相对关系举行自动调整，实用于差别屏幕尺寸和方向的适配。
5.相对布局方式多样，除了根本的定位属性外，相对布局还支持子视图的层叠结果、隐蔽和显示控制等高级功能。

实用场景

当需要根据其他控件的位置来定位子视图时，相对布局是一个很好的选择。比方，一个包罗文本视图和按钮的简朴界面可以使用相对布局来实现。
二、实例

代码如下（示例）：

1. <RelativeLayout  //相对布局虽然灵活，但过度嵌套可能会导致布局复杂且难以维护。因此，在设计布局时，应尽量简化结构，避免不必要的嵌套。
2.     xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent">
6.     <TextView
7.         android:id="@+id/label"
8.         android:layout_width="wrap_content"
9.         android:layout_height="wrap_content"
10.         android:text="Label"/>
12.     <EditText
13.         android:id="@+id/input"
14.         android:layout_width="match_parent"
15.         android:layout_height="wrap_content"
16.         android:layout_below="@id/label"/>
17. </RelativeLayout>

复制代码

结果图如下（实例）：

六、五个布局总结

Android的五大布局各有特色，广泛应用于差别的UI计划场景：
1.线性布局（LinearLayout）：

以水平或垂直方式排列子视图，简朴直观，得当构建底子界面。
2.束缚布局（ConstraintLayout）：

通过束缚条件定义视图关系，灵活且强大，实用于复杂和自顺应布局，能显著提升渲染性能。
3.表格布局（TableLayout）：

以行列情势组织视图，得当展示具有明显行列布局的数据，如报表和成绩列表。
4.帧布局（FrameLayout）：

子视图层叠显示，后添加的视图覆盖先添加的，实用于对话框和菜单等场景。
5.相对布局（RelativeLayout）：

允许视图按相对位置或屏幕边沿排列，灵活构建复杂界面，控件间的相对位置关系易于实现。
这些布局方式各有优缺点，开辟者需根据具体需求选择符合的布局来构建用户界面。
课程总结

在课程中，我学习了多种UI界面交互功能的实现方法，包括按钮点击事件、列表项点击事件、滑动操作、菜单项和对话框等。通过现实案例的学习，我把握了这些功能的实现本领。比方，通过为按钮设置OnClickListener，可以实现按钮点击事件的相应；通过为列表视图设置OnItemClickListener，可以实现列表项点击事件的相应。别的，我还学会了如何使用SwipeRefreshLayout实现滑动革新功能，以及如何创建和使用菜单项和对话框。
为了提高我的技能水平，我采取了以下步调：起首，我查阅了大量的官方文档和教程，深入相识了各个UI组件的使用方法和最佳实践。其次，我积极参与讨论，向同学和老师请教问题，分享自己的履历和心得。最后，我不断举行实战练习，通过完成项目任务来巩固所学知识。
通过这些努力，我不仅提高了对安卓开辟中各种布局的熟练水平，还增强了办理现实问题的能力。我相信，在未来的开辟过程中，这些知识和技能将资助我更好地应对各种挑战，创造出更加良好的应用步伐。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。