diff --git a/squarenotsquare/src/components/ScrollingPicker.js b/squarenotsquare/src/components/ScrollingPicker.js
index 8ce4292..9a929ad 100644
--- a/squarenotsquare/src/components/ScrollingPicker.js
+++ b/squarenotsquare/src/components/ScrollingPicker.js
@@ -8,16 +8,17 @@ import Icons from '../themes/Icons';
import Colors from "../themes/Colors";
import Metrics from "../themes/Metrics";
import { styles } from "../screens/styles/AppStyles";
+import finalPropsSelectorFactory from "react-redux/es/connect/selectorFactory";
-function ScrollingPicker() {
+function ScrollingPicker(props) {
const scrollX = useRef(new Animated.Value(0)).current;
const [selected, setSelected] = useState(0);
function onScroll(event){
if (event.nativeEvent.contentOffset.x === 0) {
- setSelected(0);
+ props.modeSetter(0);
} else if (event.nativeEvent.contentOffset.x === (Metrics.icons.buttonIcon * 2)) {
- setSelected(1);
+ props.modeSetter(1);
}
Animated.event([
{
@@ -43,13 +44,13 @@ function ScrollingPicker() {
name={Icons.squareIcons.square}
color={Colors.material.dark}
size={Metrics.icons.buttonIcon}
- style={{marginLeft: Metrics.icons.buttonIcon * 0.5, marginRight: Metrics.icons.buttonIcon * 0.5}}
+ style={styles.modePickerMargin}
/>
);
diff --git a/squarenotsquare/src/screens/Home.js b/squarenotsquare/src/screens/Home.js
index 0a1bb49..ce905eb 100644
--- a/squarenotsquare/src/screens/Home.js
+++ b/squarenotsquare/src/screens/Home.js
@@ -1,4 +1,4 @@
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
import { BackHandler, SafeAreaView, Text, TouchableOpacity, View } from "react-native";
import { styles } from './styles/AppStyles';
import MaterialIcon from 'react-native-vector-icons/MaterialCommunityIcons';
@@ -13,6 +13,7 @@ import ModePicker from '../components/ScrollingPicker';
function Home(){
const dispatch = useDispatch();
+ const [mode, setMode] = useState(0);
useEffect(() => {
BackHandler.addEventListener('hardwareBackPress', () => {return true});
@@ -50,7 +51,10 @@ function Home(){
-
+
+
+ {mode === 0 ? 'Squares' : 'Addition'}
+
diff --git a/squarenotsquare/src/screens/styles/AppStyles.js b/squarenotsquare/src/screens/styles/AppStyles.js
index 031953c..2953771 100644
--- a/squarenotsquare/src/screens/styles/AppStyles.js
+++ b/squarenotsquare/src/screens/styles/AppStyles.js
@@ -85,6 +85,10 @@ export const styles = StyleSheet.create({
marginBottom: Metrics.margins.buttonMargin,
marginTop: Metrics.margins.buttonMargin
},
+ modePickerMargin: {
+ marginLeft: Metrics.icons.buttonIcon * 0.5,
+ marginRight: Metrics.icons.buttonIcon * 0.5
+ },
footer: {
margin: Metrics.margins.default,