Skip to content

Bug - Can not disable Bounce in ScrollView when Horizontal=true #28808

Closed
@stephanoparaskeva

Description

@stephanoparaskeva

I need to create a component that is Horizontally scrollable. However you cannot stop vertical bouncing, when you just want horizontal scrollability.

Despite this, the docs say:

alwaysBounceVertical
When true, the scroll view bounces vertically when it reaches the end 
even if the content is smaller than the scroll view itself. The default value 
is false when horizontal={true} and true otherwise.
    <ScrollView
      horizontal={true}
      onScrollEndDrag={increment}
      alwaysBounceVertical={false}
      bounces={false}
      showsHorizontalScrollIndicator={false}
      contentContainerStyle={{ flex: 1 }}
      style={{ flex: 1 }}>
      <View style={styles.container}>
        <TimeTableView
          events={events_data}
          firstHour={0}
          finalHour={25}
          titleCutoff={1}
          pastFutureIterator={iteration}
          numOfCalendarDays={7}
          onEventPress={onEventPress}
          headerStyle={styles.headerStyle}
        />
      </View>
    </ScrollView>

ezgif com-video-to-gif (4)

Am not able to disable bouncing effect, or the movement that you see. It should be optional to disable.

Ver: 0.62
Info

info Fetching system and libraries information...
System:
    OS: macOS 10.15.4
    CPU: (8) x64 Intel(R) Core(TM) i7-8569U CPU @ 2.80GHz
    Memory: 21.36 MB / 16.00 GB
    Shell: 5.8 - /usr/local/bin/zsh
  Binaries:
    Node: 13.12.0 - ~/.nvm/versions/node/v13.12.0/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v13.12.0/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.9.1 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK:
      API Levels: 28, 29
      Build Tools: 28.0.3, 29.0.3
      System Images: android-29 | Google Play Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 3.6 AI-192.7142.36.36.6392135
    Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_252 - /usr/bin/javac
    Python: 2.7.17 - /usr/local/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.11.0 => 16.11.0 
    react-native: 0.62.2 => 0.62.2 
  npmGlobalPackages:
    *react-native*: Not Found

Even with these props, nothing changes for vertical

      bounces={false}
      alwaysBounceVertical={false}
      scrollEnabled={false}
      bouncesZoom={false}

Steps to replicate:

  1. Make any ScrollView
  2. add content to the ScrollView
  3. add prop 'Horizontal' to ScrollView
  4. You can now no longer prevent vertical bouncing.

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

    Issue actions