设置textAlign:justify的Text组件尾部出现异常空白问题

问题原因 #

这是React Native跨平台文本渲染的已知原生层问题，和iOS、Android两端的原生文本渲染逻辑对两端对齐属性的处理逻辑相关：

• Android端原生TextView处理textAlign: justify时，默认会在段落最后一行的末尾计算并保留剩余行宽的留白，React Native没有对该原生行为做额外裁剪，所以空白幅度更大
• iOS端Core Text的对齐计算也存在类似的段落末尾留白偏差，仅幅度相对更小

可用解决方法 #

1. 零宽字符修复（最简便，适配绝大多数场景） #

在你的长文本末尾主动追加一个零宽空格\u200B，可以让原生渲染层误判最后一行为非段落结束行，跳过多余留白的计算，不会额外占用显示宽度。
代码示例：

<Text style={{ textAlign: "justify" }}>
  {你的长文本内容 + '\u200B'}
</Text>

2. 社区组件替代 #

如果零宽字符方案在你使用的React Native版本中不生效，可以替换为社区维护的自定义文本组件，比如react-native-render-html的内置文本渲染模块、@react-native-community/text，这类组件重写了两端对齐的计算逻辑，从根源规避了原生层的问题。

3. 样式微调（仅适合Android端临时适配） #

如果仅Android端空白过大、不需要严格适配全设备，也可以给Text组件添加小幅负底部margin抵消空白，注意要在不同分辨率设备上测试避免内容被裁剪：

<Text 
  style={{ 
    textAlign: "justify",
    marginBottom: -4 // 可根据实际显示效果调整数值
  }}
>
  你的长文本内容
</Text>

内容的提问来源于stack exchange，提问作者Ariel