React Native: 2 Scroll-Ansichten mit 2 Sticky-Headern

Question

Ich versuche, eine Tagesansicht mit Zeiten auf der linken Seite und einer oberen Kopfzeile von Personen zu erstellen. Momentan kann ich die linke ODER die obere Kopfzeile halten, aber nicht beides.

Wie erhalten Sie 2 sticky header?

Mein sieht wie folgt machen:

<ScrollView style={{height: 600}}> 
    <ScrollView horizontal={true}> 
     <View style={styles.column}> 
     <View style={{ flex: 1, flexDirection: 'row', width}}> 
      {header} 
     </View> 

     <View style={styles.row}> 
      <View style={[styles.container, { width, marginLeft: 40 }]}> 
      {this.generateRows()} 
      </View> 
     </View> 

     </View> 
    </ScrollView> 
    <View style={{backgroundColor: 'white', position: 'absolute', top: 0, bottom: 0, left: 0, }}> 
     <View style={{ flex: 1, flexDirection: 'row'}}> 
     <View style={styles.row}> 
      <Text></Text> 
     </View> 
     </View> 
     <View style={{height: 1000, width: 40 }}> 
     {this.generateRowLabels()} 
     </View> 
    </View> 
    </ScrollView> 

Answer 1

Können Sie versuchen, die Top-Level-Scroll Wechsel zum Ansehen/FlexBox mit flexDirection als 'Spalte'? Dies führt dazu, dass die inneren ScrollViews in die Fenstergröße passen.