跳到主要内容

I18nManager

I18nManager 模块提供了用于管理 Arabic、Hebrew 等语言的从右到左（RTL）布局支持的实用工具。它提供了控制 RTL 行为以及检查当前布局方向的方法。

示例​

根据 RTL 更改位置和动画​

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

开发期间​

参考

属性​

isRTL​

TypeScript
static isRTL: boolean;

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

isRTL 的值由以下逻辑决定：

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

doLeftAndRightSwapInRTL​

TypeScript
static doLeftAndRightSwapInRTL: boolean;

一个布尔值，表示处于 RTL 模式时是否应自动交换左右样式属性。启用后，在 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，或以适当方式处理 RTL（请参阅 isRTL）

swapLeftAndRightInRTL()​

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

在 RTL 模式下交换左右样式属性。启用后，在 RTL 布局中，left 会变为 right，right 会变为 left。不影响 isRTL 的值。