MediumTopAppBar Material3 меняет только большой заголовок

Question

Я работаю с MediumTopAppBar и пытаюсь изменить textStyle большого заголовка, не испортив маленький заголовок.

Итак, что я делаю:

      MediumTopAppBar(
                title = { HeadlineLargeBlackText(text = "pageTitle") },
                navigationIcon = {
                    IconButton(onClick = { onBackPressed.invoke() }) {
                        Icon(
                            imageVector = Icons.Filled.ArrowBack,
                            contentDescription = stringResource(id = R.string.action_back)
                        )
                    }
                },
                scrollBehavior = scrollBehavior
            )

Моя проблема в том, что когда я устанавливаю для него значение «HeadlineLargeBlackText», он автоматически меняет стиль текста как для большого, так и для маленького текста, поэтому он выглядит так (изображение, сделанное с видимым как большим, так и маленьким текстом):

Я хочу, чтобы низ был большим, а верх маленьким.

Когда я захожу в MediumTopAppBar, я вижу, что textStyle большого и маленького задается в TwoRowsTopAppBar как:

         titleTextStyle = MaterialTheme.typography.fromToken(TopAppBarMediumTokens.HeadlineFont),
    smallTitleTextStyle = MaterialTheme.typography.fromToken(TopAppBarSmallTokens.HeadlineFont),

Но этот метод является приватным :// Итак, интересно, можно ли как-то получить доступ к этим большим/маленьким текстам отдельно?

Answer 1

В настоящее времяиспользуетtitleLargeиheadlineSmallстили текста, определенные атрибутом типографики в вашей теме.

Вы можете определить их в теме с помощью:

      val customTypography = androidx.compose.material3.Typography(
    titleLarge = TextStyle(
        fontWeight = FontWeight.SemiBold,
        fontSize = 22. sp,
        lineHeight = 28. sp,
        letterSpacing = 0. sp
    ),
    headlineSmall = TextStyle(
        fontWeight = FontWeight.SemiBold,
        fontSize = 16. sp,
        lineHeight = 24. sp,
        letterSpacing = 0.15.sp
    ),
)

Если вы не хотите применять их ко всему приложению, вы можете применить пользовательскую тему только кMediumTopAppBarс чем-то вроде:

        Scaffold(
        modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
        topBar = {

            AppTheme {
                MediumTopAppBar(
                    title = {
                        androidx.compose.material3.Text(
                            "Medium TopAppBar",
                            maxLines = 1,
                            overflow = TextOverflow.Ellipsis
                        )
                    },
                    //....
                )
            },
            //....  
  }

где

      fun AppTheme(
    useDarkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable() () -> Unit
) {
    //...
    aMaterialTheme(
        colorScheme = colors,
        typography = customTypography,
        content = content
    )
}