Jetpack Compose

Compose 库提供可组合函数、TanreiTheme 和生成的令牌对象。它依赖的是 Compose Foundation，而不是某个 Material 组件库，因此不会给你的应用带进第二套设计系统。

尚未发布

io.github.chnotchy:tanrei 尚未发布到 Maven Central。一个平台在跟上当前的规格之后才会发布，在此之前 Jetpack Compose 的 CI 处于暂停状态。下文“从源码”一节展示如何从 chnotchy/tanrei 添加这个包；“发布之后”一节展示届时的安装方式。

安装

从源码

目前无法构建

Compose 库尚未跟上当前的规格和令牌：它的源码是针对较早版本的生成令牌代码编写的，无法与现在的令牌代码一起编译。在它跟上之前，它的 CI 处于暂停状态，状态页面把它的组件标记为“待跟进”。下面的步骤说明如何把它添加到应用中；等这个库跟上之后，这些步骤就能用了。

把仓库克隆到你的应用旁边，再引入它的 Gradle 构建，这个构建以项目 :tanrei 的形式包含这个库：

// settings.gradle.kts
includeBuild("../tanrei/packages/compose") {
  dependencySubstitution {
    substitute(module("io.github.chnotchy:tanrei")).using(project(":tanrei"))
  }
}

// build.gradle.kts
dependencies {
  implementation("io.github.chnotchy:tanrei")
}

发布之后

// build.gradle.kts
dependencies {
  implementation("io.github.chnotchy:tanrei:<version>")
}

使用

在靠近根部的位置，用 TanreiTheme 把内容包起来一次：

import io.github.chnotchy.tanrei.components.TanreiButton
import io.github.chnotchy.tanrei.theme.TanreiTheme
import io.github.chnotchy.tanrei.tokens.TanreiButtonVariant

@Composable
fun DeployScreen(isDeploying: Boolean, onDeploy: () -> Unit) {
  TanreiTheme {
    TanreiButton(
      text = "部署",
      onClick = onDeploy,
      variant = TanreiButtonVariant.Filled,
      enabled = !isDeploying,
    )
  }
}

Compose 的惯例是使用肯定形式的标志 enabled，Tanrei 也是如此；规格中的 disabled 属性对应它的反值。当需要的不只是文本标签时，可以使用接受 content lambda 的插槽重载。

主题与对比度

TanreiTheme 默认跟随系统的深色主题和系统的对比度设置。两者都可以固定：

TanreiTheme(theme = TanreiThemeMode.Dark, contrast = TanreiContrast.High) {
  App()
}

字体

默认情况下，字阶会解析为平台的默认字体族。要使用应用字体资源中的 Inter（以及 Noto Sans JP、Roboto Mono），请把自己的 TanreiFontFamilies 传给 TanreiTheme。文本样式按层级命名（TanreiTheme.tokens.typescale.heading2、.body、.label；.toTextStyle() 可以把它转换为 Compose 的 TextStyle），TanreiTheme.tokens.typescale.heading1.emphasized() 则是同一样式在其字重上加上标题系列强调级差后的结果（在组合之外使用 emphasized(system.typescale.emphasis)）。

GitHub 上的源码与 Issue