2016-03-15 5 views
12

Ich kann ViewPagerAndroid verwenden, aber wenn ich es unter eine ScrollView-Komponente stelle, wird nichts gerendert. Ist Ihnen das schon einmal begegnet?ViewPagerAndroid wird unter ScrollView nicht mit React-Native gerendert

React-Nativ: Version 0.22 Plattform: Android

Dies funktioniert wie erwartet:

<ViewPagerAndroid style={{flex: 1}} initialPage={0}> 
    <View><Text>View 1</Text></View> 
    <View><Text>View 2</Text></View> 
    <View><Text>View 3</Text></View> 
</ViewPagerAndroid>; 

Im Folgenden macht nichts:

<ScrollView style={{flex: 1}}> 
<ViewPagerAndroid style={{flex: 1}} initialPage={0}> 
    <View><Text>View 1</Text></View> 
    <View><Text>View 2</Text></View> 
    <View><Text>View 3</Text></View> 
</ViewPagerAndroid> 
</ScrollView> 

ich auf Github ein Problem geschaffen zu: #6469

+0

Vielleicht müssen Sie dem ScrollView auch eine Größe geben? Versuchen Sie, etwas anderes in der ScrollView (wie Text) zu platzieren, um zu sehen, ob das gut ist. –

+0

@MartinKonicek Wenn ich ViewPagerAndroid Höhe gebe, hat es wie erwartet funktioniert, aber Problem ist, ich versuche, flex: 1 zu verwenden, so dass scrollView so viel wie den verfügbaren Platz abdecken wird. Gibt es eine Möglichkeit, das zu erreichen, habe ich den Code aktualisiert, indem ich auch flex: 1 als Stil zu ScrollView hinzugefügt habe. – cubbuk

+0

Ich weiß, dass es eine alte Frage ist, aber können Sie contentContainerStyle = {{flex: 1}} zu Ihrem ScrollView hinzufügen. Beispiel:

Antwort

3

Es ist eine alte Frage, aber ich hatte auch ein ähnliches Problem und löste es, indem ich contentContainerStyle = {{flex: 1}} zum scrollview-Tag hinzufügte. Zum Beispiel

<View style={{ flex: 1 }}> 
    <ScrollView style={{ flex: 1 }} contentContainerStyle={{ flex: 1 }}> 
     <ViewPagerAndroid style={{ flex: 1 }} initialPage={0}> 
      <View><Text>View 1</Text></View> 
      <View><Text>View 2</Text></View> 
      <View><Text>View 3</Text></View> 
     </ViewPagerAndroid> 
    </ScrollView> 
    {/*some other views*/} 
    <View style={{ height: 20, width: null, flex: 1 }}/> 
</View> 
0

Hoffe, das wird für Sie arbeiten.

<ScrollView style={{flex: 1}}> 
     <View style={{flex: 1}} > 
     <ViewPagerAndroid style={{flex: 1}} initialPage={0}> 
      <View><Text>View 1</Text></View> 
      <View><Text>View 2</Text></View> 
      <View><Text>View 3</Text></View> 
     </ViewPagerAndroid> 
    </View> 
</ScrollView>