nested scrollview done

Deepak-Sangle · Dec 13, 2023 · 4a8fb41 · 4a8fb41
1 parent bb5df4a
commit 4a8fb41
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 11 deletions.
diff --git a/mobile-client/App.js b/mobile-client/App.js
@@ -15,7 +15,7 @@ import {NavigationContainer} from '@react-navigation/native';
 import {createNativeStackNavigator} from '@react-navigation/native-stack';
 import {CardStyleInterpolators} from '@react-navigation/stack'
 import HomePage from './src/screens/HomePage';
-
+import { ScrollView , Text, View} from 'react-native';
 export default function App() {
 
   let [fontsLoaded, fontError] = useFonts({
@@ -52,4 +52,46 @@ export default function App() {
       </Stack.Navigator>
     </NavigationContainer>
   );
-}
+}
+
+// export default function App() {
+
+//   return(
+//    <ScrollView style={{ backgroundColor : "red", padding :10}}>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//     <ScrollView nestedScrollEnabled={true} style={{maxHeight : 500, backgroundColor : "green",}}>
+
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+
+//     </ScrollView>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//     <ScrollView nestedScrollEnabled={true} style={{maxHeight : 500, backgroundColor : "green",}}>
+
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+//         <Text style={{fontSize : 40, margin : 30}}>insied</Text>
+
+//     </ScrollView>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//     <Text style={{fontSize : 40, margin : 30}}>aeoufdhn</Text>
+//    </ScrollView> 
+//   )
+// }
diff --git a/mobile-client/src/screens/HomePage.js b/mobile-client/src/screens/HomePage.js
@@ -220,17 +220,16 @@ const HomePage = ({ route, navigation }) => {
                   {!openEvents[index] && <MaterialIcons name="expand-less" size={24} color="black" />}
                 </View>
               </TouchableOpacity>
-              {/* <ScrollView 
-                onTouchStart={()=> setScroll(false)}
-                onMomentumScrollEnd={() => setScroll(true)}
-                onScrollEndDrag={() => setScroll(true)}
-              > */}
-                <Animated.View style={{...styles.entryData, maxHeight}}>
+              <Animated.ScrollView 
+                nestedScrollEnabled={true}
+                style={{maxHeight}}
+              >
+                <View style={{...styles.entryData}}>
                     <Text style={styles.entryText} >
                       {entry.detail}
                     </Text>
-                </Animated.View>
-              {/* </ScrollView> */}
+                </View>
+              </Animated.ScrollView>
             </View>
           );
         })}

diff --git a/mobile-client/src/styles/home.js b/mobile-client/src/styles/home.js
@@ -73,7 +73,6 @@ const styles = StyleSheet.create({
   entryData: {
     marginHorizontal : 5,
     lineHeight: 1.5,
-    flex : 1,
   },
   mobileTopView: {
     display: "flex",