Scroll View isn't scrolling

In my code, I'm rendering each card in a Scroll View so that the complete profile can be swiped, as is the case in Bumble. However, the scroll view isn't working as expected. It scrolls only when I use the roller of my mouse or when I'm long touching a pressable on screen.
<Swiper
        ref={swipeRef}
        containerStyle={{backgroundColor: colors.white}}
        cards={DummyData}
        stackSize={1}
        stackSeparation={20}
        onSwipedRight = {() => {
          console.log('Swiped Right');
        }}
        onSwipedLeft = {() => {
          console.log('Swiped Left');
        }}
        stackAnimationFriction={15}
        stackAnimationTension={100}
        animateOverlayLabelsOpacity={true}
        stackScale={5}
        cardIndex={0}
        animateCardOpacity = {false}
        verticalSwipe={false}
        renderCard={(card) => card ? ( 
          <View style={{flex: 1}}>
            <ScrollView style={[styles.card, styles.cardShadow, {flexGrow: 1}]} key={card.id}>
            <Image style={styles.cardImage} source={{uri: card.photoURL1}}/>
            <View style={[styles.box]}> 
              <View>
                <Text style={[fontStyles.heading3, {color: colors.black}]}>{card.name}, {card.age}</Text>
                <View style={{flexDirection: 'row', marginTop: screenHeight*0.01}}>
                  <Image style={{resizeMode: 'contain', height: 20, width: 20}} source={require('../../../assets/images/location.png')}/>
                  <Text style={[fontStyles.text1, {color: colors.black, marginLeft: 10}]}>{card.location}</Text>
                </View>
                <View style={{flexDirection: 'row', marginTop: screenHeight*0.01}}>
                  <Image style={{resizeMode: 'contain', height: 25, width: 20}} source={require('../../../assets/images/job.png')}/>
                  <Text style={[fontStyles.text1, {color: colors.black, marginLeft: 10}]}>{card.job}</Text>
                </View>
              </View>
              <Pressable onPress={superLike}>
                <Image style={{resizeMode: 'contain', height: 60, width: 60, marginTop: -5}} source={require('../../../assets/images/SuperLike.png')}/>
              </Pressable>
            </View>
            <Image style={[styles.cardImage, {marginTop: screenHeight*0.02, marginBottom: screenHeight*0.02}]} source={{uri: card.photoURL2}}/>
            <Text style={[fontStyles.heading3, {color: colors.secondaryButtons, margin: screenWidth*0.03}]}>{Editing.about}</Text>
            <Text style={[fontStyles.text1, {color: colors.black, marginLeft: screenWidth*0.03, marginRight: screenWidth*0.03}]}>{card.aboutMe}</Text> 
            <Text style={[fontStyles.heading3, {color: colors.secondaryButtons, margin: screenWidth*0.03}]}>{Editing.moreAbout}</Text>
            <Text style={[fontStyles.text1, {color: colors.black, marginLeft: screenWidth*0.03, marginRight: screenWidth*0.03, marginBottom: screenHeight*0.02}]}>{card.moreAboutMe}</Text>
            <Image style={[styles.cardImage, {marginTop: screenHeight*0.02, marginBottom: screenHeight*0.1}]} source={{uri: card.photoURL2}}/>    
            <View style={{flexDirection: 'row', justifyContent: 'space-evenly', marginTop: 10, marginBottom: screenHeight*0.125}}>
              <TouchableOpacity onPress={() => swipeRef.current.swipeLeft()}>
                <Image style={{resizeMode: 'contain', height: 60, width: 60, marginTop: 5}} source ={require('../../../assets/images/LeftSwipe.png')}/>
              </TouchableOpacity>
              <TouchableOpacity onPress={() => swipeRef.current.swipeTop()}>
                <Image style={{resizeMode: 'contain', height: 60, width: 60, marginTop: -15}} source ={require('../../../assets/images/SuperLike.png')}/>
              </TouchableOpacity>
              <TouchableOpacity onPress={() => swipeRef.current.swipeRight()}>
                <Image style={{resizeMode: 'contain', height: 60, width: 60, marginTop: 5}} source ={require('../../../assets/images/RightSwipe.png')}/>
              </TouchableOpacity>
            </View>
            </ScrollView>
          </View>
webraptor / react-native-deck-swiper

Scroll View isn't scrolling #93
