4、使用 Jetpack Compose 创建现代 UI

使用 Jetpack Compose 创建现代 UI

1. 构建基于 Compose 的屏幕

我们要构建一个展示餐厅的应用程序，将使用 Compose 构建 UI，并创建一个新的 Compose 项目。之后构建餐厅列表项，最后显示虚拟的餐厅列表。具体步骤如下：
- 创建第一个 Compose 项目
- 构建餐厅元素布局
- 使用 Compose 显示餐厅列表

2. 创建第一个 Compose 项目

要构建餐厅应用，需创建一个新的基于 Compose 的项目，步骤如下：
1. 打开 Android Studio，选择“New Project”选项。若已打开 Android Studio，可通过“File” -> “New” -> “New Project”进入。
- 注意 ：确保使用 Android Studio 版本 Arctic Fox 2020.3.1 或更新版本。若使用更新版本，生成代码可能会有差异。
2. 在“Phone and tablet template”部分，选择“Empty Compose Activity”，然后点击“Next”。
3. 输入应用程序的详细信息。在“Name”字段输入“Restaurants app”，语言选择 Kotlin 不变，将“Minimum SDK”设置为 API 21，然后点击“Finish”。
- 重要提示 ：接下来的步骤是关键配置步骤，要确保项目使用的依赖版本与后续一致，这样才能顺利查看代码片段和源代码，避免 API 差异。
4. 在新生成的项目中，