Merge pull request #11 from IICMenoringETCEPro/ayan/dev

documentation update

README.md

@@ -1,4 +1,23 @@
-# qmonitorapp
+[![GitHub license](https://img.shields.io/github/license/IICMenoringETCEPro/qmonitorapp.svg?logo=github)](https://github.com/IICMenoringETCEPro/qmonitorapp/blob/main/LICENSE)
+[![GitHub top language](https://img.shields.io/github/languages/top/IICMenoringETCEPro/qmonitorapp?color=yellow&logo=javascript)](https://github.com/IICMenoringETCEPro/qmonitorapp)
+# QMonitor (The Quarantine Monitor Application)
+
+
+#### This project is selected for the mentorship guidance from IIC MHRD in IIC Innovation Contest 2020.
+
+---
+> ## :mask: [COVID-19](http://corona-cases-india.netlify.com/) | Stay Home, Stay Safe! :house:  <br> :mag_right: Checkout [this](http://corona-cases-india.netlify.com/) web app for live CORONA updates.
+
+> ## :bar_chart: Checkout the [COVID-19 Tacker :mask: | INDIA](https://indiafightscorona.netlify.app/) :india:
+---
+
+## Getting Started
+
+[![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/IICMenoringETCEPro/qmonitorapp?logo=github)](https://github.com/IICMenoringETCEPro/qmonitorapp) [![GitHub commit activity](https://img.shields.io/github/commit-activity/m/IICMenoringETCEPro/qmonitorapp?color=bluevoilet&logo=github)](https://github.com/IICMenoringETCEPro/qmonitorapp/commits/) [![GitHub repo size](https://img.shields.io/github/repo-size/IICMenoringETCEPro/qmonitorapp?logo=github)](https://github.com/IICMenoringETCEPro/qmonitorapp)
+
+
+### For Testing and developing follow this
+
 1. First clone the repo
 2. run ```yarn``` from inside the repo
 3. set ```local.properties``` file inside android folder

package.json

@@ -32,11 +32,13 @@
     "react-native-onboarding-swiper": "^1.1.4",
     "react-native-paper": "^4.3.1",
     "react-native-push-notification": "^6.1.3",
+    "react-native-qrcode-svg": "^6.0.6",
     "react-native-really-awesome-button": "^1.6.0",
     "react-native-reanimated": "^1.13.1",
     "react-native-safe-area-context": "^3.1.9",
     "react-native-screens": "^2.14.0",
     "react-native-share": "^4.1.0",
+    "react-native-svg": "^12.1.0",
     "react-native-unimodules": "~0.11.0",
     "react-native-web": "~0.13.12",
     "reanimated-bottom-sheet": "^1.0.0-alpha.22"

src/navigation/AppStack.js

@@ -13,7 +13,8 @@ import {
   EditProfileScreen,
   ScanScreen,
   ShareCodeScreen,
-  SafetyMeasuresScreen
+  SafetyMeasuresScreen,
+  DetailsScreen
 } from '../screens';
 
 
@@ -96,6 +97,23 @@ const HomeStack = ({ navigation }) => (
         }
       }}
     />
+    <Stack.Screen
+      name="Details"
+      component={DetailsScreen}
+      options={{
+        title: 'Some Infographics',
+        headerTitleAlign: 'center',
+        headerTitleStyle: {
+          color: '#2e64e5',
+          fontFamily: 'Kufam-SemiBoldItalic',
+          fontSize: 18
+        },
+        headerStyle: {
+          shadowColor: '#fff',
+          elevation: 0,
+        }
+      }}
+    />
   </Stack.Navigator>
 );
 

src/screens/DetailsScreen/DetailsScreen.js

@@ -0,0 +1,27 @@
+import React ,{useContext} from 'react';
+import {
+    View,
+    Text
+} from 'react-native';
+
+
+
+import styles from './styles';
+
+
+
+export default function DetailsScreen({ navigation }) {
+
+
+
+
+    return (
+        <View style={styles.container}>
+            <Text>This is DetailsScreen</Text>
+
+        </View>
+    );
+
+
+
+}

src/screens/DetailsScreen/styles.js

@@ -0,0 +1,11 @@
+import { StyleSheet, Dimensions } from 'react-native';
+
+export default StyleSheet.create({
+    container: {
+        backgroundColor: '#f9fafd',
+        flex: 1,
+        justifyContent: 'center',
+        alignItems: 'center',
+        padding: 20,
+      }
+})

src/screens/HomeScreen/HomeScreen.js

@@ -83,9 +83,14 @@ export default function HomeScreen({ navigation }) {
                     <Block justifyContent="space-between" direction="row">
                         <Block>
                             <TextView h6>Case Update</TextView>
-                            <TextView>Newest update { moment().format("MMM Do YY") }</TextView>
+                            <TextView>Newest update {moment().format("MMM Do YY")}</TextView>
                         </Block>
-                        <Button textColor={color.blue1}>See details</Button>
+                        <Button
+                            textColor={color.blue1}
+                            onPress={() => navigation.navigate('Details')}
+                        >
+                            See details
+                        </Button>
                     </Block>
                     <Block
                         color="#fff"

src/screens/ShareCodeScreen/ShareCodeScreen.js

@@ -1,12 +1,11 @@
-import React ,{useContext} from 'react';
-import {
-    View,
-    Text
-} from 'react-native';
-
-
+import React, { useContext } from 'react';
+import { Image, ScrollView, View } from 'react-native';
+import QRCode from 'react-native-qrcode-svg';
 
+import { Block, Button, TextView } from '../../components/covidui';
 import styles from './styles';
+import { color } from '../../utils/color';
+import FormButton from '../../components/FormButton';
 
 
 
@@ -16,10 +15,49 @@ export default function ShareCodeScreen({ navigation }) {
 
 
     return (
-        <View style={styles.container}>
-            <Text>This is ShareCodeScreen</Text>
+        <ScrollView style={{ flex: 1 }}>
+            <Block block color="#fafafa" height={300}>
+                <Block height={300} color={color.blue} style={styles.bg}>
+                    <Block style={styles.wrapperimage}>
+                        <Image
+                            style={styles.doctor}
+                            source={require('../../../assets/images-covidui/coronadr.png')}
+                        />
+                    </Block>
+                </Block>
+                <Block style={styles.containerHeader}>
+                    <Image style={styles.img} source={require('../../../assets/images-covidui/virus.png')} />
+                </Block>
+
+            </Block>
+
+            <Block padding={10} color={'white'}>
+                <View style={styles.qrcodeContainer}>
+                    <TextView h6>Share your code to make group</TextView>
+                    <View style={{ marginTop: 20, marginBottom: 10 }}>
+                        <QRCode
+                            value="http://awesome.link.qr"
+                            size={200}
+                        />
+
+                    </View>
+                </View>
+            </Block>
+            <Block padding={10} color={'white'}>
+                <View style={{height:200,marginTop:20}}>
+                    <FormButton
+                        buttonTitle="Share with your Friends"
+                        onPress={() => console.log('share button pressed')}
+                    />
+
+                </View>
+
+            </Block>
+
+
+
 
-        </View>
+        </ScrollView>
     );
 
 

src/screens/ShareCodeScreen/styles.js

@@ -1,11 +1,76 @@
 import { StyleSheet, Dimensions } from 'react-native';
 
 export default StyleSheet.create({
-    container: {
-        backgroundColor: '#f9fafd',
-        flex: 1,
-        justifyContent: 'center',
-        alignItems: 'center',
-        padding: 20,
-      }
+  container: {
+    backgroundColor: '#f9fafd',
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: 20,
+  },
+  img: {
+    width: '100%',
+    height: 300,
+  },
+  doctor: {
+    position: 'absolute',
+    top: 100,
+    left: -30,
+
+    // width: 50,
+    // height: 80,
+  },
+  wrapperimage: {
+    position: 'absolute',
+    bottom: 0,
+
+    alignSelf: 'center',
+    width: Dimensions.get('window').width,
+    height: 300,
+  },
+  bg: {
+    position: 'absolute',
+    width: 1000,
+    height: 1000,
+    top: -(930 - Dimensions.get('window').width / 2),
+    alignSelf: 'center',
+    // top: 500 - Dimensions.get('window').width / 2,
+    // left: 500 - Dimensions.get('window').width / 2,
+    borderRadius: 1000,
+    overflow: 'hidden',
+  },
+  containerHeader: {
+    position: 'relative',
+  },
+  map: {
+    borderRadius: 8,
+    marginTop: 15,
+    padding: 15,
+  },
+
+  img_item: {
+    width: (1.2 * Dimensions.get('window').width) / 3,
+    height: (1.2 * Dimensions.get('window').width) / 3,
+  },
+  field_con: {
+    // marginLeft: Dimensions.get('window').width / 2,
+    position: 'absolute',
+    width: (2 * Dimensions.get('window').width) / 3,
+    left: Dimensions.get('window').width / 3 + 10,
+    top: 10,
+    paddingVertical: 10,
+  },
+  textDesc: {
+    lineHeight: 20,
+    marginTop: 10,
+    maxWidth: (2 * Dimensions.get('window').width) / 3.4,
+  },
+  btn: {
+    position: 'absolute',
+    bottom: 10,
+    right: 10,
+  },
+  qrcodeContainer:{
+    alignItems:"center"
+  }
 })

src/screens/index.js

@@ -9,4 +9,5 @@ export { default as GroupScreen } from './GroupScreen/GroupScreen';
 export { default as EditProfileScreen } from './EditProfileScreen/EditProfileScreen';
 export { default as ScanScreen } from './ScanScreen/ScanScreen';
 export { default as ShareCodeScreen } from './ShareCodeScreen/ShareCodeScreen';
-export { default as SafetyMeasuresScreen } from './SafetyMeasuresScreen/SafetyMeasuresScreen';
+export { default as SafetyMeasuresScreen } from './SafetyMeasuresScreen/SafetyMeasuresScreen';
+export { default as DetailsScreen } from './DetailsScreen/DetailsScreen';