Change ReadActivity

db58b364 · Lihinikaduwa D.N.R. · 90beda59 · db58b364 · db58b364 · db58b364
Commit db58b364 authored Jan 08, 2022 by Lihinikaduwa D.N.R.
7 changed files
--- a/.idea/misc.xml
+++ b/.idea/misc.xml
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
-  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.9" project-jdk-type="Python SDK" />
+  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.8" project-jdk-type="Python SDK" />
 </project>
\ No newline at end of file
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -15,6 +15,7 @@
        "native-base": "^3.2.2",
        "react": "17.0.2",
        "react-native": "0.66.2",
+        "react-native-elements": "^3.4.2",
        "react-native-fontawesome": "^7.0.0",
        "react-native-gesture-handler": "^1.10.3",
        "react-native-orientation-locker": "^1.4.0",
@@ -4492,6 +4493,43 @@
      "integrity": "sha512-Fo79ojj3vdEZOHg3wR9ksAMRz4P3S5fDB5e/YWZiFnyFQI1WY2Vftu9XoXVVtJfxB7Bpce/QTqWSSntkz2Znrw==",
      "dev": true
    },
+    "node_modules/@types/prop-types": {
+      "version": "15.7.4",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
+      "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+    },
+    "node_modules/@types/react": {
+      "version": "17.0.38",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz",
+      "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==",
+      "dependencies": {
+        "@types/prop-types": "*",
+        "@types/scheduler": "*",
+        "csstype": "^3.0.2"
+      }
+    },
+    "node_modules/@types/react-native": {
+      "version": "0.66.11",
+      "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.66.11.tgz",
+      "integrity": "sha512-DFuNMhRuyKMbJrI/s3rIuM5io+tIOK4Iq9oMzatWX5bIgfjZM86X1aA/epE0ipw1aFaoHKermK3fLG1bqFzzDQ==",
+      "dependencies": {
+        "@types/react": "*"
+      }
+    },
+    "node_modules/@types/react-native-vector-icons": {
+      "version": "6.4.10",
+      "resolved": "https://registry.npmjs.org/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.10.tgz",
+      "integrity": "sha512-z4sexbuZ7nmYsp7Z9YB5fSQoN3KFn6nZA3QsCkQLOYnVmVlxX4U22v/bM9Xx/6dOA1vClxoRZo2CFDX16uryXQ==",
+      "dependencies": {
+        "@types/react": "*",
+        "@types/react-native": "*"
+      }
+    },
+    "node_modules/@types/scheduler": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
+      "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
+    },
    "node_modules/@types/stack-utils": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz",
@@ -6149,7 +6187,6 @@
      "version": "4.2.2",
      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
      "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
-      "dev": true,
      "engines": {
        "node": ">=0.10.0"
      }
@@ -12045,6 +12082,14 @@
        "node": ">=4"
      }
    },
+    "node_modules/opencollective-postinstall": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
+      "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==",
+      "bin": {
+        "opencollective-postinstall": "index.js"
+      }
+    },
    "node_modules/optionator": {
      "version": "0.9.1",
      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz",
@@ -12617,6 +12662,26 @@
        "nullthrows": "^1.1.1"
      }
    },
+    "node_modules/react-native-elements": {
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.4.2.tgz",
+      "integrity": "sha512-m0eAWOn7JuR1wNTNY0WHuaqst4LI/gFE4N5Bbyfsc4DiryWsMST7aAg5w/Gos4IexWIzhLKCIkPxthND1m/8Xg==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "@types/react-native-vector-icons": "^6.4.6",
+        "color": "^3.1.2",
+        "deepmerge": "^4.2.2",
+        "hoist-non-react-statics": "^3.3.2",
+        "lodash.isequal": "^4.5.0",
+        "opencollective-postinstall": "^2.0.3",
+        "react-native-ratings": "8.0.4",
+        "react-native-size-matters": "^0.3.1"
+      },
+      "peerDependencies": {
+        "react-native-safe-area-context": "^3.1.9",
+        "react-native-vector-icons": ">7.0.0"
+      }
+    },
    "node_modules/react-native-fontawesome": {
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/react-native-fontawesome/-/react-native-fontawesome-7.0.0.tgz",
@@ -12644,6 +12709,18 @@
        "react-native-windows": ">=0.63.3"
      }
    },
+    "node_modules/react-native-ratings": {
+      "version": "8.0.4",
+      "resolved": "https://registry.npmjs.org/react-native-ratings/-/react-native-ratings-8.0.4.tgz",
+      "integrity": "sha512-Xczu5lskIIRD6BEdz9A0jDRpEck/SFxRqiglkXi0u67yAtI1/pcJC76P4MukCbT8K4BPVl+42w83YqXBoBRl7A==",
+      "dependencies": {
+        "lodash": "^4.17.15"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-reanimated": {
      "version": "2.2.4",
      "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.2.4.tgz",
@@ -12682,6 +12759,14 @@
        "react-native": "*"
      }
    },
+    "node_modules/react-native-size-matters": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/react-native-size-matters/-/react-native-size-matters-0.3.1.tgz",
+      "integrity": "sha512-mKOfBLIBFBcs9br1rlZDvxD5+mAl8Gfr5CounwJtxI6Z82rGrMO+Kgl9EIg3RMVf3G855a85YVqHJL2f5EDRlw==",
+      "peerDependencies": {
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-vector-icons": {
      "version": "9.0.0",
      "resolved": "https://registry.npmjs.org/react-native-vector-icons/-/react-native-vector-icons-9.0.0.tgz",
@@ -18959,6 +19044,43 @@
      "integrity": "sha512-Fo79ojj3vdEZOHg3wR9ksAMRz4P3S5fDB5e/YWZiFnyFQI1WY2Vftu9XoXVVtJfxB7Bpce/QTqWSSntkz2Znrw==",
      "dev": true
    },
+    "@types/prop-types": {
+      "version": "15.7.4",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
+      "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+    },
+    "@types/react": {
+      "version": "17.0.38",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz",
+      "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==",
+      "requires": {
+        "@types/prop-types": "*",
+        "@types/scheduler": "*",
+        "csstype": "^3.0.2"
+      }
+    },
+    "@types/react-native": {
+      "version": "0.66.11",
+      "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.66.11.tgz",
+      "integrity": "sha512-DFuNMhRuyKMbJrI/s3rIuM5io+tIOK4Iq9oMzatWX5bIgfjZM86X1aA/epE0ipw1aFaoHKermK3fLG1bqFzzDQ==",
+      "requires": {
+        "@types/react": "*"
+      }
+    },
+    "@types/react-native-vector-icons": {
+      "version": "6.4.10",
+      "resolved": "https://registry.npmjs.org/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.10.tgz",
+      "integrity": "sha512-z4sexbuZ7nmYsp7Z9YB5fSQoN3KFn6nZA3QsCkQLOYnVmVlxX4U22v/bM9Xx/6dOA1vClxoRZo2CFDX16uryXQ==",
+      "requires": {
+        "@types/react": "*",
+        "@types/react-native": "*"
+      }
+    },
+    "@types/scheduler": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
+      "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
+    },
    "@types/stack-utils": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz",
@@ -20258,8 +20380,7 @@
    "deepmerge": {
      "version": "4.2.2",
      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
-      "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
-      "dev": true
+      "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
    },
    "defaults": {
      "version": "1.0.3",
@@ -24822,6 +24943,11 @@
        }
      }
    },
+    "opencollective-postinstall": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
+      "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q=="
+    },
    "optionator": {
      "version": "0.9.1",
      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz",
@@ -25260,6 +25386,21 @@
        "nullthrows": "^1.1.1"
      }
    },
+    "react-native-elements": {
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.4.2.tgz",
+      "integrity": "sha512-m0eAWOn7JuR1wNTNY0WHuaqst4LI/gFE4N5Bbyfsc4DiryWsMST7aAg5w/Gos4IexWIzhLKCIkPxthND1m/8Xg==",
+      "requires": {
+        "@types/react-native-vector-icons": "^6.4.6",
+        "color": "^3.1.2",
+        "deepmerge": "^4.2.2",
+        "hoist-non-react-statics": "^3.3.2",
+        "lodash.isequal": "^4.5.0",
+        "opencollective-postinstall": "^2.0.3",
+        "react-native-ratings": "8.0.4",
+        "react-native-size-matters": "^0.3.1"
+      }
+    },
    "react-native-fontawesome": {
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/react-native-fontawesome/-/react-native-fontawesome-7.0.0.tgz",
@@ -25283,6 +25424,14 @@
      "integrity": "sha512-O/Ki7uw1lltKiTZLcTuLcSh4EzLFqXKKo2J4cLKvyG52YiEawbn/ipsZriZlWzK0mhX4dSe79CoRS4IsyUs1fw==",
      "requires": {}
    },
+    "react-native-ratings": {
+      "version": "8.0.4",
+      "resolved": "https://registry.npmjs.org/react-native-ratings/-/react-native-ratings-8.0.4.tgz",
+      "integrity": "sha512-Xczu5lskIIRD6BEdz9A0jDRpEck/SFxRqiglkXi0u67yAtI1/pcJC76P4MukCbT8K4BPVl+42w83YqXBoBRl7A==",
+      "requires": {
+        "lodash": "^4.17.15"
+      }
+    },
    "react-native-reanimated": {
      "version": "2.2.4",
      "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.2.4.tgz",
@@ -25309,6 +25458,12 @@
        "warn-once": "^0.1.0"
      }
    },
+    "react-native-size-matters": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/react-native-size-matters/-/react-native-size-matters-0.3.1.tgz",
+      "integrity": "sha512-mKOfBLIBFBcs9br1rlZDvxD5+mAl8Gfr5CounwJtxI6Z82rGrMO+Kgl9EIg3RMVf3G855a85YVqHJL2f5EDRlw==",
+      "requires": {}
+    },
    "react-native-vector-icons": {
      "version": "9.0.0",
      "resolved": "https://registry.npmjs.org/react-native-vector-icons/-/react-native-vector-icons-9.0.0.tgz",
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -17,6 +17,7 @@
    "native-base": "^3.2.2",
    "react": "17.0.2",
    "react-native": "0.66.2",
+    "react-native-elements": "^3.4.2",
    "react-native-fontawesome": "^7.0.0",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-orientation-locker": "^1.4.0",

--- a/frontend/src/assets/read/background4.jpg
+++ b/frontend/src/assets/read/background4.jpg
--- a/frontend/src/screen/Read.js
+++ b/frontend/src/screen/Read.js
@@ -20,14 +20,25 @@ import ImageButton from '../component/ImageButton';
 import ButtonView from '../component/buttonView';

 // const {width,height} = Dimensions.get('screen');
-const webUrel = 'http://192.168.8.101:5000/ru';
+const webUrel = 'http://127.0.0.1:5000/reading';

 export default function Read() {
-  const [names, setNames] = useState([]);
+  const [activity, setActivity] = useState([]);

  const navigation = useNavigation();

+  function getColorActivities() {
+    axios
+      .get(webUrel)
+      .then(response => {
+        setActivity(response.data);
+        console.log('response.data');
+      })
+      .catch(err => {});
+  }
+
  React.useEffect(() => {
+    getColorActivities();
    const unsubscribe = navigation.addListener('focus', () => {
      // The screen is focused
      // Call any action
@@ -52,6 +63,10 @@ export default function Read() {
          </View>
        </View>

+        {/* {activity.map((data, index) => {
+          return <ButtonView title={data.round} color="#00008B" />;
+        })} */}
+
        <ButtonView title="First Round" color="#00008B"></ButtonView>
        <ButtonView title="Second Round" color="#00008B"></ButtonView>
        <ButtonView title="Third Round" color="#00008B"></ButtonView>

--- a/frontend/src/screen/activity/readActivity.js
+++ b/frontend/src/screen/activity/readActivity.js
@@ -35,7 +35,7 @@ export default function ReadActivity() {
          source={require('../../assets/read/background2.jpeg')}>
          <View>
            <View style={styles.textBody}>
-              <Text style={styles.text}>Say the name of this color?</Text>
+              <Text style={styles.text}>Pronounce this Word!</Text>
            </View>

            <Image
@@ -93,7 +93,7 @@ const styles = StyleSheet.create({
  textBody: {
    marginTop: 150,
    marginLeft: 95,
-    backgroundColor: '#1DCE92',
+    backgroundColor: '#00008B',
    width: 200,
    borderRadius: 50,
    padding: 5,

--- a/frontend/src/screen/home.js
+++ b/frontend/src/screen/home.js
@@ -10,57 +10,54 @@ export default function Home({ navigation }){

    return (
      <SafeAreaView>
-      <ScrollView>
-        <View style={styles.imageContainer}>
-          <View style={styles.imageView}>
-            <Image
-              style={styles.image}
-              source={require('../assets/color/background.png')}
-              resizeMode="contain"></Image>
-            <ImageButton path="Color" title="Color Activity" />
+        <ScrollView>
+          <View style={styles.imageContainer}>
+            <View style={styles.imageView}>
+              <Image
+                style={styles.image}
+                source={require('../assets/color/background.png')}
+                resizeMode="contain"></Image>
+              <ImageButton path="Color" title="Color Activity" />
+            </View>
+            <View style={styles.imageView}>
+              <Image
+                style={styles.image}
+                source={require('../assets/read/background4.jpg')}
+                resizeMode="contain"></Image>
+              <ImageButton path="Read" title="Read Activity" />
+            </View>
          </View>
-          <View style={styles.imageView}>
-            <Image
-              style={styles.image}
-              source={require('../assets/color/background.png')}
-              resizeMode="contain"></Image>
-            <ImageButton path="Read" title="Read Activity" />
+          <View style={styles.imageContainer}>
+            <View style={styles.imageView}>
+              <Image
+                style={styles.image}
+                source={require('../assets/color/background.png')}
+                resizeMode="contain"></Image>
+              <ImageButton path="Progress" title="Progress Chack" />
+            </View>
          </View>
-        </View>
-        <View style={styles.imageContainer}>
-          <View style={styles.imageView}>
-            <Image
-              style={styles.image}
-              source={require('../assets/color/background.png')}
-              resizeMode="contain"></Image>
-            <ImageButton path="Progress" title="Progress Chack" />
-          </View>
-        </View>
-      </ScrollView>
-    </SafeAreaView>
+        </ScrollView>
+      </SafeAreaView>
    );

 }

 const styles = StyleSheet.create({
-
-    imageContainer:{
-        flexDirection: "row",
-        marginTop: 70,
-    },
-    imageView: {
-        width: 180,
-        height: 300,
-        // borderWidth:1,
-        // borderColor: "#000",
-        marginHorizontal: 15,
-        borderRadius: 50
-    },
-    image: {
-        width: "100%",
-        height: "100%",
-        borderRadius: 50
-    },
-    
-
-})
\ No newline at end of file
+  imageContainer: {
+    flexDirection: 'row',
+    marginTop: 70,
+  },
+  imageView: {
+    width: 180,
+    height: 300,
+    // borderWidth:1,
+    // borderColor: "#000",
+    marginHorizontal: 15,
+    borderRadius: 50,
+  },
+  image: {
+    width: '100%',
+    height: '100%',
+    borderRadius: 50,
+  },
+});
\ No newline at end of file