React Native 上手 - 5.ScrollView

React Native

上一篇：React Native 上手 - 4.处理用户输入

滚动视图 ScrollView

在手机 App 中，大部分界面的内容都没法同时展示在屏幕上，因此需要用户可以滑动屏幕。

在 React Native 中，如果在一个 View 元素中加入过多的内容，导致一个屏幕方法下，那用户就无法看到超出屏幕的部分，且 View 元素不支持滑动屏幕的操作。

因此需要用一个 ScrollView 组件来包裹内容，例如：

<ScrollView>
    // 此处放入内容
</ScrollView>
ScrollView

这样，当屏幕中的元素超过屏幕范围时，就可以通过上下滑动屏幕来浏览所有的内容。

若要屏幕支持横向滚动而不是纵向滚动，只需要给 ScrollView 设置一个 horizontal 属性即可。

<ScrollView horizontal>

效果如下：

横向滚动视图

下一篇：React Native 上手 - 6.ListView

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容