From 4a070e42538b4cd3f82dcae6356e67d061ec1d03 Mon Sep 17 00:00:00 2001 From: SOR2171 Date: Fri, 9 Oct 2026 16:30:30 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8E=AA=E8=BE=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Learning/第一个KMP应用.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/Learning/第一个KMP应用.md b/Learning/第一个KMP应用.md index fc8ee56..b363413 100644 --- a/Learning/第一个KMP应用.md +++ b/Learning/第一个KMP应用.md @@ -64,13 +64,13 @@ fun App() { #### 结构 -KMP 的 UI 是基于一个又一个“盒子”的，在这里，最外层是一个主题 `MaterialTheme`，在主题内部是一个 `Column`，看它的 `modifier` 参数，这里有一个 `fillMaxSize`，表明这个盒子会占据整个窗口。在一个 Column 中，内部的所有组件都会纵向排列。 +KMP 的 UI 是基于一个又一个“盒子”的，在这里，最外层是一个配色主题 `MaterialTheme`，在主题内部是一个 `Column`，看它的 `modifier` 参数，这里有一个 `fillMaxSize()`，表明这个盒子会占据整个窗口。在一个 Column 中，内部的所有组件都会纵向排列。 -Column 内部，有一个 `Button`，还有一个被 `AnimatedVisibility` 框起来的 Column，这里我们先不管 AnimatedVisibility 所实现的动画效果，我们看排版结构。前文提到，在 Column 内部，也就是它的 lambda 里面，所有的组件会纵向排列，也就是说 Button 和内层 Column 会在窗口中一个在上一个在下。 +Column 内部，有一个 `Button`，还有一个被 `AnimatedVisibility` 框起来的 Column，这里我们先不管 AnimatedVisibility 所实现的动画效果，我们看排版结构。前文提到，在 Column 内部，也就是它的 lambda 里面，所有的组件会纵向排列，也就是说 Button 和内层 Column 在窗口中将一个在上一个在下。 #### 图片资源 -内层的 Column 又包含了两个组件，一个是图片，一个是文本。这里有一个东西叫图片资源，它们的源文件放在 `commonMain/composeResources/drawable` 中，放在这里的图片会自动被 gradle 注册在一个 object `Res.drawable` 之中，变量名就是它们的文件名。这是 KMP 中最好的调用图片方式。 +内层的 Column 又包含了两个组件，一个是图片，一个是文本。这里有一个东西叫图片资源，它们的源文件放在 `commonMain/composeResources/drawable` 中，放在这里的图片会自动被 gradle 注册在一个 object `Res.drawable` 之中，变量名就是它们的文件名。这是 KMP 中最好的调用图片方式。推荐使用“小写字母下划线”的命名方法。 ### 基本的逻辑处理思路 @@ -82,8 +82,8 @@ Column 内部，有一个 `Button`，还有一个被 `AnimatedVisibility` 框起 // 一些排版 - // 这里使用一个 lambda 将 showContent 的值反转 - Button(onClick = { showContent = !showContent }) + // 这里使用一个 lambda 将 showContent 的值反转，这个函数只有 Mutable State 能用 + Button(onClick = { showContent.toggle() }) ``` 因为变量 showContent 是函数 AnimatedVisibility 的参数之一，因此，当它的值发生变化时，该函数会被重载，随后触发动画效果，其中的 Column 就会出现 / 消失。