mirror of
				https://gitlab.com/ceda_ei/sonzai.git
				synced 2025-11-04 09:00:05 +01:00 
			
		
		
		
	Add react-native-paper boilerplate
This commit is contained in:
		
							
								
								
									
										100
									
								
								App.js
									
									
									
									
									
								
							
							
						
						
									
										100
									
								
								App.js
									
									
									
									
									
								
							@@ -6,109 +6,13 @@
 | 
				
			|||||||
 * @flow
 | 
					 * @flow
 | 
				
			||||||
 */
 | 
					 */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import React from 'react';
 | 
					import React from "react";
 | 
				
			||||||
import {
 | 
					 | 
				
			||||||
  SafeAreaView,
 | 
					 | 
				
			||||||
  StyleSheet,
 | 
					 | 
				
			||||||
  ScrollView,
 | 
					 | 
				
			||||||
  View,
 | 
					 | 
				
			||||||
  Text,
 | 
					 | 
				
			||||||
  StatusBar,
 | 
					 | 
				
			||||||
} from 'react-native';
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
import {
 | 
					const App = () => {
 | 
				
			||||||
  Header,
 | 
					 | 
				
			||||||
  LearnMoreLinks,
 | 
					 | 
				
			||||||
  Colors,
 | 
					 | 
				
			||||||
  DebugInstructions,
 | 
					 | 
				
			||||||
  ReloadInstructions,
 | 
					 | 
				
			||||||
} from 'react-native/Libraries/NewAppScreen';
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
const App: () => React$Node = () => {
 | 
					 | 
				
			||||||
	return (
 | 
						return (
 | 
				
			||||||
		<>
 | 
							<>
 | 
				
			||||||
      <StatusBar barStyle="dark-content" />
 | 
					 | 
				
			||||||
      <SafeAreaView>
 | 
					 | 
				
			||||||
        <ScrollView
 | 
					 | 
				
			||||||
          contentInsetAdjustmentBehavior="automatic"
 | 
					 | 
				
			||||||
          style={styles.scrollView}>
 | 
					 | 
				
			||||||
          <Header />
 | 
					 | 
				
			||||||
          {global.HermesInternal == null ? null : (
 | 
					 | 
				
			||||||
            <View style={styles.engine}>
 | 
					 | 
				
			||||||
              <Text style={styles.footer}>Engine: Hermes</Text>
 | 
					 | 
				
			||||||
            </View>
 | 
					 | 
				
			||||||
          )}
 | 
					 | 
				
			||||||
          <View style={styles.body}>
 | 
					 | 
				
			||||||
            <View style={styles.sectionContainer}>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionTitle}>Step One</Text>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionDescription}>
 | 
					 | 
				
			||||||
                Edit <Text style={styles.highlight}>App.js</Text> to change this
 | 
					 | 
				
			||||||
                screen and then come back to see your edits.
 | 
					 | 
				
			||||||
              </Text>
 | 
					 | 
				
			||||||
            </View>
 | 
					 | 
				
			||||||
            <View style={styles.sectionContainer}>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionTitle}>See Your Changes</Text>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionDescription}>
 | 
					 | 
				
			||||||
                <ReloadInstructions />
 | 
					 | 
				
			||||||
              </Text>
 | 
					 | 
				
			||||||
            </View>
 | 
					 | 
				
			||||||
            <View style={styles.sectionContainer}>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionTitle}>Debug</Text>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionDescription}>
 | 
					 | 
				
			||||||
                <DebugInstructions />
 | 
					 | 
				
			||||||
              </Text>
 | 
					 | 
				
			||||||
            </View>
 | 
					 | 
				
			||||||
            <View style={styles.sectionContainer}>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionTitle}>Learn More</Text>
 | 
					 | 
				
			||||||
              <Text style={styles.sectionDescription}>
 | 
					 | 
				
			||||||
                Read the docs to discover what to do next:
 | 
					 | 
				
			||||||
              </Text>
 | 
					 | 
				
			||||||
            </View>
 | 
					 | 
				
			||||||
            <LearnMoreLinks />
 | 
					 | 
				
			||||||
          </View>
 | 
					 | 
				
			||||||
        </ScrollView>
 | 
					 | 
				
			||||||
      </SafeAreaView>
 | 
					 | 
				
			||||||
		</>
 | 
							</>
 | 
				
			||||||
	);
 | 
						);
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const styles = StyleSheet.create({
 | 
					 | 
				
			||||||
  scrollView: {
 | 
					 | 
				
			||||||
    backgroundColor: Colors.lighter,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  engine: {
 | 
					 | 
				
			||||||
    position: 'absolute',
 | 
					 | 
				
			||||||
    right: 0,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  body: {
 | 
					 | 
				
			||||||
    backgroundColor: Colors.white,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  sectionContainer: {
 | 
					 | 
				
			||||||
    marginTop: 32,
 | 
					 | 
				
			||||||
    paddingHorizontal: 24,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  sectionTitle: {
 | 
					 | 
				
			||||||
    fontSize: 24,
 | 
					 | 
				
			||||||
    fontWeight: '600',
 | 
					 | 
				
			||||||
    color: Colors.black,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  sectionDescription: {
 | 
					 | 
				
			||||||
    marginTop: 8,
 | 
					 | 
				
			||||||
    fontSize: 18,
 | 
					 | 
				
			||||||
    fontWeight: '400',
 | 
					 | 
				
			||||||
    color: Colors.dark,
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  highlight: {
 | 
					 | 
				
			||||||
    fontWeight: '700',
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  footer: {
 | 
					 | 
				
			||||||
    color: Colors.dark,
 | 
					 | 
				
			||||||
    fontSize: 12,
 | 
					 | 
				
			||||||
    fontWeight: '600',
 | 
					 | 
				
			||||||
    padding: 4,
 | 
					 | 
				
			||||||
    paddingRight: 12,
 | 
					 | 
				
			||||||
    textAlign: 'right',
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
});
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
export default App;
 | 
					export default App;
 | 
				
			||||||
 
 | 
				
			|||||||
							
								
								
									
										18
									
								
								index.js
									
									
									
									
									
								
							
							
						
						
									
										18
									
								
								index.js
									
									
									
									
									
								
							@@ -2,8 +2,18 @@
 | 
				
			|||||||
 * @format
 | 
					 * @format
 | 
				
			||||||
 */
 | 
					 */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import {AppRegistry} from 'react-native';
 | 
					import React from "react";
 | 
				
			||||||
import App from './App';
 | 
					import {AppRegistry} from "react-native";
 | 
				
			||||||
import {name as appName} from './app.json';
 | 
					import App from "./App";
 | 
				
			||||||
 | 
					import {name as appName} from "./app.json";
 | 
				
			||||||
 | 
					import { Provider } from "react-native-paper";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
AppRegistry.registerComponent(appName, () => App);
 | 
					export default function Main() {
 | 
				
			||||||
 | 
						return (
 | 
				
			||||||
 | 
							<Provider>
 | 
				
			||||||
 | 
								<App />
 | 
				
			||||||
 | 
							</Provider>
 | 
				
			||||||
 | 
						);
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					AppRegistry.registerComponent(appName, () => Main);
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user