为什么我的 JetPack 撰写文本这么大（材料设计）

Question

我正在练习 Jetpack 组合，通过制作一个具有多个目的地（屏幕）的简单应用程序，我碰巧正在为一个目的地引用一个Android Developer codelab 。 但最终的外观与 codelab 的非常不同，最值得注意的是 fonts 在我的代码中比在 codelab 中的要大得多，即使我使用相同的字体样式 h3，并且我已经尽可能多地尝试使用与代码实验室中使用的相同或更新的依赖关系。

这就是我的意思。

Android 开发者外观；

我的代码看起来像；

这是 Android 开发人员编写代码；

@Composable
fun FavoriteCollectionCard(
    @StringRes text: Int,
    @DrawableRes drawable: Int,
    modifier: Modifier = Modifier
) {
    Surface(
        shape = MaterialTheme.shapes.small,
        modifier = modifier
    ) {
        Row(
            verticalAlignment = Alignment.CenterVertically,
            modifier = Modifier
                .width(192.dp)
        ) {
            Image(
                painter = painterResource(drawable),
                contentDescription = null,
                contentScale = ContentScale.Crop,
                modifier = Modifier
                    .size(56.dp)
            )
            Text(
                text = stringResource(text),
                style = MaterialTheme.typography.h3,
                modifier = Modifier.padding(horizontal = 16.dp)
            )
        }

    }
}

这是 Android 开发人员编写代码；

@Composable
fun DashBoardCard(
    @StringRes text: Int,
    @DrawableRes drawable: Int,
    modifier: Modifier = Modifier
) {
    Surface(
        shape = MaterialTheme.shapes.small,
        modifier = modifier
    ) {
        Row(
            verticalAlignment = Alignment.CenterVertically,
            modifier = Modifier
                .width(192.dp)
        ) {
            Image(
                painter = painterResource(drawable),
                contentDescription = null,
                contentScale = ContentScale.Crop,
                modifier = Modifier
                    .size(56.dp)
            )
            Text(
                text = stringResource(text),
                style = MaterialTheme.typography.h3,
                modifier = Modifier.padding(horizontal = 16.dp)
            )
        }

    }
}

正如我在尝试使依赖项相同或更新之前所说的那样，我不希望这个问题不再是巴克的，但我只是要添加一些依赖项，请无论您需要什么，我很乐意提供.

Android 开发者 Codelab 依赖；

ext {
        compose_version = '1.2.0-alpha05'
    }

plugins {
    id 'com.android.application' version '7.2.0' apply false
    id 'com.android.library' version '7.2.0' apply false
    id 'org.jetbrains.kotlin.android' version '1.6.10' apply false
    id 'com.diffplug.spotless' version '6.3.0'
}

我的依赖；

ext {
        compose_version = '1.2.0-alpha05'
        nav_version = "2.5.1"
    }

plugins {
    id 'com.android.application' version '7.2.1' apply false
    id 'com.android.library' version '7.2.1' apply false
    id 'org.jetbrains.kotlin.android' version '1.6.10' apply false
}

编辑; 我将不胜感激任何类型的帮助、指点、更正，无论您能提供什么帮助，我都会非常感激。

非常感谢您的帮助，提前。

Answer 1

您是否使用与它们相同的 MaterialTheme 实现，并且您是否将屏幕包裹在其中？ 他们的实现在这里， h3 在这里定义如下：

h3 = TextStyle(
    fontWeight = FontWeight.Bold,
    fontSize = 14.sp,
    letterSpacing = 0.sp
)

你的图像绝对不像 14sp，它看起来也像不同的颜色，所以我猜你完全错过了主题。