Skip to content

Commit a3af84c

Browse files
committed
Init
0 parents  commit a3af84c

19 files changed

+7897
-0
lines changed

.babelrc

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"presets": ["babel-preset-expo"],
3+
"env": {
4+
"development": {
5+
"plugins": ["transform-react-jsx-source"]
6+
}
7+
}
8+
}

.flowconfig

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
[ignore]
2+
; We fork some components by platform
3+
.*/*[.]android.js
4+
5+
; Ignore templates for 'react-native init'
6+
<PROJECT_ROOT>/node_modules/react-native/local-cli/templates/.*
7+
8+
; Ignore RN jest
9+
<PROJECT_ROOT>/node_modules/react-native/jest/.*
10+
11+
; Ignore RNTester
12+
<PROJECT_ROOT>/node_modules/react-native/RNTester/.*
13+
14+
; Ignore the website subdir
15+
<PROJECT_ROOT>/node_modules/react-native/website/.*
16+
17+
; Ignore the Dangerfile
18+
<PROJECT_ROOT>/node_modules/react-native/danger/dangerfile.js
19+
20+
; Ignore Fbemitter
21+
<PROJECT_ROOT>/node_modules/fbemitter/.*
22+
23+
; Ignore "BUCK" generated dirs
24+
<PROJECT_ROOT>/node_modules/react-native/\.buckd/
25+
26+
; Ignore unexpected extra "@providesModule"
27+
.*/node_modules/.*/node_modules/fbjs/.*
28+
29+
; Ignore polyfills
30+
<PROJECT_ROOT>/node_modules/react-native/Libraries/polyfills/.*
31+
32+
; Ignore various node_modules
33+
<PROJECT_ROOT>/node_modules/react-native-gesture-handler/.*
34+
<PROJECT_ROOT>/node_modules/expo/.*
35+
<PROJECT_ROOT>/node_modules/react-navigation/.*
36+
<PROJECT_ROOT>/node_modules/xdl/.*
37+
<PROJECT_ROOT>/node_modules/reqwest/.*
38+
<PROJECT_ROOT>/node_modules/metro-bundler/.*
39+
40+
[include]
41+
42+
[libs]
43+
node_modules/react-native/Libraries/react-native/react-native-interface.js
44+
node_modules/react-native/flow/
45+
node_modules/expo/flow/
46+
47+
[options]
48+
emoji=true
49+
50+
module.system=haste
51+
52+
module.file_ext=.js
53+
module.file_ext=.jsx
54+
module.file_ext=.json
55+
module.file_ext=.ios.js
56+
57+
munge_underscores=true
58+
59+
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'
60+
61+
suppress_type=$FlowIssue
62+
suppress_type=$FlowFixMe
63+
suppress_type=$FlowFixMeProps
64+
suppress_type=$FlowFixMeState
65+
suppress_type=$FixMe
66+
67+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)
68+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)?:? #[0-9]+
69+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
70+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
71+
72+
unsafe.enable_getters_and_setters=true
73+
74+
[version]
75+
^0.56.0

.gitignore

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
# See https://help.github.com/ignore-files/ for more about ignoring files.
2+
3+
# expo
4+
.expo/
5+
6+
# dependencies
7+
/node_modules
8+
9+
# misc
10+
.env.local
11+
.env.development.local
12+
.env.test.local
13+
.env.production.local
14+
15+
npm-debug.log*
16+
yarn-debug.log*
17+
yarn-error.log*
18+
blog/
19+
20+
# Logs
21+
logs
22+
*.log
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# Runtime data
28+
pids
29+
*.pid
30+
*.seed
31+
*.pid.lock
32+
33+
# Directory for instrumented libs generated by jscoverage/JSCover
34+
lib-cov
35+
36+
# Coverage directory used by tools like istanbul
37+
coverage
38+
39+
# nyc test coverage
40+
.nyc_output
41+
42+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
43+
.grunt
44+
45+
# Bower dependency directory (https://bower.io/)
46+
bower_components
47+
48+
# node-waf configuration
49+
.lock-wscript
50+
51+
# Compiled binary addons (https://nodejs.org/api/addons.html)
52+
build/Release
53+
54+
# Dependency directories
55+
node_modules/
56+
jspm_packages/
57+
58+
# TypeScript v1 declaration files
59+
typings/
60+
61+
# Optional npm cache directory
62+
.npm
63+
64+
# Optional eslint cache
65+
.eslintcache
66+
67+
# Optional REPL history
68+
.node_repl_history
69+
70+
# Output of 'npm pack'
71+
*.tgz
72+
73+
# Yarn Integrity file
74+
.yarn-integrity
75+
76+
# dotenv environment variables file
77+
.env
78+
79+
# next.js build output
80+
.next

.watchmanconfig

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

App.js

+179
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,179 @@
1+
import React from "react";
2+
import {
3+
SafeAreaView,
4+
ScrollView,
5+
View,
6+
Text,
7+
TextInput,
8+
TouchableOpacity,
9+
Switch,
10+
StyleSheet,
11+
Keyboard,
12+
StatusBar
13+
} from "react-native";
14+
import { Font } from "expo";
15+
import { ScaledSheet } from "react-native-size-matters";
16+
17+
import { Chat } from "./src/Chat";
18+
import { addChat } from "./src/DB";
19+
20+
console.disableYellowBox = true;
21+
22+
export default class App extends React.Component {
23+
state = { text: "", fontLoaded: false };
24+
25+
async componentDidMount() {
26+
StatusBar.setHidden(true);
27+
await Font.loadAsync({
28+
"Chalkboard SE": require("./assets/fonts/ChalkboardSE-Bold.ttf"),
29+
Futura: require("./assets/fonts/Futura.ttf")
30+
});
31+
this.setState({ fontLoaded: true });
32+
}
33+
34+
_onTextChange = text => {
35+
this.setState({ text });
36+
};
37+
38+
_onSubmit = () => {
39+
const { text } = this.state;
40+
if (text.trim() === "") return;
41+
addChat("John", text);
42+
this.setState({ text: "" });
43+
Keyboard.dismiss();
44+
};
45+
46+
_toggleSwitch = () =>
47+
this.setState(prevState => ({ switch: !prevState.switch }));
48+
49+
render() {
50+
if (!this.state.fontLoaded) return null;
51+
const styles = this.state.switch ? scaledStyles : regularStyles;
52+
return (
53+
<SafeAreaView style={styles.container}>
54+
<View>
55+
<Text style={styles.header}>Chat App Demo</Text>
56+
</View>
57+
<View style={styles.switchWrapper}>
58+
<Text style={styles.text}>React Native Size Matters Enabled?</Text>
59+
<Switch
60+
onValueChange={this._toggleSwitch}
61+
value={this.state.switch}
62+
/>
63+
</View>
64+
<ScrollView
65+
ref={scrollView => (this.scrollView = scrollView)}
66+
onContentSizeChange={(contentWidth, contentHeight) => {
67+
this.scrollView.scrollToEnd({ animated: true });
68+
}}
69+
>
70+
<Chat toggle={this.state.switch} />
71+
</ScrollView>
72+
<View style={styles.inputContainer}>
73+
<TextInput
74+
style={styles.input}
75+
value={this.state.text}
76+
onChangeText={this._onTextChange}
77+
onSubmitEditing={this._onSubmit}
78+
blurOnSubmit={false}
79+
underlineColorAndroid="transparent"
80+
/>
81+
<View style={styles.btn}>
82+
<TouchableOpacity onPress={this._onSubmit}>
83+
<Text style={[styles.text, styles.btnColor]}>Send</Text>
84+
</TouchableOpacity>
85+
</View>
86+
</View>
87+
</SafeAreaView>
88+
);
89+
}
90+
}
91+
92+
const scaledStyles = ScaledSheet.create({
93+
container: {
94+
flex: 1
95+
},
96+
header: {
97+
textAlign: "center",
98+
fontSize: "40@ms",
99+
fontWeight: "900"
100+
},
101+
switchWrapper: {
102+
flexDirection: "row",
103+
justifyContent: "center",
104+
alignItems: "center",
105+
margin: "20@vs"
106+
},
107+
text: {
108+
textAlign: "center",
109+
fontSize: "20@ms",
110+
fontWeight: "700",
111+
fontFamily: "Chalkboard SE",
112+
padding: "10@ms"
113+
},
114+
inputContainer: {
115+
alignSelf: "stretch",
116+
flexDirection: "row"
117+
},
118+
input: {
119+
flex: 1,
120+
fontSize: "16@ms",
121+
margin: "5@vs",
122+
borderWidth: 2,
123+
borderColor: "#123",
124+
paddingHorizontal: "3@vs"
125+
},
126+
btn: {
127+
alignSelf: "flex-end",
128+
margin: "5@vs",
129+
borderRadius: "5@ms0.3",
130+
backgroundColor: "#FF1654"
131+
},
132+
btnColor: {
133+
color: "white"
134+
}
135+
});
136+
137+
const regularStyles = StyleSheet.create({
138+
container: {
139+
flex: 1
140+
},
141+
header: {
142+
textAlign: "center",
143+
fontSize: 40,
144+
fontWeight: "900"
145+
},
146+
switchWrapper: {
147+
flexDirection: "row",
148+
justifyContent: "center",
149+
alignItems: "center",
150+
margin: 20
151+
},
152+
text: {
153+
textAlign: "center",
154+
fontSize: 20,
155+
fontWeight: "700",
156+
fontFamily: "Chalkboard SE",
157+
padding: 10
158+
},
159+
inputContainer: {
160+
alignSelf: "stretch",
161+
flexDirection: "row"
162+
},
163+
input: {
164+
flex: 1,
165+
margin: 5,
166+
borderWidth: 2,
167+
borderColor: "#123",
168+
paddingHorizontal: 3
169+
},
170+
btn: {
171+
alignSelf: "flex-end",
172+
margin: 5,
173+
borderRadius: 5,
174+
backgroundColor: "#FF1654"
175+
},
176+
btnColor: {
177+
color: "white"
178+
}
179+
});

App.test.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import React from 'react';
2+
import App from './App';
3+
4+
import renderer from 'react-test-renderer';
5+
6+
it('renders without crashing', () => {
7+
const rendered = renderer.create(<App />).toJSON();
8+
expect(rendered).toBeTruthy();
9+
});

README.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# react-native-tablets
2+
3+
Blog post can be found [here]()

app.json

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"expo": {
3+
"name": "React Native Tablets",
4+
"slug": "react-native-tablets",
5+
"sdkVersion": "26.0.0",
6+
"privacy": "public",
7+
"version": "1.0.0",
8+
"orientation": "portrait",
9+
"primaryColor": "#004284",
10+
"icon": "./assets/icon.png",
11+
"loading": {
12+
"icon": "./assets/icon.png",
13+
"backgroundColor": "#ffffff",
14+
"hideExponentText": true
15+
},
16+
"androidShowExponentNotificationInShellApp": false,
17+
"ios": {
18+
"supportsTablet": true,
19+
"buildNumber": "1"
20+
},
21+
"android": {
22+
"package": "com.deadcoder0904.reactnativetablets",
23+
"permissions": [],
24+
"versionCode": 1
25+
}
26+
}
27+
}

assets/fonts/ChalkboardSE-Bold.ttf

132 KB
Binary file not shown.

assets/fonts/Futura.ttf

49.3 KB
Binary file not shown.

assets/icon.png

10.9 KB
Loading

assets/videos/john-cena-meme.mp4

1.77 MB
Binary file not shown.

0 commit comments

Comments
 (0)