react-native - 在对齐模式下反应原生和阿拉伯文本

Question

我正在尝试制作一个带有阿拉伯文字的屏幕。它基本上是一个大的，包含嵌套在其中的较小组件。（容器就像页面，而较小的部分是需要自己处理 onPress 等的部分）。我想让文本以合理的方式显示，行开始/结束一致。所以我去找父级并添加了这个样式：textContainer：{方向：“rtl”，textAlign：“justify”，}，它工作得很好，除了最后一行，它从左边而不是右边开始。那么，有没有办法告诉 证明 并让最后一行从正确开始？这是它的外观（https://pasteboard.co/JMDRj1e.png），如果您查看它从左侧而不是从右侧开始的最后一行，我认为这是本机反应的一个错误。

Answer 1

您的实现只会对齐第一行。为了对齐阿拉伯语段落/或多行，您可以执行以下操作：

从你的 app.js 中的 react native 导入 I18nManager

import { I18nManager } from "react-native";

然后在导入下方添加此行以允许 RTL

I18nManager.allowRTL(true);

最后你可以添加 writingDirection: "rtl"到阿拉伯文本的样式，它应该以正确的方式对齐

Answer 2

以下对我有用，对于 iOS，我给出了文本样式，并通过在 AppDelegate.m 中导入 #import <React/RCTI18nUtil.h> ，writingDirection: 'rtl'将这两行添加到 didFinishLaunchingWithOptions:

[[RCTI18nUtil sharedInstance] allowRTL:TRUE];
[[RCTI18nUtil sharedInstance] forceRTL:TRUE];

对于 android，您可以参考此处，如何在 React Native 中将 View 的方向属性设置为 RTL。此外，您需要添加transform: [{scaleX: -1}]和flexDirection: row-reverse。