|
10 | 10 |
|
11 | 11 | 'use strict';
|
12 | 12 |
|
13 |
| -var React = require('react'); |
14 |
| -var createReactClass = require('create-react-class'); |
15 |
| -var ReactNative = require('react-native'); |
16 |
| -var {ProgressViewIOS, StyleSheet, View} = ReactNative; |
| 13 | +const React = require('react'); |
| 14 | +const ReactNative = require('react-native'); |
| 15 | +const {ProgressViewIOS, StyleSheet, View} = ReactNative; |
17 | 16 |
|
18 |
| -var ProgressViewExample = createReactClass({ |
19 |
| - displayName: 'ProgressViewExample', |
20 |
| - _rafId: (null: ?AnimationFrameID), |
| 17 | +type Props = {||}; |
| 18 | +type State = {| |
| 19 | + progress: number, |
| 20 | +|}; |
21 | 21 |
|
22 |
| - getInitialState() { |
23 |
| - return { |
24 |
| - progress: 0, |
25 |
| - }; |
26 |
| - }, |
| 22 | +class ProgressViewExample extends React.Component<Props, State> { |
| 23 | + _rafId: ?AnimationFrameID = null; |
| 24 | + |
| 25 | + state = { |
| 26 | + progress: 0, |
| 27 | + }; |
27 | 28 |
|
28 | 29 | componentDidMount() {
|
29 | 30 | this.updateProgress();
|
30 |
| - }, |
| 31 | + } |
31 | 32 |
|
32 | 33 | componentWillUnmount() {
|
33 | 34 | if (this._rafId != null) {
|
34 | 35 | cancelAnimationFrame(this._rafId);
|
35 | 36 | }
|
36 |
| - }, |
| 37 | + } |
37 | 38 |
|
38 |
| - updateProgress() { |
| 39 | + updateProgress = () => { |
39 | 40 | var progress = this.state.progress + 0.01;
|
40 | 41 | this.setState({progress});
|
41 | 42 | this._rafId = requestAnimationFrame(() => this.updateProgress());
|
42 |
| - }, |
| 43 | + }; |
43 | 44 |
|
44 |
| - getProgress(offset) { |
| 45 | + getProgress = offset => { |
45 | 46 | var progress = this.state.progress + offset;
|
46 | 47 | return Math.sin(progress % Math.PI) % 1;
|
47 |
| - }, |
| 48 | + }; |
48 | 49 |
|
49 | 50 | render() {
|
50 | 51 | return (
|
@@ -75,8 +76,8 @@ var ProgressViewExample = createReactClass({
|
75 | 76 | />
|
76 | 77 | </View>
|
77 | 78 | );
|
78 |
| - }, |
79 |
| -}); |
| 79 | + } |
| 80 | +} |
80 | 81 |
|
81 | 82 | exports.displayName = (undefined: ?string);
|
82 | 83 | exports.framework = 'React';
|
|
0 commit comments