使用自定义字体时，日文文本在 IOS 上不是垂直居中答案

【问题标题】：Japanese text not vertical center on IOS when using custom font使用自定义字体时，日文文本在 IOS 上不是垂直居中
【发布时间】：2019-08-01 08:06:36
【问题描述】：

我遇到了在 IOS 上将日文文本垂直居中的问题。每当我在 IOS 上的 Language and Region 设置中将日语添加到 PREFERRED LANGUAGE ORDER 列表时，

日文文本将高于中心并且只有日文，而不是英文文本。一切都在 Android 上完美运行。我正在使用自定义字体更具体。有人知道如何解决这个问题吗？

Japanese text (IOS)

English text (IOS)

Japanese text (Android)

编辑：

我用来居中文本的代码：

flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center'

【问题讨论】：

在您的情况下，您需要使用 iOS 特定的样式表来设置按钮布局的样式。你能展示你使用的样式表吗？并尝试vertical-align: baseline;
@Raptor 我已经更新了我使用的样式表。 vertical-align: baseline 是否在本机反应，因为我找不到与此相关的任何文档
见this demo。基本上 React Native 可以通过将其更改为驼峰式来使用所有可用的 CSS。不过，我没有使用任何自定义字体。
@Raptor 这可能是因为自定义字体。当我注释掉 fontFamily 时，它工作正常。我也收到了verticalAlign is not a valid style property
好的。可能alignItems 属性包含verticalAlign 函数。见similar question

【解决方案1】：

Android 有 prop includeFontPadding，默认值 = false，所以这个问题在 Android 上不会发生。

Anw，要在 iOS 上解决这个问题，你可以使用 Font Tool for XCode 来编辑你的字体，请阅读这篇文章了解更多详情：

【讨论】：

【解决方案2】：

简单的解决方案：

使用TextInput 代替Text 也添加props editable={false}

例子：

<TextInput style={{styles.yourStyle}} editable={false}>
  Your Japanese or whatever text goes here...
</TextInput>

【讨论】：