Scrollen Sie zum Ende von ScrollView in React Native

8

Ich würde gerne einen Weg finden, programmatisch zum Ende einer scrollView zu blättern. Ich bin mir der scrollTo-Methode bewusst, nachdem ich den Quellcode für ScrollView angeschaut habe, aber ich finde keinen Weg, die Inhaltsgröße von scrollView zu messen.

Nachdem ich mich umgeschaut hatte, stieß ich auf diese github-Ausgabe, die erwähnt, wie "UIManager. measureX-Methoden werden verwendet, um die Inhaltsgröße zu messen. Nach mehrmaligem Suchen im Quellcode kann ich jedoch nicht genau finden, wo diese Methoden verwendet werden.

Würde mir jemand in die richtige Richtung zeigen können?

    
coldbuffet 10.10.2015, 02:48
quelle

4 Antworten

13

Es war ziemlich konsekutiv und ich stieß auf den Quellcode.

Du kannst es so machen:

erfordern:

%Vor%

rendern:

%Vor%

Ereignis:

%Vor%

Aus den Daten können Sie die Inhaltsgröße des Bildlaufs abrufen, dessen Höhe das vierte Element von data ist. Natürlich können Sie den Inhalt davon absetzen. Führen Sie den Quellcode von RCTUIMananger.m für weitere Details aus.

Wenn Sie getInnerViewNode verwenden, können Sie den Rahmen des inneren Rahmens von ScrollView aufrufen. Wenn Sie den Rahmen von ScrollView erhalten möchten, sollten Sie React.findNodeHandle(this._scrollView) verwenden, und der Rahmen von ScrollView ist nicht immer gleich dem Rahmen der inneren Ansicht.

(aktualisiert)

Wenn Sie (...data)=>{console.log(data)} durch callback ersetzen möchten, sollten Sie es wie folgt verwenden:

%Vor%     
KChen 10.10.2015, 05:53
quelle
1

Es gibt einen besseren Weg, dies zu tun. In groben Zügen:

Verwenden Sie eine ListView , um den Chat zu rendern.

%Vor%

Fügen Sie der Liste eine Fußzeile mit renderFooter hinzu, die onLayout , um seine y -Position zu speichern. Die Fußzeile muss nichts sichtbar machen, nur ein leeres View . Alles, was Sie suchen, ist, wo der untere Teil der Liste ist.

%Vor%

Fügen Sie einen onLayout Handler zum ListView selbst hinzu, der die Listen height speichert.

%Vor%

Mit diesen beiden Informationen können Sie zum Ende der Liste blättern, etwa wie folgt:

%Vor%

Wie oft Sie nach unten scrollen, hängt von Ihnen ab und hängt vom gewünschten Verhalten ab.

Ein Beispiel dafür ist GiftedMessenger .

    
nicholas 28.01.2016 21:18
quelle
1

Während RCTUIManager.measure() funktioniert, indem das vierte Element des Datenarrays über eine Referenz extrahiert wird, ist es viel geeigneter (und einfacher), Folgendes zu verwenden, wenn Sie mit ScrollViews arbeiten:

RE: Ссылка

%Vor%

Dieses Ereignis wird ausgelöst, sobald die Komponenten des inneren Kindes das Layout und die Änderung abgeschlossen haben. Dies funktioniert für mich und ich empfehle diesen unterstützten Ansatz bei der Festlegung von Inhaltsgrenzen.

    
sean2078 01.10.2016 16:22
quelle
1

Sie können die scrollToEnd () Methode der ScrollView verwenden:

Ссылка

Gemäß der Dokumentation: Wenn dies eine vertikale ScrollView ist, scrollt nach unten. Wenn dies eine horizontale ScrollView ist, scrollt nach rechts.

    
anivaler 31.05.2017 11:57
quelle

Tags und Links