跳到主要内容

TMA 设计指南

信息

6.10 版本开始,Telegram 更新了小程序的配色方案:修正了一些旧的配色,同时添加了新的配色。

为了更好地理解背景,让我们回顾一下更新历史。

更新日志。

  1. bg_colorsecondary_bg_color 已更新。

原因是:

• 最初,这些颜色是为页面背景而不是UI控制项设计的。

• 因此,为了保持一致性,这些颜色已经被更新。

• 为了给不同部分和卡片着色,添加了 section_bg_color

为了提高应用程序的外观,您应该稍微调整颜色变量的使用。

上述是一个清晰的例子,准确解释了iOS上会发生什么变化。在Android上不应有任何变化。

新颜色。 此外,还增加了许多新颜色。它们中的大多数在Android上最为明显。因此,下面的示例将基于Android展示,但适用于所有平台。

  1. 对于小程序,现在可以使用Telegram header的颜色。

  1. 变得可用的token accent_text_color,适用于应用程序中的任何强调元素。之前,大家都使用不太合适的 link_color

  1. 对于所有次要cell标签,现在最好使用 subtitle_text_color。这将提供更高对比度的标签,提高应用程序的可访问性。

  1. 对于卡片的节的header,现在有了专用的token:section_header_text_color

  1. 对于按下会导致破坏性行动的cell,现在可以使用 destructive_text_color 而不是自定义颜色。



  1. 一个合理的问题是:现在应该如何使用 link_colorhint_color

我建议将它们用作部分下方的提示部分的颜色,以及 secondary_bg_color 这类背景的链接颜色。

参阅