Skip to content

主题参数

该组件包含 Telegram 应用程序当前使用的 主题 信息。

初始化

要初始化组件,请使用 initThemeParams 函数:

typescript
import { initThemeParams } from '@telegram-apps/sdk';

const [themeParams] = initThemeParams();

索取实际数据

要获取实际的主题参数信息,开发人员可以使用 requestThemeParams 函数:

typescript
import { requestThemeParams } from '@telegram-apps/sdk';

requestThemeParams.then(console.log);

// Output:
// { bgColor: '#ffaabb', ... }

颜色

开发人员可以使用 get 方法获取主题颜色:

typescript
themeParams.get('bgColor');
themeParams.get('packageUnknownColor');

要通过一个对象获取所有颜色,请使用 getState 方法:

typescript
themeParams.getState();
// Output:
// {
//   accentTextColor: '#aa1399',
//   bgColor: '#baac12',
//   linkColor: '#887722'
//   packageUnknownColor: '#676767,
// }

ThemeParams 组件可直接访问颜色列表:

  • accentTextColor: RGB | undefined
  • bgColor: RGB | undefined
  • buttonColor: RGB | undefined
  • buttonTextColor: RGB | undefined
  • destructiveTextColor: RGB | undefined
  • headerBgColor: RGB | undefined
  • hintColor: RGB | undefined
  • linkColor: RGB | undefined
  • secondaryBgColor: RGB | undefined
  • sectionBgColor: RGB | undefined
  • sectionHeaderTextColor: RGB | undefined
  • subtitleTextColor: RGB | undefined
  • textColor: RGB | undefined

例如

typescript
themeParams.accentTextColor; // '#aa1399'

事件

可被 跟踪 的事件列表:

事件监听器触发条件
change() => void组件中的某些部分发生了变化
change:{theme_key}(value: RGB) => void更改指定键的颜色

Released under the MIT License.