React Native全屏编辑中TextInput颜色问题

Question

在我的React Native Android应用中，这是相同的文本框在纵向和横向视图中。我使用selectionColor和underlineColorAndroid属性来设置字体颜色。

<TextInput selectionColor={FormElements.textInputSelectionColor} underlineColorAndroid={FormElements.textInputSelectionColor} placeholder={"Email Address"} placeholderTextColor={FormElements.textInputPlaceholderColor} keyboardType="email-address" value={this.props.email}/>

但问题在于全屏编辑（横向模式）在白色背景下很难阅读。因此，我希望将全屏编辑的背景颜色或文本颜色更改为黑色。我已经尝试过，但还没有找到解决方案。请问有人能给我一个解决方案吗？这个全屏弹出框不仅在横向模式下出现，只要键盘无法占用足够的空间时就会出现。

- Lakshitha Ruwan

Answer 1

我也遇到了这个问题。经过几个小时的探索，我找到了React Native TextInput的“disableFullscreenUI”属性。

在我的情况下，我只想要普通的输入编辑，不想显示全屏编辑器。

<TextInput disableFullscreenUI={true} />

全屏模式将在编辑时退出，然后编辑将保留在TextInput内。

希望这可以帮助到您。

- jayson.centeno

Answer 2

这是RN的一个问题。我已经将我的应用程序更新到RN V50.0（之前是V47.0）。现在上述问题不再存在了。当文本框弹出时，字体显示为黑色。

- Lakshitha Ruwan

Answer 3

有一些库，比如react-native-orientationhttps://github.com/yamill/react-native-orientation/，可以让您检查用户是否更改了屏幕方向。可以根据屏幕方向应用不同的样式。

但是，对于您提到的情况，我认为根据屏幕方向改变颜色可能不太友好。建议您使用标准颜色组合，在所有分辨率和方向下都可看着舒适。

希望能有所帮助。

- soutot

---

谢谢，但我已经看到有应用程序可以做到这一点。实际上，这与屏幕的方向无关。我可以使用onLayout事件来检查方向。问题在于，当没有足够的空间容纳键盘时，会弹出全屏编辑器。我已经看到一些应用程序将文本框背景设置为黑色，文本为白色。当全屏编辑器出现时，它变成了白色背景中的黑色文本。 - Lakshitha Ruwan