Skip to content

ScrollView onScroll only fires once #38

@nick

Description

@nick

I have a component that looks something like this:

var ScrollTest = React.createClass({

  render() {
    return (
      <ScrollView onScroll={this.onScroll}>
        <View style={{ height: 2000 }} />
      </ScrollView>
    );
  },

  onScroll: function(e) {
    console.log("Scroll", e)
  }
});

Right now I'm only seeing the log message when I start a new scroll action. Is there a way to get that onScroll event to fire on every frame? I want the height of another component to depend on the scroll position of this ScrollView component. (trying to duplicate the behavior you see on the iOS Weather app when you scroll down).

Activity

nick

nick commented on Feb 6, 2015

@nick
Author

If I set a value for throttleScrollCallbackMS then it works :-)

frantic

frantic commented on Feb 6, 2015

@frantic
Contributor

@vjeux - the comment in the code is misleading, looks like we don't default to 200ms. @nick you are right, to receive the event continuously, you have to explicitly tell how often it should fire. The design decision here was driven by perf considerations - we don't want to spam the bridge with commands you are not interested in. If you want to animate something when scrolling, set throttleScrollCallbackMS to 16ms or less.

vjeux

vjeux commented on Feb 7, 2015

@vjeux
Contributor

Just made a diff internally to add a warning. D1833444 (for tracking purposes)

vjeux

vjeux commented on Feb 12, 2015

@vjeux
Contributor

Warning is now in: dd78b09

cleercode

cleercode commented on Mar 28, 2015

@cleercode

I set throttleScrollCallbackMS={16} and the warning doesn't show but I seem to still only get one event fired. Also only seeing one event logged in the UIExplorer example.

ssssssssssss

ssssssssssss commented on Apr 21, 2015

@ssssssssssss

Don't work for listview

nicklockwood

nicklockwood commented on Apr 21, 2015

@nicklockwood
Contributor

The throttleScrollCallbacksMS property is now called scrollEventThrottle.

nicklockwood

nicklockwood commented on Apr 21, 2015

@nicklockwood
Contributor

Looks like the warning wasn't updated when the property name was changed.

locked as resolved and limited conversation to collaborators on May 29, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @nick@ssssssssssss@frantic@vjeux@cleercode

        Issue actions

          ScrollView onScroll only fires once · Issue #38 · facebook/react-native