1.0.1 • Published 6 years ago

react-native-turntable v1.0.1

Weekly downloads
10
License
MIT
Repository
github
Last release
6 years ago

React Native TurnTable

Easy-to-use roulette buttons for React Native App

Installation

npm i react-native-turntable --save

Usage

###Basic Example see full basic example

|basic_example_ios|basic_example_android|

|---------------|----------|

import {Turntable} from 'react-native-turntable'

export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Turntable
          radius={200}
          distance={75}
          enableUserRotate
          turntableRotate={30}
          handlerOfRotate={()=>alert('触发')}
          customStyle={{ backgroundColor: '#E14C46' }}
        >
          <TouchableOpacity>
            <Text>1</Text>
          </TouchableOpacity>
          <TouchableOpacity>
            <Text>2</Text>
          </TouchableOpacity>
          <TouchableOpacity>
            <Text>3</Text>
          </TouchableOpacity>
          <TouchableOpacity>
            <Text>4</Text>
          </TouchableOpacity>
          <TouchableOpacity>
            <Text>5</Text>
          </TouchableOpacity>
          <TouchableOpacity>
            <Text>6</Text>
          </TouchableOpacity>
        </Turntable>
      </View>
    );
  }
}

Configuration

PropertyTypeDefaultDescription
radiusnumber300radius of the turntable
distancenumber100The distance from the center of each button
turntableRotatenumber0turntable button offset
enableUserRotateboolfalseWhether to open the disc rotation
childrenarraynullchildren
handlerOfRotatefuncnullFunction Callback triggered when the disc is rotated
customStyleanynullturntable style