全局配置

介绍

TuniaoUI 组件库提供全局配置方法，供开发者根据项目实际情况选择合适的尺寸单位。

使用方法

TIP

请在初始化组件库之后调用。

import { TnUIInitializer } from "@tuniao/tn-ui";

onWindowStageCreate(windowStage: window.WindowStage): void {
  // 初始化组件库
  TnUIInitializer.initTnUI(windowStage, this.context);

  // 设置全局配置（可选）
  TnUIInitializer.setGlobalConfig({
    unit: "lpx",
    fontUnit: "lpx",
    fontNames: ["myCustomFont"],
  });
}

TnGlobalConfigType 数据类型

TIP

该类型为 setGlobalConfig 方法的参数类型，后续还会加入更多属性配置。

参数	说明	类型	默认值
designWidth	页面设计基准宽度	number	720
unit	全局尺寸单位，可选值 vp、px、lpx	string	vp
fontUnit	全局字体单位，可选值 vp、px、lpx、fp	string	fp
fontNames	应用注册的自定义字体名称，支持多个。配置后可在包含图标的组件上使用自定义图标	ResourceStr[]	[]

具体表现

TIP

• 文档中未注明单位的尺寸都默认为 setGlobalConfig 方法设置的单位
• 全局单位仅会影响组件库中传递的 number 类型参数的尺寸数值
• 以下示例中，btnWidth 会自动拼接全局单位转化为 20vp，btnHeight 为字符串保持不变

import { TnButton } from "@tuniao/tn-ui";

@ComponentV2
struct ButtonPage {
  build() {
    TnButton({
      btnWidth: 20,        // 自动拼接单位 → 20vp
      btnHeight: "30vp",   // 字符串保持不变
      content: "按钮",
    })
  }
}

注册自定义字体

如需注册自定义字体图标，先通过 registerFont 注册字体，再在全局配置中声明字体名称：

onWindowStageCreate(windowStage: window.WindowStage): void {
  TnUIInitializer.initTnUI(windowStage, this.context);

  // 注册自定义字体
  windowStage.getMainWindowSync().getUIContext().getFont().registerFont({
    familyName: "myIconFont",
    familySrc: $rawfile("my_icon_font.ttf"),
  });

  // 在全局配置中声明
  TnUIInitializer.setGlobalConfig({
    fontNames: ["myIconFont"],
  });
}