react-native(리액트 네이티브) API - Vibration

react-native(리액트 네이티브) API - Vibration

const React = require('react')

const ReactNative = require('react-native')

const {

StyleSheet, Text, View, ScrollView, TouchableHighlight, Vibration, Platform,

} = ReactNative

exports.framework = 'React'

exports.title = 'Vibration'

exports.description = 'Vibration API'

let pattern,

patternLiteral,

patternDescription

if (Platform.OS === 'android') {

pattern = [0, 500, 200, 500]

patternLiteral = '[0, 500, 200, 500]'

patternDescription = `${patternLiteral}

arg 0: duration to wait before turning the vibrator on.

arg with odd: vibration lennth.

arg with even: duration to wait before next vibration.

`

} else {

pattern = [0, 1000, 2000, 3000]

patternLiteral = '[0, 1000, 2000, 3000]'

patternDescription = `${patternLiteral}

vibration length on iOS fixed.

pattern controls durations BETWEEN each vibration only.

arg 0: duration to wait before turning the vibrator on.

subswquent args: duration to wait before next vibration.

`

}

export default class App extends React.Component {

render() {

return(

<ScrollView>

<Text>title: 'Pattern Descriptions'</Text>

<View style={styles.wrapper}>

<Text>{patternDescription}</Text>

</View>

<Text>title: 'Vibration.vibrate()'</Text>

<TouchableHighlight

style={styles.wrapper}

onPress={() => Vibration.vibrate()}

>

<View style={styles.button}>

<Text>Vibrate</Text>

</View>

</TouchableHighlight>

<Text>title: `Vibration.vibrate(${patternLiteral})`</Text>

<TouchableHighlight

style={styles.wrapper}

onPress={() => Vibration.vibrate(parrten)}

>

<View style={styles.button}>

<Text>Vibrate once</Text>

</View>

</TouchableHighlight>

<Text>title: `Vibration.vibrate(${patternLiteral}, true)`</Text>

<TouchableHighlight

style={styles.wrapper}

onPress={() => Vibration.vibrate(pattern, true)}

>

<View style={styles.button}>

<Text>Vibrate until cancel</Text>

</View>

</TouchableHighlight>

<Text>'Vibration.cancel()'</Text>

<TouchableHighlight

style={styles.wrapper}

onPress={() => Vibration.cancel()}

>

<View style={styles.button}>

<Text>Cancel</Text>

</View>

</TouchableHighlight>

</ScrollView>

)

}

}

const styles = StyleSheet.create({

wrapper: {

borderRadius: 5,

marginBottom: 5,

},

button: {

backgroundColor: '#eeeeee',

padding: 10,

},

})