subchanges

.expo/packager-info.json

@@ -1,10 +1,10 @@
 {
   "devToolsPort": 19002,
-  "expoServerPort": 19000,
-  "packagerPort": 19001,
-  "packagerPid": 30450,
-  "expoServerNgrokUrl": "https://cs-k6v.iharshit009.ovuli.exp.direct",
-  "packagerNgrokUrl": "https://packager.cs-k6v.iharshit009.ovuli.exp.direct",
-  "ngrokPid": 30543,
-  "webpackServerPort": 19006
+  "expoServerPort": null,
+  "packagerPort": null,
+  "packagerPid": null,
+  "expoServerNgrokUrl": null,
+  "packagerNgrokUrl": null,
+  "ngrokPid": null,
+  "webpackServerPort": null
 }

App.js

@@ -64,8 +64,8 @@ export default function App() {
   return (
     <NavigationContainer>
       <Stack.Navigator>
-        <Stack.Screen name="Name" component={YourNameScreen} />
         <Stack.Screen name="AverageCycle" component={AvgCycleScreen} />
+        <Stack.Screen name="Name" component={YourNameScreen} />
         <Stack.Screen name="LastPeriod" component={LastPeriodScreen} />
         <Stack.Screen name="Tab" component={TabNavigator} />
       </Stack.Navigator>

app.json

@@ -8,6 +8,9 @@
     "sdkVersion": "36.0.0",
     "version": "1.0.0",
     "entryPoint": "node_modules/expo/AppEntry.js",
+    "splash": {
+      "image": "./src/assets/images/Ovuli.png"
+    },
     "platforms": [
       "ios",
       "android",

package.json

@@ -26,17 +26,18 @@
     "@react-navigation/stack": "^5.1.0",
     "expo": "~36.0.0",
     "moment": "^2.24.0",
-    "react-native-calendar": "^0.13.1",
-    "react-native-calendars": "^1.263.0",
     "react": "^16.9.0",
     "react-dom": "^16.9.0",
     "react-native": "^0.61.5",
+    "react-native-calendar": "^0.13.1",
+    "react-native-calendars": "^1.263.0",
     "react-native-gesture-handler": "^1.6.0",
     "react-native-reanimated": "^1.7.0",
     "react-native-safe-area-context": "^0.7.3",
     "react-native-screens": "^2.2.0",
     "react-native-unimodules": "~0.7.0",
-    "react-native-web": "~0.11.7"
+    "react-native-web": "~0.11.7",
+    "react-native-wheel-scroll-picker": "^0.2.4"
   },
   "devDependencies": {
     "@babel/core": "~7.6.0",

src/screens/ProfileScreen/AvgCycleScreen.js

@@ -1,23 +1,65 @@
 import 'react-native-gesture-handler';
 import React, { Component } from 'react';
-import { StyleSheet, Text, View, Image, TextInput } from 'react-native';
+import { StyleSheet, Text, View, Image, Picker, TextInput } from 'react-native';
 
 export default class AvgCycleScreen extends Component {
   constructor(props) {
     super(props);
-    this.state = { text: '' };
+    this.state = {
+      PickerSelection: 'NULL',
+    };
   }
   render() {
     return (
       <View style={styles.container}>
         <Text style={styles.welcome}>Enter your Average Cycle Period</Text>
-
         <TextInput
           style={{ height: 40 }}
           placeholder="Type here !"
           onChangeText={text => this.setState({ text })}
-          value={this.state.text}
+          value={this.state.PickerSelection}
         />
+
+        <Picker
+          style={styles.cont}
+          selectedValue={this.state.PickerSelection}
+          style={{ backgroundColor: '#FADBD8', height: 50, width: 250 }}
+          itemStyle={{ backgroundColor: '#FADBD8' }}
+          onValueChange={(itemValue, itemIndex) => this.setState({ PickerSelection: itemValue })}
+        >
+          <Picker.Item label="AVERAGE CYCLE DURATION" value="NULL" />
+          <Picker.Item label="10 days" value="10" />
+          <Picker.Item label="11 days" value="11" />
+          <Picker.Item label="12 days" value="12" />
+          <Picker.Item label="13 days" value="13" />
+          <Picker.Item label="14 days" value="14" />
+          <Picker.Item label="15 days" value="15" />
+          <Picker.Item label="16 days" value="16" />
+          <Picker.Item label="17 days" value="17" />
+          <Picker.Item label="18 days" value="18" />
+          <Picker.Item label="19 days" value="19" />
+          <Picker.Item label="20 days" value="20" />
+          <Picker.Item label="21 days" value="21" />
+          <Picker.Item label="22 days" value="22" />
+          <Picker.Item label="23 days" value="23" />
+          <Picker.Item label="24 days" value="24" />
+          <Picker.Item label="25 days" value="25" />
+          <Picker.Item label="26 days" value="26" />
+          <Picker.Item label="27 days" value="27" />
+          <Picker.Item label="28 days" value="28" />
+          <Picker.Item label="29 days" value="29" />
+          <Picker.Item label="30 days" value="30" />
+          <Picker.Item label="31 days" value="31" />
+          <Picker.Item label="32 days" value="32" />
+          <Picker.Item label="33 days" value="33" />
+          <Picker.Item label="34 days" value="34" />
+          <Picker.Item label="35 days" value="35" />
+          <Picker.Item label="36 days" value="36" />
+          <Picker.Item label="37 days" value="37" />
+          <Picker.Item label="38 days" value="38" />
+          <Picker.Item label="39 days" value="39" />
+          <Picker.Item label="40 days" value="40" />
+        </Picker>
       </View>
     );
   }
@@ -34,4 +76,10 @@ const styles = StyleSheet.create({
     fontSize: 20,
     textAlign: 'center',
   },
+  cont: {
+    fontSize: 20,
+    textAlign: 'center',
+    alignItems: 'center',
+    backgroundColor: '#FADBD8',
+  },
 });