2016-08-14 3 views
6

innerhalb meiner Anwendung index.io.js gibt es nur 1 ScrollView, die innerhalb einer View unter der render Funktion verpackt ist. Manchmal kann ich bis zum Ende der ScrollView scrollen und den Bildschirm dort behalten. Die ScrollView würde jedoch an den oberen Bildschirmrand zurückspringen und manchmal nicht unten bleiben.React Native ScrollView scrollt nicht manchmal nach unten

Weiß jemand, was passiert? Vielen Dank.

render() { 
    return <View style={{flex: 1}}> 
    <ScrollView> 
    <Text>234</Text> 
    <Text>234</Text> 
    <Text>234</Text> 
    <Text>234</Text> 
    // .... repeat so many times ... 
    </ScrollView> 
    </View> 
} 

ps: mein RN 0.28.0 ist, ist iOS Implementierungsziel 8,0

Antwort

4

Beachten Sie, dass ScrollViews eine beschränkte Höhe, da sie um unbegrenzt Höhe zu arbeiten, Kinder enthalten müssen in ein begrenzter Container (über eine Scroll-Interaktion). Um die Höhe einer ScrollView zu begrenzen, legen Sie entweder direkt die Höhe der Ansicht fest (nicht empfohlen) oder stellen Sie sicher, dass alle übergeordneten Ansichten eine begrenzte Höhe haben. Das Vergessen, {flex: 1} in den View-Stack zu übertragen, kann hier zu Fehlern führen, die der Element-Inspektor leicht zu debuggen macht.

https://facebook.github.io/react-native/docs/scrollview.html

Ich glaube, Sie einen Stil zu Ihrem Scrollview mit Flex zuweisen sollte: 1 Eigenschaft. Und erstellen Sie einen contentContainerStyle, um ein besseres Design zu erhalten.

14

Für wie ich reagieren nativer Newbies:

Suche des Fehlers für die Herstellung {flex:1} auf der contentContainerStyle des Scroll Attribut Einstellung, die im Grunde die Scroll sagen explizit zu blättern und hoffen, dass es nicht zu bewegen, da dies die Sets Inhalt Höhe zum gleichen Elternteil Rahmen, der die scrollview ist

+1

Eigentlich gelöst muy Problem. Habe meine Stimme. – EnriqueDev

+0

für uns, die Einstellung 'contentContainerStyle = {{flex: 1}}' hat unser Problem gelöst! – Cole