Skip to content

Commit ebbf4e5

Browse files
gitimgitim
committed
Update examples
1 parent 97e8280 commit ebbf4e5

File tree

30 files changed

+2608
-2063
lines changed

30 files changed

+2608
-2063
lines changed

‎examples/Basic/.flowconfig

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
[ignore]
2+
; We fork some components by platform
3+
.*/*[.]android.js
4+
5+
; Ignore "BUCK" generated dirs
6+
<PROJECT_ROOT>/\.buckd/
7+
8+
; Ignore unexpected extra "@providesModule"
9+
.*/node_modules/.*/node_modules/fbjs/.*
10+
11+
; Ignore duplicate module providers
12+
; For RN Apps installed via npm, "Libraries" folder is inside
13+
; "node_modules/react-native" but in the source repo it is in the root
14+
.*/Libraries/react-native/React.js
15+
16+
; Ignore polyfills
17+
.*/Libraries/polyfills/.*
18+
19+
[include]
20+
21+
[libs]
22+
node_modules/react-native/Libraries/react-native/react-native-interface.js
23+
node_modules/react-native/flow/
24+
25+
[options]
26+
emoji=true
27+
28+
module.system=haste
29+
30+
munge_underscores=true
31+
32+
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
33+
34+
suppress_type=$FlowIssue
35+
suppress_type=$FlowFixMe
36+
suppress_type=$FlowFixMeProps
37+
suppress_type=$FlowFixMeState
38+
suppress_type=$FixMe
39+
40+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
41+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
42+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
43+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
44+
45+
unsafe.enable_getters_and_setters=true
46+
47+
[version]
48+
^0.56.0

‎examples/Basic/.gitignore

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ buck-out/
4646
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
4747
# screenshots whenever they are needed.
4848
# For more information about the recommended setup visit:
49-
# https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
49+
# https://docs.fastlane.tools/best-practices/source-control/
5050

51-
fastlane/report.xml
52-
fastlane/Preview.html
53-
fastlane/screenshots
51+
*/fastlane/report.xml
52+
*/fastlane/Preview.html
53+
*/fastlane/screenshots

‎examples/Basic/App.js

Lines changed: 226 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,226 @@
1+
/**
2+
* Sample React Native App
3+
* httpss://github.com/facebook/react-native
4+
* @flow
5+
*/
6+
7+
import React, { Component } from 'react';
8+
import {
9+
Animated,
10+
Easing,
11+
StyleSheet,
12+
Text,
13+
Image,
14+
View,
15+
Dimensions,
16+
Platform,
17+
} from 'react-native';
18+
import SortableList from 'react-native-sortable-list';
19+
20+
const window = Dimensions.get('window');
21+
22+
23+
const data = {
24+
0: {
25+
image: 'https://placekitten.com/200/240',
26+
text: 'Chloe',
27+
},
28+
1: {
29+
image: 'https://placekitten.com/200/201',
30+
text: 'Jasper',
31+
},
32+
2: {
33+
image: 'https://placekitten.com/200/202',
34+
text: 'Pepper',
35+
},
36+
3: {
37+
image: 'https://placekitten.com/200/203',
38+
text: 'Oscar',
39+
},
40+
4: {
41+
image: 'https://placekitten.com/200/204',
42+
text: 'Dusty',
43+
},
44+
5: {
45+
image: 'https://placekitten.com/200/205',
46+
text: 'Spooky',
47+
},
48+
6: {
49+
image: 'https://placekitten.com/200/210',
50+
text: 'Kiki',
51+
},
52+
7: {
53+
image: 'https://placekitten.com/200/215',
54+
text: 'Smokey',
55+
},
56+
8: {
57+
image: 'https://placekitten.com/200/220',
58+
text: 'Gizmo',
59+
},
60+
9: {
61+
image: 'https://placekitten.com/220/239',
62+
text: 'Kitty',
63+
},
64+
};
65+
66+
export default class Basic extends Component {
67+
render() {
68+
return (
69+
<View style={styles.container}>
70+
<Text style={styles.title}>React Native Sortable List</Text>
71+
<SortableList
72+
style={styles.list}
73+
contentContainerStyle={styles.contentContainer}
74+
data={data}
75+
renderRow={this._renderRow} />
76+
</View>
77+
);
78+
}
79+
80+
_renderRow = ({data, active}) => {
81+
return <Row data={data} active={active} />
82+
}
83+
}
84+
85+
class Row extends Component {
86+
87+
constructor(props) {
88+
super(props);
89+
90+
this._active = new Animated.Value(0);
91+
92+
this._style = {
93+
...Platform.select({
94+
ios: {
95+
transform: [{
96+
scale: this._active.interpolate({
97+
inputRange: [0, 1],
98+
outputRange: [1, 1.1],
99+
}),
100+
}],
101+
shadowRadius: this._active.interpolate({
102+
inputRange: [0, 1],
103+
outputRange: [2, 10],
104+
}),
105+
},
106+
107+
android: {
108+
transform: [{
109+
scale: this._active.interpolate({
110+
inputRange: [0, 1],
111+
outputRange: [1, 1.07],
112+
}),
113+
}],
114+
elevation: this._active.interpolate({
115+
inputRange: [0, 1],
116+
outputRange: [2, 6],
117+
}),
118+
},
119+
})
120+
};
121+
}
122+
123+
componentWillReceiveProps(nextProps) {
124+
if (this.props.active !== nextProps.active) {
125+
Animated.timing(this._active, {
126+
duration: 300,
127+
easing: Easing.bounce,
128+
toValue: Number(nextProps.active),
129+
}).start();
130+
}
131+
}
132+
133+
render() {
134+
const {data, active} = this.props;
135+
136+
return (
137+
<Animated.View style={[
138+
styles.row,
139+
this._style,
140+
]}>
141+
<Image source={{uri: data.image}} style={styles.image} />
142+
<Text style={styles.text}>{data.text}</Text>
143+
</Animated.View>
144+
);
145+
}
146+
}
147+
148+
const styles = StyleSheet.create({
149+
container: {
150+
flex: 1,
151+
justifyContent: 'center',
152+
alignItems: 'center',
153+
backgroundColor: '#eee',
154+
155+
...Platform.select({
156+
ios: {
157+
paddingTop: 20,
158+
},
159+
}),
160+
},
161+
162+
title: {
163+
fontSize: 20,
164+
paddingVertical: 20,
165+
color: '#999999',
166+
},
167+
168+
list: {
169+
flex: 1,
170+
},
171+
172+
contentContainer: {
173+
width: window.width,
174+
175+
...Platform.select({
176+
ios: {
177+
paddingHorizontal: 30,
178+
},
179+
180+
android: {
181+
paddingHorizontal: 0,
182+
}
183+
})
184+
},
185+
186+
row: {
187+
flexDirection: 'row',
188+
alignItems: 'center',
189+
backgroundColor: '#fff',
190+
padding: 16,
191+
height: 80,
192+
flex: 1,
193+
marginTop: 7,
194+
marginBottom: 12,
195+
borderRadius: 4,
196+
197+
198+
...Platform.select({
199+
ios: {
200+
width: window.width - 30 * 2,
201+
shadowColor: 'rgba(0,0,0,0.2)',
202+
shadowOpacity: 1,
203+
shadowOffset: {height: 2, width: 2},
204+
shadowRadius: 2,
205+
},
206+
207+
android: {
208+
width: window.width - 30 * 2,
209+
elevation: 0,
210+
marginHorizontal: 30,
211+
},
212+
})
213+
},
214+
215+
image: {
216+
width: 50,
217+
height: 50,
218+
marginRight: 30,
219+
borderRadius: 25,
220+
},
221+
222+
text: {
223+
fontSize: 24,
224+
color: '#222222',
225+
},
226+
});

‎examples/Basic/__tests__/index.ios.js renamed to ‎examples/Basic/__tests__/App.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import 'react-native';
22
import React from 'react';
3-
import Index from '../index.ios.js';
3+
import App from '../App';
44

55
// Note: test renderer must be required after react-native.
66
import renderer from 'react-test-renderer';
77

88
it('renders correctly', () => {
99
const tree = renderer.create(
10-
<Index />
10+
<App />
1111
);
1212
});

‎examples/Basic/__tests__/index.android.js

Lines changed: 0 additions & 12 deletions
This file was deleted.

‎examples/Basic/android/app/build.gradle

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,10 @@ import com.android.build.OutputFile
7272
* ]
7373
*/
7474

75+
project.ext.react = [
76+
entryFile: "index.js"
77+
]
78+
7579
apply from: "../../node_modules/react-native/react.gradle"
7680

7781
/**

‎examples/Basic/android/app/src/main/java/com/basic/MainApplication.java

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@ protected List<ReactPackage> getPackages() {
2525
new MainReactPackage()
2626
);
2727
}
28+
29+
@Override
30+
protected String getJSMainModuleName() {
31+
return "index";
32+
}
2833
};
2934

3035
@Override

‎examples/Basic/index.android.js

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎examples/Basic/index.ios.js

Lines changed: 0 additions & 1 deletion
This file was deleted.

0 commit comments

Comments
 (0)