Skip to content

page

Jump to bottom
brainpoint edited this page Feb 28, 2017 · 1 revision

Example

'use strict';
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, } from 'react-native';
import { Page } from 'react-componet'

class app extends Component {
  render() {
    return (
      <Page horizontal={false}>
        <View>1</View>
        <View>2</View>
        <View>3</View>
        <View>4</View>
        <View>5</View>
      </Page>
    );
  }
}

Gloabl style.

设置全局样式可以改变所有Button的默认样式

Page.dotStyle: View.propTypes.style

非当前页面的样式, 可设置backgroundColor颜色等.

Page.activeDotStyle: Text.propTypes.style

非当前页面的样式, 可设置backgroundColor颜色等.

Page.dot: View.propTypes.element

直接使用node节点来表现非当前页面.

Page.activeDot: Text.propTypes.element

直接使用node节点来表现当前页面.

Props.

horizontal: PropTypes.boolean

设置方向, 默认为true.

loop: PropTypes.boolean

是否可以循环, 默认为true

index: PropTypes.number

默认显示的页面

showsButtons: PropTypes.boolean

是否显示页面按钮, 默认为false

autoplay: PropTypes.boolean

是否自动播放, 默认为false

autoplayTimeout: PropTypes.number

自动播放时间间隔, 默认为2500

dotStyle: PropTypes.style

非当前页面的样式, 可设置backgroundColor颜色等.

activeDotStyle: PropTypes.style

当前页面的样式, 可设置backgroundColor颜色等.

dot: PropTypes.element

直接使用node节点来表现非当前页面.

activeDot: PropTypes.element

直接使用node节点来表现当前页面.

Clone this wiki locally