Commit Graph

185 Commits

Author SHA1 Message Date
Rubén Norte d5e9e55fa3 Remove @providesModule from all modules
Summary:
This PR removes the need for having the `providesModule` tags in all the modules in the repository.

It configures Flow, Jest and Metro to get the module names from the filenames (`Libraries/Animated/src/nodes/AnimatedInterpolation.js` => `AnimatedInterpolation`)

* Checked the Flow configuration by running flow on the project root (no errors):

```
yarn flow
```

* Checked the Jest configuration by running the tests with a clean cache:

```
yarn jest --clearCache && yarn test
```

* Checked the Metro configuration by starting the server with a clean cache and requesting some bundles:

```
yarn run start --reset-cache
curl 'localhost:8081/IntegrationTests/AccessibilityManagerTest.bundle?platform=android'
curl 'localhost:8081/Libraries/Alert/Alert.bundle?platform=ios'
```

[INTERNAL] [FEATURE] [All] - Removed providesModule from all modules and configured tools.
Closes https://github.com/facebook/react-native/pull/18995

Reviewed By: mjesun

Differential Revision: D7729509

Pulled By: rubennorte

fbshipit-source-id: 892f760a05ce1fddb088ff0cd2e97e521fb8e825
2018-04-25 07:37:10 -07:00
Bjørn-Erik Andreasen 2f1421dec7 Fix for scrollview android
Summary:
Trying this again with a fresh pullrequest as the old one kept having issued due to rebasing.

Fixes #16635
the issue is a little serious if you use a scrollview which contains textinput, you will never get a chance to input something since keyboard will always be dismissed because of on-drag event if your scroll-view use the property: keyboardDismissMode ='on-drag'

verify the issue #16635 and tested this fix worked

[ANDROID] [BUGFIX] [ScrollView] - Check that isTouching is also set when dismissing keyboard with on-drag android.
Closes https://github.com/facebook/react-native/pull/18785

Differential Revision: D7569815

Pulled By: hramos

fbshipit-source-id: 2a07369297ce9ce5a7714e513ccb480ee7011a4d
2018-04-10 10:55:01 -07:00
Peter van der Zee 439614891c Small refactor
Reviewed By: cpojer

Differential Revision: D7498659

fbshipit-source-id: 43ad85645e2366a385e08d68172e76e336fdfb1f
2018-04-05 06:36:53 -07:00
tuncaulubilge 263d04d756 Added nestedScrollEnabled prop to scroll view for android
Summary:
Nested scrolling in scrollViews, listViews and flatLists are enabled on iOS by default, but needs to be enabled manually on Android. This PR introduces a `nestedScrollEnabled` property to ScrollViews to support nested scrolling on Android 21 and above.

Enabling nested scroll will resolve issues with coordinator layout in android and required to support a collapsing toolbar.

Tested on the test app. We are also using this property in our app currently to support scrolling behaviour required by coordinator layouts.

[ANDROID] [ENHANCEMENT] [ScrollView] - Added a prop to enable nested scrolling
Closes https://github.com/facebook/react-native/pull/18299

Reviewed By: sahrens

Differential Revision: D7256604

Pulled By: mdvacca

fbshipit-source-id: fb8b7f1b5bed39837a2066db7f2a8798d52a3fd6
2018-03-18 20:16:15 -07:00
Tim Yung 8c036ce090 RN: Remove Animated -> ScrollView -> Animated Cycle
Reviewed By: sahrens

Differential Revision: D7027223

fbshipit-source-id: 59924fada0f29a5e2ce1ae9a3694a94cfb26367c
2018-02-20 20:35:08 -08:00
Sophie Alpert 1490ab12ef Update license headers for MIT license
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.

find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.

Reviewed By: TheSavior, yungsters

Differential Revision: D7007050

fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
2018-02-16 18:31:53 -08:00
Brian Vaughn 6f007e8957 Ran rename-unsafe-lifecycles codemod on xplat/js
Reviewed By: trueadm

Differential Revision: D6889214

fbshipit-source-id: e815cda4b09f3650ae3b0b9a44ae6f5fcb48fe25
2018-02-08 10:58:31 -08:00
Janic Duplessis ecaca80d42 Support sticky headers for inverted Lists
Summary:
Sticky headers for inverted lists should still stick at the top of the list instead of the bottom.

Tested by adding the inverted prop to the SectionList example in RNTester.

It does add a prop to ScrollView but it's very specific to the inverted list implementation, not sure if it should be documented.

[GENERAL][ENHANCEMENT][LISTS] -  Support sticky headers for inverted Lists
Closes https://github.com/facebook/react-native/pull/17762

Differential Revision: D6830784

Pulled By: sahrens

fbshipit-source-id: 6841fdd46e04b30547659d85ff54c3a21c61a8a2
2018-01-29 11:46:26 -08:00
Martin Sherburn 6fa039dab0 Added ScrollView support for React VR platform
Reviewed By: sahrens

Differential Revision: D6727393

fbshipit-source-id: 261d5734d5de3b94fd9eaefb5beab0e2d3074b17
2018-01-23 04:17:38 -08:00
Spencer Ahrens 65184ec6b0 rename and extend new maintain visible content position feature
Summary:
Builds off of cae7179c94

- Make the prop a dictionary for more configuration options
- Rename `maintainPositionAtOrBeyondIndex` -> `maintainVisibleContentPosition` + `minIndexForVisible`
- Add autoscroll threshold feature

Given the async native of RN JS and background layout, there is no way to trigger the scrollTo from JS without risking a delay, so we add the feature in native code.

== Test Plan ==
ScrollViewExample:
https://youtu.be/pmY8pxC9PRs

Reviewed By: shergin

Differential Revision: D6729160

fbshipit-source-id: 70f9bae460ce84567857a4f696da78ce9b3b834c
2018-01-18 14:01:50 -08:00
Semen Zhydenko d2c569795c Typos in comments and log messages
Summary:
No code changes, no testing required.

alligned -> aligned
allignment -> alignment
completly -> completely
conseptually -> conceptually
decendents -> descendants
indefinetly -> indefinitely
dimention -> dimension
doesnt -> doesn't
safegaurd -> safeguard
intialization -> initialization
hierachy -> hierarchy
happend -> happened
gaurd -> guard
programatically -> programmatically
initalized -> initialized
immidiately -> immediately
occured -> occurred
unkown -> unknown
neccessary -> necessary
neccesarily -> necessarily
occuring -> occurring
comoponent -> component
propogate -> propagate
recieved -> received
referece -> reference
perfomance -> performance
recieving -> receiving
subsquently -> subsequently
scoll -> scroll
suprisingly -> surprisingly
targetting -> targeting
tranform -> transform
symetrical -> symmetrical
wtih -> with
Closes https://github.com/facebook/react-native/pull/17578

Differential Revision: D6718791

Pulled By: shergin

fbshipit-source-id: 4ab79c1131ec5971d35a0c7199eba7ec0a0918ad
2018-01-12 22:18:45 -08:00
Spencer Ahrens cae7179c94 new feature to support smooth bi-directional content loading
Summary:
== Problem / Background ==

Most lists paginate in a single direction (standard infinite list), but some paginate in both directions. Most common example is a chat thread where new messages show up on the bottom, and old content can be loaded by scrolling up. Comment threads are another example.

Right now, adding content to the bottom of a scroll view is smooth - the content doesn't jump. But when adding to the top of the scrollview, the content gets pushed down, which is jarring (note this may appear reversed because of inverting the list which is common for chat applications).

== Approach ==

The basic idea is simple - we set a flag in JS, then for every uimanager transaction, we record which is the first eligible and visible view in the ScrollView, and compare it's new origin to the old one. If it has changed, we update the contentOffset of the ScrollView to compensate.

This is done by observing `willPerformMounting` directly (only from scrollviews that have this new property set), and then observing the prev state with prependUIBlock and making the update synchronously in addUIBlock to avoid any flicker.

There is also a way to skip views that we don't care about, like a spinner at the top of the view that we don't want to stay in place - we actually want it to get pushed up by the new content, replaced visually in the viewport.

== Notes ==

Most chat applications will probably want to do a scrollToTop when new content comes in and the user is already scrolled at or near the bottom.

This is glitchy if visible children are re-ordered, which could be fixed with additional logic, but it doesn't come up in the type of applications we're targetting here so punting on that.

== Test Plan ==

https://youtu.be/4GcqDGz9eOE

Reviewed By: shergin

Differential Revision: D6696921

fbshipit-source-id: 822e7dfcb207006cd1ba098356324ea81f619428
2018-01-12 19:16:00 -08:00
Eli White 11a495cb32 Fixing eslint-comments warnings
Reviewed By: yungsters

Differential Revision: D6678252

fbshipit-source-id: ee93b7ee52520b750ca11fcc625cccf3cd82d075
2018-01-08 17:04:29 -08:00
Jimmy Zhuang ddd65f1ba9 Support snapToInterval for horizontal scrollview on Android
Summary:
`snapToInterval` is available on iOS but on android yet. This PR is to add support for `snapToInterval` on android.

Example:

![android_snap](https://cloud.githubusercontent.com/assets/1699429/19086983/39d3ee1c-8a25-11e6-9c84-20f25a751f32.gif)

TO: lelandrichardson spikebrehm
Closes https://github.com/facebook/react-native/pull/10242

Differential Revision: D4168527

fbshipit-source-id: de3dd9ac5d9e0fddfce5e5bc0aa6a4f33f1e30b3
2018-01-03 10:33:07 -08:00
Mark Amery 52f350a9cb Add proptypes for scrollview drag start & end handlers
Summary:
`ScrollView` has a bunch of `onFoo` handlers for scrolling-related events, most of which have a proptype defined and are documented. However, `onScrollBeginDrag` and `onScrollEndDrag` do not currently have a proptype and are not currently documented (as noted at https://stackoverflow.com/a/41793747/1709587). It seems reasonable to bring consistency and to provide documentation of these otherwise hard-to-discover props.

I haven't added or run any tests, and don't plan to do so (beyond waiting and seeing that no existing checks fail in CircleCI).

I have also created a PR to update the documentation at https://github.com/facebook/react-native-website/pull/99

*(None needed; this isn't a functionality change.)*
Closes https://github.com/facebook/react-native/pull/17368

Differential Revision: D6642695

Pulled By: TheSavior

fbshipit-source-id: fa40ed2ae6d5947a161b816a47441d8f5d4d9c4d
2017-12-28 11:36:14 -08:00
Álvaro Medina Ballester 0c8a3e4f79 closes #13034 Fixes the ScrollViewMock methods
Summary:
Solves https://github.com/facebook/react-native/issues/13034

Now the `ScrollView` mock has all the methods available.

React Native tests pass.

To test this specific part of the code,

```sh
$ react-native init Test
$ cd Test/
$ yarn add react-navigation
```

Then, add a simple project that uses `react-navigation`:

```js
import React from 'react';
import { Text } from 'react-native';
import { StackNavigator } from 'react-navigation';

class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'Welcome',
  };
  render() {
    return <Text>Hello, Navigation!</Text>;
  }
}

const SimpleApp = StackNavigator({
  Home: { screen: HomeScreen },
});

export default SimpleApp
```

Run the default render tests:

```js
$ npm run test
```
Closes https://github.com/facebook/react-native/pull/13048

Differential Revision: D4746028

Pulled By: shergin

fbshipit-source-id: cb1791978d15be7f5d14b7b22979388066ad6caa
2017-11-28 12:32:37 -08:00
Avik Chaudhuri a48da14800 @allow-large-files Flow 0.58 upgrade for xplat/js
Reviewed By: yungsters

Differential Revision: D6219339

fbshipit-source-id: f003111500ef5971b9a95f26d43cee6644c16abe
2017-11-02 10:51:14 -07:00
David Vacca c278020633 Fixing RTL HorizontalScrolling in Android
Reviewed By: astreet

Differential Revision: D6170631

fbshipit-source-id: 254e6ed9a4d6e42b6d1215de1ff63aedb2c07a0a
2017-10-27 12:34:10 -07:00
Andrew Chen (Eng) 9b6f160c04 Revert D5638458: Fixing RTL HorizontalScrolling in Android
Differential Revision: D5638458

fbshipit-source-id: f4474a12821cd2c20f57ce3bac5996c327ceaa33
2017-10-26 15:33:10 -07:00
David Vacca 36c951d24f Fixing RTL HorizontalScrolling in Android
Reviewed By: astreet

Differential Revision: D5638458

fbshipit-source-id: 08a5070a362eb43e12140cc204172d0950a1b720
2017-10-26 11:25:22 -07:00
Krzysztof Magiera bae9b2b206 Handle touchCancel properly in ScrollResponder
Summary:
Touch cancel events are currently being ignored by the ScrollView component. Currently scrollview responds both to scroll events and touchStart/touchMove/touchEnd events.

The reason why ScrollView listens to touchStart/touchEnd is so that it can update its `state.isTouching` param. This parameter then is used in `scrollResponderHandleScrollShouldSetResponder` to make the decision if scrollview should set the responder or not. So if `isTouching` is true (we've received touchStart) then ScrollView want to became a JS responder. This in turn is important for the case where we receive scroll events that does not necessarily need to trigger responder change, e.g. we don't want Scrollview to become JS responder if scroll events have been triggered by `scrollTo` in which case setting responder would put the whole responder system in a bogus state (note that responder can be released only by touchEnd or touchCancel, so if there is no touchEnd that follows scroll event then ScrollView will remain the responder and this would break next touch interaction).

It is therefore crucial for the ScrollView to reset `isTouching` state when touchCancel arrives, as otherwise the next scroll event would incorrectly trigger responder change.

On top of that ScrollView seems to be the only component in RN's core that registers to handle touchEnd but ignores touchCancel, which stands agains the comment added to `RCTRootView.cancelTouches` [here](https://github.com/facebook/react-native/commit/c14cc123d#diff-9cd70243bd2af75c613e29972bb1b41cR127).

This problem is difficult to test with a pure RN native app, as on Android it does not surface because of the `responderIgnoreScroll` flag that is being added to every scroll event, and it essentially makes the responder system ignore scroll events so they would never trigger responder change. On the other hand on iOS the cancel events are pretty rare. With pure RN app they can only be triggered by a "system" level interaction (e.g. when system alert dialog appears or when home button is clicked and there is a touch interaction happening). This issue becomes more prominent when RN app is embedded in a more sophisticated application that may use [`RCTRootView.cancelTouches`](1e8f3b1102/React/Base/RCTRootView.h (L130)) method to block RNs gesture recognizers in some cases or with third-party libraries that deals with touch events like [react-native-gesture-handler](https://github.com/kmagiera/react-native-gesture-handler) that also calls into the method when native touch interaction is detected.
Closes https://github.com/facebook/react-native/pull/16004

Differential Revision: D6003063

Pulled By: shergin

fbshipit-source-id: f6495ffc57a5f996117b5bd80478bb1a58d2d799
2017-10-19 15:30:44 -07:00
Peter Ruibal 0ec04ed8ef Remove redundant style field from ScrollView propTypes.
Summary:
We're spreading this in via `...ViewPropTypes` also.  Having both confuses
flow when you try to pass style (even though they're identical), when the
types are defined via `React.ElementProps`

Reviewed By: jingc

Differential Revision: D6028659

fbshipit-source-id: 203e29682d34f1648a47d9ddbaef0c9630fbcb99
2017-10-11 14:25:35 -07:00
Masayuki Iwai a541d58bc4 Fix that section headers in SectionList don't stick at correct position.
Summary:
I noticed that section headers in SectionList don't stick at correct position in case of using with contentInset and contentOffset. (See the demo below. It looks that contentInset.top is ignored.)
This is a common case of use of NavigationBar and TableView on iOS.

![](https://user-images.githubusercontent.com/143255/29018708-1e2f98aa-7b97-11e7-9599-19dbb832266d.gif)

Here is a demo and an example code:

![](https://user-images.githubusercontent.com/143255/29018753-4201f660-7b97-11e7-9d31-28413d1b6269.gif)

```jsx
import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  SectionList,
} from 'react-native';

export default class RNScrollExample extends Component {
  renderSectionHeader(title) {
    return (
      <View style={styles.sectionHeader}>
        <Text>{title}</Text>
      </View>
    )
  }

  renderItem(content) {
    return (
      <View style={styles.cell}>
        <Text>{`Item ${content}`}</Text>
      </View>
    )
  }

  renderSeparator() {
    return <View style={styles.separator} />
  }

  renderSectionList() {
    const sections = Array.from(Array(10), (e, i) => ({ title: `Section ${i+1}`, data: Array.from(Array(10)).map((e, i) => i+1) }))
    const navigationBarHeight = 64
    return (
      <SectionList
        contentInset={{ top: navigationBarHeight }}
        contentOffset={{ y: -navigationBarHeight }}
        sections={sections}
        keyExtractor={(item, index) => index}
        renderSectionHeader={({ section }) => this.renderSectionHeader(section.title)}
        renderItem={({ item }) => this.renderItem(item)}
        ItemSeparatorComponent={this.renderSeparator}
      />
    )
  }

  renderHeader() {
    return (
      <View style={styles.header}>
        <Text style={styles.headerText}>Contents</Text>
      </View>
    )
  }

  render() {
    return (
      <View>
        {this.renderSectionList()}
        {this.renderHeader()}
      </View>
    )
  }
}

const styles = StyleSheet.create({
  header: {
    position: 'absolute',
    top: 0,
    left: 0,
    right: 0,
    height: 64,
    paddingTop: 20,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#ffffffcc',
  },
  headerText: {
    fontSize: 16,
    fontWeight: 'bold',
  },
  sectionHeader: {
    paddingHorizontal: 8,
    paddingVertical: 4,
    backgroundColor: '#05bbd3',
  },
  cell: {
    paddingHorizontal: 8,
    paddingVertical: 16,
    backgroundColor: '#82dde9',
  },
  separator: {
    height: 1,
    backgroundColor: '#7d888d',
  },
});

AppRegistry.registerComponent('RNScrollExample', () => RNScrollExample);
```
Closes https://github.com/facebook/react-native/pull/15395

Differential Revision: D5988720

Pulled By: shergin

fbshipit-source-id: d33f6ee943d4f913970e26c322b66b3c9c948a02
2017-10-09 22:45:48 -07:00
Yann Pringault f66c8f2f7e Fix minor typo in ScrollView doc
Summary:
I don't think a test plan is required here! 😛
Closes https://github.com/facebook/react-native/pull/16243

Differential Revision: D6005196

Pulled By: hramos

fbshipit-source-id: 3b46346e57e0d9971078c4807a4fa0045a8366b1
2017-10-07 15:04:10 -07:00
Sam Goldman a16ef18a80 Upgrade Flow to v0.56.0
Reviewed By: calebmer

Differential Revision: D5958715

fbshipit-source-id: 7feda03a9540e69bf8d9b4eb89720248ff43294f
2017-10-02 21:11:05 -07:00
Matt Bruce d3e1a21399 Change all calls to no-console from no-console-disallow
Reviewed By: TheSavior

Differential Revision: D5944700

fbshipit-source-id: cdd78d1b32fa98d8a792a39ccc3cb37241ab4366
2017-09-29 16:38:06 -07:00
Marshall Roch 91b6b4efb9 @allow-large-files Flow v0.54.0
Reviewed By: leebyron

Differential Revision: D5773490

fbshipit-source-id: 2c54bb6326f23edbe9a969f3010f79da8189923e
2017-09-06 03:33:43 -07:00
Caleb Meredith 63f990121a Fix React Native open source
Reviewed By: hramos, TheSavior

Differential Revision: D5728356

fbshipit-source-id: fb751d67c16ba9273de93d9b6d5acd65b1555dca
2017-08-29 15:01:05 -07:00
Caleb Meredith 90eaeb019b Upgrade fbsource/xplat/js to Flow v0.53.0
Reviewed By: avikchaudhuri

Differential Revision:
D5648819
Ninja: T20988071

fbshipit-source-id: 66e5b6747c79ae66b6eb69d40ede5e982c26174f
2017-08-17 18:45:01 -07:00
Caleb Meredith 30d9c3d279 Add suppressions for Flow v0.53.0 before React changes
Reviewed By: avikchaudhuri

Differential Revision: D5648801

fbshipit-source-id: c4eb1bee198a177b69b6e9414111ce957b4d27ff
2017-08-17 05:18:33 -07:00
Jake Murzy 614dd077b3 add `pinchEnabled` prop to ScrollView
Summary:
When false, ScrollView disables use of pinch gestures to zoom in and out. This allows ScrollView's pinch gesture responder to be disabled to only allow zooming programmatically. The default value is ~false~ true.

**Test Plan**
Tested that pinch gesture responder is disabled when pinchEnabled=false.

/cc  nicklockwood sahrens

🍺
Closes https://github.com/facebook/react-native/pull/10037

Differential Revision: D5491953

Pulled By: shergin

fbshipit-source-id: eae16f92ec616e415b4ddacfccb84c697582daf9
2017-08-06 23:55:16 -07:00
Adam Miskiewicz 1954438533 Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Summary:
In iOS11, Apple added a new layout feature called "Safe Areas" (this blog post talks a bit about it: https://www.bignerdranch.com/blog/wwdc-2017-large-titles-and-safe-area-layout-guides/).

UIScrollView is one component that is affected by this change in Apple's API. When the `contentInsetAdjustmentBehavior` is set to `automatic`, for example, it will adjust the insets (and override any manually set insets) automatically based on whether or not there's a UINavigationBar, a UITabBar, a visible status bar, etc on the screen. Frustratingly, Apple decided to default to `Automatic` for this behavior, which will cause any apps that set contentInset/contentContainerStyle padding to have their values offset by, at the very least, the size of the status bar, when they compile their app for iOS 11. Here's more information about this behavior: https://developer.apple.com/documentation/uikit/uiscrollview/2902261-contentinsetadjustmentbehavior?language=objc

Mostly, this is a really straightforward change -- it simply adds a new iOS-only prop to ScrollView that allows setting `contentInsetAdjustmentBehavior`. But I did decide to default the behavior to `never`, so that it mimics the behavior we've seen in iOS < 11. I think it's good to keep something as crucial as scrollview content insets non-magical, and also keep it behaving similarly between platforms.
Closes https://github.com/facebook/react-native/pull/15023

Reviewed By: javache

Differential Revision: D5517552

Pulled By: hramos

fbshipit-source-id: c9ce4bf331b3d243228268d826fdd4dcee99981d
2017-07-31 12:23:34 -07:00
Saad Ismail 560bab17e1 Revert D5441491: [react-native][PR] Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Differential Revision: D5441491

fbshipit-source-id: 0ae920c6c020f41ee0fde38e57b735f87b26d4a9
2017-07-26 13:32:41 -07:00
Adam Miskiewicz 6e28b39d78 Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Summary:
In iOS11, Apple added a new layout feature called "Safe Areas" (this blog post talks a bit about it: https://www.bignerdranch.com/blog/wwdc-2017-large-titles-and-safe-area-layout-guides/).

UIScrollView is one component that is affected by this change in Apple's API. When the `contentInsetAdjustmentBehavior` is set to `automatic`, for example, it will adjust the insets (and override any manually set insets) automatically based on whether or not there's a UINavigationBar, a UITabBar, a visible status bar, etc on the screen. Frustratingly, Apple decided to default to `Automatic` for this behavior, which will cause any apps that set contentInset/contentContainerStyle padding to have their values offset by, at the very least, the size of the status bar, when they compile their app for iOS 11. Here's more information about this behavior: https://developer.apple.com/documentation/uikit/uiscrollview/2902261-contentinsetadjustmentbehavior?language=objc

Mostly, this is a really straightforward change -- it simply adds a new iOS-only prop to ScrollView that allows setting `contentInsetAdjustmentBehavior`. But I did decide to default the behavior to `never`, so that it mimics the behavior we've seen in iOS < 11. I think it's good to keep something as crucial as scrollview content insets non-magical, and also keep it behaving similarly between platforms.
Closes https://github.com/facebook/react-native/pull/15023

Differential Revision: D5441491

Pulled By: shergin

fbshipit-source-id: 7b56ea290f7f6eca5f1d996ff8488f40b866c2e6
2017-07-25 10:28:42 -07:00
Taylor Kline 64899c08f3 Identify keyboardDismissMode platform-specific options
Summary:
Similar to `TextInput`'s `returnKeyType`, comments allow to see at a glance which options are cross-platform and which are not.

<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/14780

Differential Revision: D5480895

Pulled By: hramos

fbshipit-source-id: c38337def920678d29c8322e52b54f57e80cb95b
2017-07-24 11:23:10 -07:00
Tomas Reimers 3eae3df5d1 Add docs for onMomentumScrollBegin
Summary:
<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/15158

Differential Revision: D5479401

Pulled By: shergin

fbshipit-source-id: d4864e1630a36deb1a227c1b6242255ac1f788e6
2017-07-24 01:17:30 -07:00
Tomas Reimers aa9a19ab8d Remove onScrollAnimationEnd
Summary:
<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/15156

Differential Revision: D5479265

Pulled By: shergin

fbshipit-source-id: a2dfa3a4357e126838a17dac4797d1d845cd56ae
2017-07-24 00:32:17 -07:00
Tomas Reimers b8118d1b79 Add documentation for onMomentumScrollEnd
Summary:
<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/15144

Differential Revision: D5478574

Pulled By: shergin

fbshipit-source-id: 33c49f0efdfb3a518e1ee254b1dc01ec22f09269
2017-07-23 14:07:44 -07:00
Sean Wang 88fb45ddf9 Clarity in pagingEnabled description for ScrollView
Summary:
Current description is misleading (without looking at implementation) to believe that both horizontal and vertical pagination are supported on both platforms. This comment clarifies that vertical pagination is not supported on Android.
Closes https://github.com/facebook/react-native/pull/14844

Differential Revision: D5393488

Pulled By: hramos

fbshipit-source-id: e79246a65e1011b2667e7eea67e85e17394026a8
2017-07-10 17:46:14 -07:00
Seth Fitzsimmons 9afb71fde8 Replace React.createClass with create-react-class
Summary:
This replaces all uses of `React.createClass` with `createReactClass` from the `create-react-class` package, attempting to match use of `var` and `const` according to local style.

Fixes #14620
Refs #14712
Closes https://github.com/facebook/react-native/pull/14729

Differential Revision: D5321810

Pulled By: hramos

fbshipit-source-id: ae7b40640b2773fd89c3fb727ec87f688bebf585
2017-07-07 14:36:01 -07:00
Spencer Ahrens afa47924d6 warn when setting pagingEnabled when snapToInterval at the same time
Reviewed By: fkgozali

Differential Revision: D5326342

fbshipit-source-id: 2bf6b66f81e9aedaad288495f254f04af32dc63d
2017-06-27 16:22:45 -07:00
Brian Vaughn 119959252e Remove RN fiber createClass wrapper around View
Reviewed By: spicyj

Differential Revision: D5241527

fbshipit-source-id: 9209004544e83cc0f03fcaa27c9b1acf8db09930
2017-06-21 12:38:06 -07:00
Janic Duplessis 407ec0023f Disable subview clipping when sticky headers are enabled
Summary:
Subview clipping still causes issues on Android and would be pretty hard to fix properly, I investigated this a bit and sticky header views are getting removed because it doesn't take transform into consideration. It would also require to recalculate subview clipping on every transform change so I think it is better to just disable subview clipping in when there are sticky headers, especially since we seem to be moving away from subview clipping with things like FlatList.

**Test plan**
Tested that sticky headers work in ListView paging example.

Fixes #14000
Closes https://github.com/facebook/react-native/pull/14010

Differential Revision: D5283723

Pulled By: sahrens

fbshipit-source-id: 183b3202765ae09aaae05497694c3f514e969ea1
2017-06-20 09:34:55 -07:00
John O'Leary 62b20ce582 Scrollview updatedChildFrames data controlled by prop
Summary: Optimize ScrollView by adding flag "DEPRECATED_sendUpdatedChildFrames" to gate whether updatedChildFrames data is computed and propagated on scroll events.  The frame data is used in ListView by the onChangeVisibleRows prop.  When this prop is not defined, unnecessary computation in ScrollView should not be performed.

Reviewed By: sahrens

Differential Revision: D5174898

fbshipit-source-id: e3eaed8760b76becf14dfeb00122bdebdaeae4ef
2017-06-08 12:03:02 -07:00
Jean Regisser 5114b61b5e Add support for flashScrollIndicators on iOS
Summary:
Flashing scroll indicators is a standard behavior on iOS to show the user there's more content.

Launch RNTester on iOS, go to the ScrollView section, tap the "Flash scroll indicators" button.
You'll see this:

![Flash scroll indicators](https://cloud.githubusercontent.com/assets/57791/26250919/ebea607a-3cab-11e7-96c6-27579cc809ab.gif)

I've exposed the method `flashScrollIndicators` on all scrolling components that were already exposing a `scrollToXXX` method so it's usable from those components using a ref.

Let me know what you think.
Closes https://github.com/facebook/react-native/pull/14058

Differential Revision: D5103239

Pulled By: shergin

fbshipit-source-id: caad8474fbe475065418d771b17e4ea9766ffcdc
2017-06-06 13:06:48 -07:00
Chris Knepper cc1a4b0915 Clarify documentation for ScrollView component
Summary:
The documentation for the prop `scrollEnabled` on the `ScrollView` component does not clarify that scrolling is still possible by calling `scrollTo` on the view ref.

Please see [this expo snack demo](https://snack.expo.io/BJKTVMM-Z) showing scrolling is allowed while `scrollEnabled` is `false`.

This PR makes the documentation for this prop more clear, in that setting it to false will only disable scrolling by touches, not universally.

In my opinion, this also raises the question of a need for an additional prop which would disable all scrolling, even when calling `scrollTo`.

I have attached a screenshot of what this part of the documentation looks like with my edit:

![screen shot 2017-05-23 at 3 38 59 pm](https://cloud.githubusercontent.com/assets/4976096/26374045/e73a035e-3fd1-11e7-93cd-3617c4ac4db8.png)
Closes https://github.com/facebook/react-native/pull/14140

Differential Revision: D5138593

Pulled By: shergin

fbshipit-source-id: db1a5f9c8ac41ecfce952e7b1fce9428b2068162
2017-05-26 12:48:37 -07:00
James Isaac 48156b7967 Fix ScrollView documentation markup
Summary:
Documentation for `ScrollView` was not correctly marked up, causing it to render incorrectly on the website.  See for example https://facebook.github.io/react-native/docs/scrollview.html#keyboarddismissmode - what should be a bullet list of possible values has been collapsed into a single paragraph.

I've added the missing linebreaks and backticks, for consistent formatting with other documentation pages, such as https://facebook.github.io/react-native/docs/view.html
Closes https://github.com/facebook/react-native/pull/14141

Differential Revision: D5120360

Pulled By: javache

fbshipit-source-id: 74b0f87c2a34f59ddf540ee2575b1b61c37d694f
2017-05-24 05:35:25 -07:00
Neo 872fbc27fe fix stickySectionHeader re-render issue
Summary:
Close #13500

I've been bothered by this issue for quite a long time, finally get some time to look into it.

I find the root cause is that after a prop of the native driven node is assigned with a plain value, if you set it to be a `Animated.Value` again , it will take no effect any more, so I just keep it be a `Animated.Value` all the time.

`value --> Animated.Value () --> value () --> Animated.Value ()`

ping janicduplessis
Closes https://github.com/facebook/react-native/pull/13885

Differential Revision: D5077094

Pulled By: javache

fbshipit-source-id: 3fb5d8196d94101200394b2bb2b95c776fb1d2f3
2017-05-22 03:30:27 -07:00
Janic Duplessis 0518a0ba12 Fix sticky headers when rerendering
Summary:
There was an issue that sometimes sticky headers would stop moving when re-rendering because we did not reattach events properly. This makes sure that we always detach and reatach on rerender in case the scroll view ref changes.

**Test plan**
Tested that this fixes issues with sticky headers we discovered when updating Expo to RN 0.44.
Closes https://github.com/facebook/react-native/pull/14012

Differential Revision: D5094418

Pulled By: javache

fbshipit-source-id: a56050ae786712e8a3de2a6e3b4e8749a2fde86e
2017-05-19 03:35:04 -07:00
Fran e974798656 Udpate scrollTo example
Summary:
This PR updates the example of scrollTo that uses `;` instead of `,` to separate x, y and animated values.
Closes https://github.com/facebook/react-native/pull/13318

Differential Revision: D4913285

Pulled By: javache

fbshipit-source-id: 02c219fbeae0f9e3b63f4b64eb4cca34868641c1
2017-04-19 04:36:09 -07:00