文本输入上的水平滚动答案

【问题标题】：Horizontal scroll on text input文本输入上的水平滚动
【发布时间】：2016-01-25 22:07:55
【问题描述】：

我有两个输入文本。第一个是用于电子邮件，当我写的文本超过此输入的宽度时，问题就出现了，其余的文本看不到。正常的行为是水平滚动以查看其余文本，对吧？

我不知道我是否遗漏了什么，但它不起作用。

示例代码如下：rnplay.org

编辑：这是我想要的效果，这是来自官方 React Native repo 的 UI Explorer 示例：

谢谢！

【问题讨论】：

标签： overflow react-native textinput

【解决方案1】：

我能够解决它。

我不知道为什么，但是如果我将 paddingTop 和 paddingBottom 都设置为输入文本，就会出现问题。

如果我删除其中一个，那么输入文本可以正常工作，这里是一个例子：Input text working well

我希望这也可以帮助别人。

谢谢。

【讨论】：

【解决方案2】：

我在here 一起扔了一个hacky 东西，基本上把TextInput 包裹在一个水平的ScrollView 中：

https://rnplay.org/apps/q7M2Pg

<View style={{ backgroundColor: 'white', overflow: 'hidden' }}>
  <ScrollView horizontal={true} style={{ marginBottom:-7 }}>                        
     <TextInput
        style={ [styles.loginFormInput, {width:width}] } />
  </ScrollView>
</View>

从理论上讲，为了使这更好，您可以调用 onChangeText 方法来设置宽度以使其更好（尽管本地方式当然是理想的）。

在源代码中根本看不到任何配置，希望有人能提供更好的答案！

【讨论】：

感谢您的回答纳德。我想要的不可能吗？我只想要一行在文本到达右侧末尾时向前移动。你知道我的意思吗？
嘿，抱歉没有意识到你说的是水平的！我已经更新了我的答案，祝你好运。
在 Real Native 官方仓库的 UI Explorer 示例中，它运行良好，但我没有看到代码中有什么特别之处，所以，我不知道该怎么做！我用显示效果的 gif 编辑了我的问题。