This repository has been archived by the owner on Jul 3, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 41
/
App.js
70 lines (62 loc) · 1.5 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View,
TouchableOpacity
} from 'react-native';
import RNSiriWaveView from 'react-native-siri-wave-view'
export default class App extends Component<{}> {
constructor (props) {
super(props)
this.state = {
startAnimation: true,
stopAnimation: false
}
}
render() {
return <View style={styles.container}>
<RNSiriWaveView type={0} width={800} height={750} startAnimation={true} stopAnimation={this.state.stopAnimation} />
<TouchableOpacity style={[styles.button]} onPress={() => {
this.setState({
startAnimation: true,
stopAnimation: false
});
}}>
<Text>Start</Text>
</TouchableOpacity>
<TouchableOpacity style={[styles.button]} onPress={() => {
this.setState({
startAnimation: false,
stopAnimation: true
});
}}>
<Text>Stop</Text>
</TouchableOpacity>
</View>;
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
backgroundColor: "#F5FCFF",
flexDirection: "column"
},
button: {
height: 40,
width: 100,
backgroundColor: "#add8e6",
justifyContent: 'center',
alignItems: 'center',
marginTop: 10
}
});