基础篇_使用ScrollView

ScrollView
是一个通用的可滚动的容器,你可以在其中放入多个组件和视图,而且这些组件并不需要是同类型的。ScrollView不仅可以垂直滚动,还能水平滚动(通过 horizontal [hɒrɪ'zɒnt(ə)l] 水平的 属性来设置)。

下面的示例代码创建了一个垂直滚动的ScrollView
,其中还混杂了图片和文字组件。
注:下面的这个 ./img/favicon.png
并不实际存在,请自己准备图片素材,并改为相对应的正确路径,具体请参考图片文档。

[rɪ'kwaɪə] 需要

import React, { Component } from 'react';
import {
    AppRegistry,
    ScrollView,
    Image,
    Text,
    View } from 'react-native';

class MyApp extends Component {
    render() {
        return(
               
               Scroll me plz
               
               
               
               
               
               If you like
                //img 是文件夹 直接放在项目的目录下,favicon 是图片名
               
               
               
               
               Scrolling down
               
               
               
               
               
               What's the best
               
               
               
               
               
               Framework around?
               
               
               
               
               
               React Native
               
               );
    }
}
// 注册应用(registerComponent)后才能正确渲染
// 注意:只把应用作为一个整体注册一次,而不是每个组件/模块都注册
AppRegistry.registerComponent('MyApp', () => MyApp);

ScrollView适合用来显示数量不多的滚动元素。放置在ScollView中的所有组件都会被渲染,哪怕有些组件因为内容太长被挤出了屏幕外。如果你需要显示较长的滚动列表,那么应该使用功能差不多但性能更好的ListView组件。

你可能感兴趣的:(基础篇_使用ScrollView)