Skip to content

XML布局

XML布局文件用于定义应用程序的用户界面,布局文件使用 .xml 作为后缀名,例如 activity_main.xml、fragment_login.xml。

下面列举了XML布局中的一些核心知识点,可以使用这些知识来创建和设计Android应用程序的用户界面。掌握XML布局的概念和用法,能够更好地理解和调整应用程序的界面布局。

根元素

XML布局文件的根元素通常是一个布局容器,用于包含其他视图元素。常见的根元素包括LinearLayout、RelativeLayout、ConstraintLayout等。您可以选择适合您界面需求的布局容器。

xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <!-- ... -->
</androidx.coordinatorlayout.widget.CoordinatorLayout>

视图元素

视图元素代表应用程序界面的各个组件,Android布局文件都由视图元素组成,如按钮、文本框、图像视图等。您可以在布局文件中添加和配置这些视图元素,并定义它们的属性和样式。

下面展示了一个TextViewButton两个视图元素

xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".FirstFragment">

    <TextView
        android:id="@+id/textview_first"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/hello_first_fragment"
        app:layout_constraintBottom_toTopOf="@id/button_first"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button_first"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/next"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/textview_first" />
</androidx.constraintlayout.widget.ConstraintLayout>

布局属性

布局属性用于控制视图元素在布局容器中的样式,如宽度、高度、背景颜色、位置、字体大小等。常见的布局属性包括layout_width、layout_height、layout_margin、layout_gravity、top、bottom、left、right、center_vertical、center_horizontal等。

可以使用这些属性来指定视图元素的尺寸、边距和对齐方式等。

引用资源

在布局文件中,您可以使用@符号引用资源,如字符串、颜色、尺寸等。这使得您可以在布局中使用资源值,并在需要时进行更改和维护。例如,@string/my_string引用字符串资源。

也可以 使用 XML 声明来引用其他布局文件或资源文件,例如在 activity_main.xml 中使用 image 标签引用了 image.png。

复杂布局

  • 布局嵌套:可以在布局文件中嵌套其他布局容器,以实现复杂的布局结构。通过嵌套布局,您可以创建层次化的界面,并更好地组织和管理视图元素。
  • 动态布局:可以使用 ViewPager、RecyclerView 等控件实现动态布局。
  • 自定义视图:可以自定义视图元素,继承 View 类并重写 onMeasure()、onDraw() 方法来实现自己的布局效果。

ID和引用

每个视图元素可以分配一个唯一的ID,以便在代码中引用和操作它们。您可以使用android:id属性为视图元素指定一个ID值,并在代码中使用findViewById()方法来获取对应的视图对象。

样式和主题

样式和主题用于定义和应用视图元素的外观和样式。您可以使用style属性为视图元素指定样式,或使用theme属性为整个应用程序或活动指定主题。

布局编辑器

Android Studio 提供了一个可视化的 XML 布局编辑器,可以方便地创建和编辑 Android 应用程序中的布局文件。

以下是使用 Android Studio 的 XML 布局编辑器的步骤:

  • 打开 Android Studio,并创建一个新的 Android 项目。
  • 在项目结构中选择“app/layout”文件夹,然后在里面创建一个新的布局文件。例如,可以创建一个名为“activity_main.xml”的布局文件。
  • 在 Android Studio 中打开该布局文件,可以看到一个可视化的界面,其中包含了各种视图元素和属性。
  • 在布局文件中添加视图元素,例如文本框、按钮、图片等。可以使用拖拽的方式将视图元素从工具箱中拖到画布上,也可以手动输入视图元素的 ID、名称、类型等属性。
  • 设置视图元素的位置和大小,可以使用约束条件来控制视图元素的位置和大小。例如,可以使用“top”和“bottom”属性来设置视图元素的位置关系,使用“width”和“height”属性来设置视图元素的大小。
  • 保存布局文件并运行应用程序,可以在 Android Studio 中预览应用程序的布局效果。
  • 如果需要自定义布局文件,可以在布局文件中添加自定义视图元素或修改现有视图元素的属性。
  • 在 Android Studio 中生成 R 文件并将其编译为本地代码,以便在应用程序中使用布局文件。

可以找一些官方教学视频配置使用,效率更高