使用滚动条。

1. import

import {ScrollView} from "react-native";

2. Using

      <ScrollView>
...
</ScrollView>

3. src

import React from 'react';
import { StyleSheet, Text, View, Image, ScrollView } from 'react-native'; export default class App extends React.Component {
render() {
return (
<ScrollView>
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
<Image source={{uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'}}
style={{width: , height: }}/>
</View>
</ScrollView>
);
}
} const styles = StyleSheet.create({
container: {
flex: ,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});

Reference:

1. Using a ScrollView

Using a ScrollView - RN4的更多相关文章

  1. ScrollView嵌套ListView,GridView数据加载不全问题的解决

    我们大家都知道ListView,GridView加载数据项,如果数据项过多时,就会显示滚动条.ScrollView组件里面只能包含一个组件,当ScrollView里面嵌套listView,GridVi ...

  2. Android ScrollView监听滑动到顶部和底部的两种方式(你可能不知道的细节)

    Android ScrollView监听滑动到顶部和底部,虽然网上很多资料都有说,但是不全,而且有些细节没说清楚 使用场景: 1. 做一些复杂动画的时候,需要动态判断当前的ScrollView是否滚动 ...

  3. React-Native学习系列(二) Image和ScrollView

    接下来,我们接着(一)继续讲,今天我们学习的是Image组件和ScrollView组件. Image组件 Image:一个用于显示多种不同类型图片的React组件.那么要如何使用呢? 引入本地图片: ...

  4. iOS学习笔记——滚动视图(scrollView)

    滚动视图:在根视图中添加UIScrollViewDelegate协议,声明一些对象属性 @interface BoViewController : UIViewController<UIScro ...

  5. 实现下来ScrollView放大轮播图

    创建工程,创建一个UIScrollView属性,并遵循其协议: #define kWidth self.view.frame.size.width//屏幕宽 #define kHeight self. ...

  6. React Native之 ScrollView介绍和使用

    前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...

  7. ScrollView分栏视图分析

    代码精华部分如下: //1.添加scrollView /* 1). 添加一个scrollView; 2).创建关注.热门.附近三个控制器. 3). 存储它们的名字到数组中,遍历并放到本控制器里. 4) ...

  8. IOS实现自动循环滚动广告--ScrollView的优化和封装

    一.问题分析 在许多App中,我们都会见到循环滚动的视图,比如广告,其实想实现这个功能并不难,用ScrollView就可以轻松完成,但是在制作的过程中还存在几个小问题,如果能够正确的处理好这些小问题, ...

  9. ReactNative 根据scrollView/listview滑动距离动态修改NavBar颜色

    我们常见某些APP上滑的时候,NavBar颜色会从透明渐变为某种颜色 原理非常简单,根据scrollView的回调动态修改NavBar的透明度即可. 在RN中,尤其是ListView中这个回调不是很好 ...

随机推荐

  1. 数据分析---SQL(Access数据库)

    1. SQL(Structure Quest Language) 一种结构化查询语言,它是一种通用的关系型数据库操作语言,用于存取数据,查询,更新和管理数据库. 2. 基本语句 Select, Cre ...

  2. UVa 11134 - Fabled Rooks 优先队列,贪心 难度: 0

    题目 https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&a ...

  3. 为DBNavigator的按钮加中文

    转自:http://hi.baidu.com/debiansir/item/0699f5b6bb4d99f063388e71 /*Delphi中数据库控件DBNavigator使用起来不错,但是按钮上 ...

  4. 调用 LoadLibraryEx 失败,在 ISAPI 筛选器 "C:\Program Files\php\php5isapi.dll"

    把 ISAPI 筛选器这里的php配置删掉,php改用fastcgi配置

  5. Sql语句内功心法

    CREATE SCHEMA <模式名> AUTHORIZATION <用户名> 定义模式实际上定义了一个命名空间,在这个空间可以进一步定义该模式包含的数据库对象,例如基本表,视 ...

  6. Jmeter压力测试生成聚合报告

    Jmeter压力测试: 压力测试的场景设置分为三种: 单场景:一个请求(如:单个接口的测试) 混合场景:多个请求(如:购物流程的测试) 压测时间,一般场景都是运行10-15分钟,如果是做疲劳测试的话, ...

  7. fullpage 中输入框弹起 页面上移问题处理

    fullpage页面要是有输入框的话  点击输入框 键盘弹出的时候会把输入框也顶起来 页面就会向上移 但是键盘收回的时候页面还是上移的状态 对于这个问题只在android手机上出现  为了解决这个问题 ...

  8. 一个class标签里面有多个属性时的提取标签

    <div class="uibox-con carpic-list03 border-b-solid">   #即这个标签同时满足三个class:“uibox”.“ca ...

  9. FreeSWITCH添加中文语音

    1.准备中文语音包 可以到freeswitch官网下载,也可以自己录制 2.中文资源的安装路径:  英文资源的路径为conf/sounds/en/us/callie/...  类似的设置中文资源的路径 ...

  10. ecmall 入口文件解析 引入了什么

    每一个框架都有自动载入的工具库,搜了半天也没搜到相关介绍,就自己看入口文件琢磨了一下, <?php define('ROOT_PATH', dirname(__FILE__)); //定义项目根 ...