跳到主要内容
版本:0.82

I18nManager

I18nManager 模块提供了用于管理从右到左(RTL)布局支持的工具,适用于阿拉伯语、希伯来语等语言。它提供了控制 RTL 行为以及检查当前布局方向的方法。

示例

根据 RTL 更改位置和动画

如果你将元素绝对定位以与其他 flexbox 元素对齐,它们在 RTL 语言中可能无法对齐。可使用 isRTL 来调整对齐或动画。

开发过程中

参考

属性

isRTL

TypeScript
static isRTL: boolean;

一个布尔值,表示应用当前是否处于 RTL 布局模式。

isRTL 的值由以下逻辑决定:

  • 如果 forceRTLtrue,则 isRTL 返回 true
  • 如果 allowRTLfalse,则 isRTL 返回 false
  • 否则,在以下情况下 isRTL 将为 true
    • iOS:
      • 设备上的用户首选语言是 RTL 语言
      • 应用定义的本地化内容包含用户选择的语言(如 Xcode 项目文件中定义的 knownRegions = (...)
    • Android:
      • 设备上的用户首选语言是 RTL 语言
      • 应用的 AndroidManifest.xml<application> 元素上定义了 android:supportsRTL="true"

doLeftAndRightSwapInRTL

TypeScript
static doLeftAndRightSwapInRTL: boolean;

一个布尔值,表示在 RTL 模式下是否应自动交换 left 和 right 样式属性。启用后,在 RTL 布局中 left 会变成 right,right 会变成 left。

方法

allowRTL()

TypeScript
static allowRTL: (allowRTL: boolean) => void;

启用或禁用应用的 RTL 布局支持。

参数:

  • allowRTL(boolean):是否允许 RTL 布局

重要说明:

  • 更改会在下一次应用启动时生效,而不是立即生效
  • 此设置会在应用重启后持续保留

forceRTL()

TypeScript
static forceRTL: (forced: boolean) => void;

强制应用使用 RTL 布局,而不考虑设备语言设置。这主要用于在开发期间测试 RTL 布局。

避免在生产应用中强制启用 RTL,因为它需要完整的应用重启才能生效,这会带来较差的用户体验。

参数:

  • forced(boolean):是否强制使用 RTL 布局

重要说明:

  • 更改会在下一次应用启动时完全生效,而不是立即生效
  • 该设置会在应用重启后持续保留
  • 仅用于开发和测试。在生产环境中,你应该完全禁止 RTL,或妥善处理它(参见 isRTL

swapLeftAndRightInRTL()

TypeScript
static swapLeftAndRightInRTL: (swapLeftAndRight: boolean) => void;

在 RTL 模式下交换 left 和 right 样式属性。启用后,在 RTL 布局中 left 会变成 right,right 会变成 left。不会影响 isRTL 的值。