Example

示例

import React, { Component } from 'react';
import {View,Slider,StyleSheet,Text } from 'react-native';
export class pageComponent extends Component {
    constructor(props){
        super(props);
        this.state={
            value: 10
        }
    }
    onChange =(value)=>{
        this.setState({
            value: value
        })
    };
    render(){
        return(
            <View style={styles.container}>
                <Slider style={styles.sliderView}
                        minimumValue={0}
                        maximumValue={100}
                        value={this.state.value}
                        onValueChange={this.onChange}/>
                <Text style={styles.text}>
                    当前value：{this.state.value}
                </Text>
            </View>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        marginTop: 100,
        padding: 10,
        borderRadius: 5,
        alignItems: 'center',
        width: 300
    },
    sliderView: {
        width: 260,
        marginTop: 20
    },
    text: {
        marginTop: 20,
        fontSize:20,
        color:'#00ff00'
    }
});