如何在React Native中滚动文本？

Question

如何在React Native中滚动文本？

我有一个长文本，需要放在一个固定高度的容器中。我想要展示部分文本，并在需要查看更多时滚动它。

我已经尝试了溢出滚动（overflow scroll）但是React Native好像不支持溢出滚动。

谢谢。

- kenny

---

滚动视图在React Native中完美运作。如果您尝试过某些方法但未成功，请添加相关内容。 - Dlucidone

你能具体一些吗？你看过TextInput组件吗？ - Ashok R

Answer 1

您可以使用ScrollView来实现此功能。只需将文本放入其中并将高度设置为滚动视图。

- Александр Лунев

Answer 2

我使用了以下代码。使用ScrollView，并将任何元素放在ScrollView内部。

render() {
    return(
      <View style={styles.container}>

       <ScrollView>       

         <Text>
           Add your text
         </Text>      

       </ScrollView>

      </View>
    );
  }

- Manish Ahire

Answer 3

React Native目前存在一个限制，即您无法直接在ScrollView的style属性中设置height。因此，如果您也想设置高度，请按照以下步骤操作：

<View style={{ height: 100 }}>
  <ScrollView>
    <Text>
      Your text goes here.
    </Text>
  </ScrollView>
</View>

或者使用 flexGrow：

<ScrollView style={{ flexGrow: 0.2 }}>
  <Text>
    Your text goes here.
  </Text>
</ScrollView>

我发现了相关问题： https://github.com/facebook/react-native/issues/3422

- PanagiotisP

Answer 4

<View style={{ height: hp(3)}}>
 <ScrollView>
     <Text style={{ fontSize: hp(2) }}>
         Your text goes here
     </Text>
 </ScrollView>

- Naveed Naeem