|
1 |
| -import * as React from 'react'; |
| 1 | +/** |
| 2 | + * Sample React Native App |
| 3 | + * https://github.com/facebook/react-native |
| 4 | + * |
| 5 | + * @format |
| 6 | + */ |
2 | 7 |
|
3 |
| -import { StyleSheet, Button, View, Text, TextInput, Platform } from 'react-native'; |
4 |
| -import { Apptentive, ApptentiveConfiguration } from 'apptentive-react-native'; |
| 8 | +import React from 'react'; |
| 9 | +import type {PropsWithChildren} from 'react'; |
| 10 | +import { |
| 11 | + SafeAreaView, |
| 12 | + ScrollView, |
| 13 | + StatusBar, |
| 14 | + StyleSheet, |
| 15 | + Text, |
| 16 | + useColorScheme, |
| 17 | + View, |
| 18 | + TextInput, |
| 19 | + Button |
| 20 | +} from 'react-native'; |
5 | 21 |
|
6 |
| -interface State { |
7 |
| - eventName: string; |
8 |
| -} |
| 22 | +import { |
| 23 | + Colors, |
| 24 | + DebugInstructions, |
| 25 | + Header, |
| 26 | + LearnMoreLinks, |
| 27 | + ReloadInstructions, |
| 28 | +} from 'react-native/Libraries/NewAppScreen'; |
| 29 | + |
| 30 | +import { |
| 31 | + Apptentive, |
| 32 | + ApptentiveConfiguration |
| 33 | +} from 'apptentive-react-native' |
| 34 | + |
| 35 | +type SectionProps = PropsWithChildren<{ |
| 36 | + title: string; |
| 37 | +}>; |
9 | 38 |
|
10 | 39 | // Set your Apptentive Dashboard Credentials
|
11 | 40 | const credentials = Platform.select({
|
@@ -68,10 +97,20 @@ export class App extends React.Component<{}, State> {
|
68 | 97 | }
|
69 | 98 |
|
70 | 99 | render() {
|
| 100 | + const backgroundStyle = { |
| 101 | + backgroundColor: Colors.lighter, |
| 102 | + }; |
| 103 | + |
71 | 104 | return (
|
72 |
| - <View style={styles.root}> |
73 |
| - <View style={styles.container}> |
74 |
| - |
| 105 | + <SafeAreaView style={backgroundStyle}> |
| 106 | + <StatusBar |
| 107 | + barStyle={'dark-content'} |
| 108 | + backgroundColor={backgroundStyle.backgroundColor} |
| 109 | + /> |
| 110 | + <ScrollView |
| 111 | + contentInsetAdjustmentBehavior="automatic" |
| 112 | + style={backgroundStyle}> |
| 113 | + <Header /> |
75 | 114 | {/* Test Events */}
|
76 | 115 | <View style={[styles.container, { flexDirection: "row" }]}>
|
77 | 116 | <TextInput
|
@@ -296,28 +335,29 @@ export class App extends React.Component<{}, State> {
|
296 | 335 | title="Type-Specific Custom Data"
|
297 | 336 | />
|
298 | 337 | </View>
|
299 |
| - |
300 |
| - </View> |
301 |
| - </View> |
| 338 | + </ScrollView> |
| 339 | + </SafeAreaView> |
302 | 340 | );
|
303 | 341 | }
|
304 | 342 | }
|
305 | 343 |
|
306 | 344 | const styles = StyleSheet.create({
|
307 |
| - root: { |
308 |
| - alignItems: 'center', |
309 |
| - alignSelf: 'center' |
| 345 | + sectionContainer: { |
| 346 | + marginTop: 32, |
| 347 | + paddingHorizontal: 24, |
310 | 348 | },
|
311 |
| - container: { |
312 |
| - flex: 1, |
313 |
| - alignItems: 'center', |
314 |
| - justifyContent: 'center', |
| 349 | + sectionTitle: { |
| 350 | + fontSize: 24, |
| 351 | + fontWeight: '600', |
| 352 | + }, |
| 353 | + sectionDescription: { |
| 354 | + marginTop: 8, |
| 355 | + fontSize: 18, |
| 356 | + fontWeight: '400', |
| 357 | + }, |
| 358 | + highlight: { |
| 359 | + fontWeight: '700', |
315 | 360 | },
|
316 |
| - textinput: { |
317 |
| - flex: 3, |
318 |
| - height: 40, |
319 |
| - backgroundColor: 'floralwhite', |
320 |
| - } |
321 | 361 | });
|
322 | 362 |
|
323 | 363 | export default App;
|
0 commit comments