react-native android嵌套滚动视图和列表视图不相互传递控制

Question

在 react-native android 中，当我们嵌套了滚动视图和列表视图时，控件不会从滚动视图传递到列表视图，反之亦然..

https://www.youtube.com/watch?v=oC2iHhw3Ddk 这是我试图在视频剪辑中实现的交互的链接。所以，我使用滚动视图作为父滚动和列表视图作为子滚动..滚动视图应该有控制权，直到列表视图没有到达顶部，当列表视图到达顶部时它应该有控制权，并且视图应该粘在顶部。我试图将它作为列表视图标题的一部分，但我想要实现的粘性不起作用。此外，我尝试在父滚动视图上使用 onScroll，当它达到特定值时，我想禁用它并启用列表视图滚动。为此，我尝试将 onStartShouldSetResponder、onMoveShouldSetResponder 作为道具、设置及其值作为状态变量传递.但是，onStartShouldSetResponder、onMoveShouldSetResponder 不响应滚动视图和列表视图。请告诉我如何实现这种交互。

<View style={{flex:1}}>
        <ScrollView showsVerticalScrollIndicator = {true}
            onResponderTerminationRequest={(evt) =>true}           
            onStartShouldSetResponderCapture={ (evt) => false}                      
            onMoveShouldSetResponderCapture={ (evt) => false}>
            <View style={{flex:1}}>
                <View style={[styles.coverpicwrapr]}>
                  <Image style={styles.coverpic} source={{uri: 'coverpic'}}/>
                </View>
                <View  style={[styles.tagfullwrapr, styles.borderBottomThick]}>
                  <View  style={[styles.title, styles.explore]}>
                    <View style={[styles.smlimgoutline]}>
                     <View style={[styles.smlimgwrapr]}>
                      <Image style={styles.smlimg} source={{uri: 'explore'}}/>
                     </View> 
                    </View>
                    <View style={[styles.tagWrapr]}>
                       <View><Text style={[styles.tagTitle]}>Explore</Text></View>
                       <View><Text style={[styles.tagDes]}>By your mood or prefrence</Text></View>
                    </View>
                  </View>
                  <View style={[styles.optionsBlock]}>
                    <View style={[styles.optionsRow]}>
                        <TouchableWithoutFeedback onPress={this.gotoLunchPage}>
                          <Image style={styles.optionsPic} source={{uri: 'lunch'}}/>
                        </TouchableWithoutFeedback>   
                           <Image style={styles.optionsPic} source={{uri: 'delivery'}}/>
                    </View>
                    <View style={[styles.optionsRow]}>
                        <Image style={styles.optionsPic} source={{uri: 'dinner'}}/>
                        <Image style={styles.optionsPic} source={{uri: 'breakfast'}}/>
                    </View>
                    <View style={[styles.optionsRow]}>
                        <Image style={styles.optionsPic} source={{uri: 'drinks'}}/>
                        <Image style={styles.optionsPic} source={{uri: 'cafes'}}/>
                    </View>
                    <View style={[styles.optionsRow]}>
                        <Image style={styles.optionsPic} source={{uri: 'luxury'}}/>
                        <Image style={styles.optionsPic} source={{uri: 'northindian'}}/>
                    </View>
                  </View>
                </View>  
                <View  style={[styles.title, styles.orderonline, styles.borderBottomThick]}>
                  <View style={[styles.smlimgoutline]}>
                   <View style={[styles.smlimgwrapr]}>
                    <Image style={styles.smlimg} source={{uri: 'orderonline'}}/>
                   </View> 
                  </View>
                  <View style={[styles.tagWrapr]}>
                     <View><Text style={[styles.tagTitle]}>Order Online</Text></View>
                     <View><Text style={[styles.tagDes]}>From restaurants that deliver to you.</Text></View>
                  </View>
                  <View style={[styles.rightIcon]}>
                    <Icon name="ios-arrow-forward" size={25} color='#A4A4A4'/>                      
                  </View>
                </View>
                <View  style={[styles.title, styles.nearby, styles.borderBottomThick]}>
                  <View style={[styles.smlimgoutline]}>
                   <View style={[styles.smlimgwrapr]}>
                    <Image style={styles.smlimg} source={{uri: 'nearby'}}/>
                   </View> 
                  </View>
                  <View style={[styles.tagWrapr]}>
                     <View><Text style={[styles.tagTitle]}>Nearby</Text></View>
                     <View><Text style={[styles.tagDes]}>See restaurants near you</Text></View>
                  </View>
                  <View style={[styles.rightIcon]}>
                    <Icon name="ios-arrow-forward" size={25} color='#A4A4A4'/>                      
                  </View>
                </View>
                <View  style={[styles.title,styles.feed]}>
                    <View style={[styles.smlimgoutline]}>
                     <View style={[styles.smlimgwrapr]}>
                      <Image style={styles.smlimg} source={{uri: 'feed'}}/>
                     </View> 
                    </View>
                    <View style={[styles.tagWrapr]}>
                       <View><Text style={[styles.tagTitle]}>Feed</Text></View>
                       <View><Text style={[styles.tagDes]}>See what is happening around you</Text></View>
                    </View>
                </View> 
            </View>    
            <View style={[styles.feedTabsWrapr]}>
                      <View style={[styles.feeds,styles.activeFeedWrapr]}>
                        <Text style={[styles.localFeed,styles.activeFeed]}>Local Feed</Text>
                      </View>
                      <View style={[styles.feeds,styles.inactiveFeedWrapr]}>
                        <Text style={[styles.localFeed,styles.inactiveFeed]}>My Feed</Text>
                      </View>
            </View>
            <View  style={[styles.scrollwrapr,{{flex:1}}]}>
                 <ListView
                  dataSource={this.state.dataSource}
                  renderRow={this.renderCards}
                  onEndReachedThreshold={10}
                  onEndReached={this.onEndReached}
                  renderFooter={this._renderFooter}/> 
            </View>
        </ScrollView>
      </View>  

Answer 1

在 ios 中实现此动画的一种方法是简单地为父滚动添加stickyHeaderIndices ={2}。但是，由于android不支持stickyHeaderIndices，我试图通过使用滚动视图和列表视图来实现这个动画。但是，控件不会从一个滚动视图传递到列表视图，反之亦然。我试过 PanResponder，但动画并不流畅。那么，请您建议一种解决方法或添加stickyHeaderIndices 作为android 的道具吗？？