Summary:
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.
Help us understand your motivation by explaining why you decided to make this change.
You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html
Happy contributing!
-->
The scrollToOffset method of RCTScrollView for iOS does not include bound check for the scroll offset provided to the method. This can cause the whole view to scroll out of screen if the offset provided is greater than the bounds of the View.
The same does not happen on Android, where the scroll halts once the last item of the scrollView is in the viewport.
I have added bounds check so the offset resets to the MaxOffset which makes sure the view does not scroll out of the viewport.
The issue can be observed in the following snack:
https://snack.expo.io/H1363Uo8f
To test my changes I ran the code provided in the snack above with the react-native dependency pointing to my branch. As can be see in the video attached below, the scroll halts once it hits the end of the ScrollView even if the scroll offset provided is higher than the bounds of the ScrollView. It also does not scroll up for negative scroll offset.
[IOS] [BUGFIX] [ScrollView] - Added bounds check to prevent ScrollView from scrolling to an offset which is out of bounds of the ScrollView for iOS.
Closes https://github.com/facebook/react-native/pull/17927
Differential Revision: D7014466
Pulled By: shergin
fbshipit-source-id: a817738d08e1057a4c70f43373132f88fa1461c4
Summary:
So, all initial operations can now be done synchronously (and on the main thread).
To do so, instancitate `RCTSurface` object and call `synchronouslyWaitForStage:timeout:` method like that:
RCTSurface *surface = [[RCTSurface alloc] initWithBridge:... moduleName:... initialProperties:...];
BOOL success = [surface synchronouslyWaitForStage:RCTSurfaceStageSurfaceDidInitialMounting timeout:timeout];
or
RCTSurfaceHostingView *surfaceHostingView = [[RCTSurfaceHostingView alloc] initWithBridge:... moduleName:... initialProperties:...];
BOOL success = [surfaceHostingView.surface synchronouslyWaitForStage:RCTSurfaceStageSurfaceDidInitialMounting timeout:timeout];
Reviewed By: fkgozali
Differential Revision: D7014178
fbshipit-source-id: c3c13904a3587ff2a222fa71623c40c8f30bc8af
Summary: In some embedding/interop cases (RN inside, something else outside), the interop layer has to have the ability to control (intercept, delay, perform synchronously with another stuff) mounting process. This API allows doing that.
Reviewed By: fkgozali
Differential Revision: D7014179
fbshipit-source-id: 04036095f7e60a5ff7e69025ff6066fea92eb361
Summary:
See the comment in code.
If we on the main thread on registering time, we can/will break sequentiality of registering and mounting processes doing registration asynchronously.
We need this to make sync mouting eventually possible.
Reviewed By: fkgozali
Differential Revision: D7014176
fbshipit-source-id: 110ad5e5d86e3422eac15c3b1bdb29ae04acd7e6
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
Summary:
When running with the packager in the tvOS simulator, reloading from the packager hits an assert in `RCTEventEmitter`, causing a crash. The solution is for `RCTTVNavigationEventEmitter` to check for the existence of the bridge before attempting to send an event.
Manual testing.
[IOS] [BUGFIX] [RCTTVNavigationEventEmitter.m] - Fix crash when reloading in tvOS
Closes https://github.com/facebook/react-native/pull/17797
Differential Revision: D7014975
Pulled By: hramos
fbshipit-source-id: 0bf766e87267ca8592ff0cc0b3cb4621a8e8f9b5
Summary:
This is reimagining of interoperability layer between Yoga and ShadowViews (at least in Yoga -> RN part).
Goals:
* Make it clear and easy.
* Make clear separation between "what layout what", now parent always layout children, noone layout itself.
* Make possible to interleave Yoga layout with custom imperative layout (may be used in SafeAreaView, Text, Modal, InputAccessoryView and so on).
Reviewed By: mmmulani
Differential Revision: D6863654
fbshipit-source-id: 5a6a933874f121d46f744aab99a31ae42ddd4a1b
Summary:
This change enables built-in Yoga mechanism which rounds producing layout metrics to closest "pixel" values.
See previous diff for more context.
Reviewed By: fkgozali
Differential Revision: D6889762
fbshipit-source-id: bc2eea44704db4b377e2e14fab9f67be8c935719
Summary:
> Okay, I don't remember where we first met
> But hey, admitting is the first step
This issue has a looong history.
The original algorithm was introduced by Nick Lockwood (nicklockwood Hey Nick! We miss you!) a while ago and from the very beginning this has one small error that basically makes it useless (try to find it yourself, it's fun!)
The problem was discovered and fixed twice (D4133643, D4983054), but every time we found that our <Text> infra was not ready for this, so we reverted and abandoned the change. As part of the last attempt to finally solve the issue, I ported the algorithm to Yoga where it lives today and works very well for Lytho and CK.
For now, the vision is clear:
* The basic algorithm should live in Yoga for unification and performance reasons.
* We still have to have `absolutePostion` as part of this API because it might be useful for some components which implement its own custom/non-Yoga-based layout.
* We have to enable it in RN eventually.
So, this is the first step: Removing old, broken code which we don't plan to fix and use.
Make React Native crisp again!
Reviewed By: fkgozali
Differential Revision: D6888662
fbshipit-source-id: 2e5098d9935dcbe05d66c777dad3a9ec8ac87ec3
Summary:
It's unused.
Use `display` prop instead to control visiblity of the view.
Reviewed By: fkgozali
Differential Revision: D6888104
fbshipit-source-id: dd37a365033ec36bdfcfa305ec6a965a10dec2cd
Summary: Another juicy leftover from old Text implementation.
Reviewed By: fkgozali
Differential Revision: D6887942
fbshipit-source-id: d0363d06d566554c03d0ae3293597daf9c387028
Summary: This is leftovers from last <Text> reimplementation; nobody uses it and it does not hooked up with UIManager.
Reviewed By: fkgozali
Differential Revision: D6887795
fbshipit-source-id: 9e2e29af4ba959270096eeb494666d1cacaeba32
Summary:
I've talked to several major community users, and they're all ok with deleting this
code. There's several doc fixes which will make it easier for third
party developers which should land about the same time this will.
Also buried along with it is RCTJSCExecutor.
Reviewed By: javache
Differential Revision: D6880781
fbshipit-source-id: b4cb1143def6fd23a96290e478fa728adbedacd3
Summary:
Trivial.
Special thanks to janicduplessis
Created from Diffusion's 'Open in Editor' feature.
Reviewed By: fkgozali
Differential Revision: D6863932
fbshipit-source-id: d40a30271adc5c8d47149ab920e2ac11158ab756
Summary:
This makes RCTTouchHandler follow the same logic when sending touch event
coordinates as `UIManager.measure`.
This is important as UIManager.measure is used in `Touchable.js` aka the mother
of all touch events in RN.
In particular, this will make touch events correctly handled for places where RN is embedded into other screens.
Reviewed By: shergin
Differential Revision: D6838102
fbshipit-source-id: 70cad52606ea931cb637d8aa2d4845818eea0647
Summary:
So in v0.52.0 space-evenly is introduced but not yet implemented (1050e0b by woehrl01). This pull request implements the space-evenly.
Manual Testing.
[IOS] [FEATURE] [Yoga] Adding space-evenly on justify-content in iOS
[ANDROID] [FEATURE] [Yoga] - Adding space-evenly on justify-content in Android
Closes https://github.com/facebook/react-native/pull/17805
Differential Revision: D6858294
Pulled By: shergin
fbshipit-source-id: 7a705ca05f58603ef4588e1bfd16c16a78f8a390
Summary:
Fix issues with the react-native CLI when linking iOS and tvOS libraries to a project created with `react-native init`. (#13783)
Verified the changes against test project at https://github.com/dlowder-salesforce/react-native-link-test. Both `react-native link react-native-svg` and `react-native unlink react-native-svg` work correctly on this project. Added new unit test for the new file added to `local-cli/link/ios`.
[CLI] [BUGFIX] `react-native link` has been fixed to correctly link iOS and tvOS targets.
[IOS] [BUGFIX] `react-native link` has been fixed to correctly link iOS and tvOS targets.
Closes https://github.com/facebook/react-native/pull/17231
Differential Revision: D6837567
Pulled By: hramos
fbshipit-source-id: 234d3d3966ae1b89cd16a37c95d303553f7ba5f5
Summary: It's been more than two years; I think everyone already migrated and learned the new behavior.
Reviewed By: emilsjolander
Differential Revision: D6829885
fbshipit-source-id: a86d56fb7235a137e9ce6e360d7ae2224b047313
Summary:
[this commit](2e1707d0e6) which was just a small refactor broke refreshControl behavior - if we render FlatList with refreshing=true, the refreshControl won't be visible on initial render.
The problem is, the [previous beginRefreshing method](2e1707d0e6 (diff-cfafa8d7e42ab87ab863f917e187a4aeL51)) was renamed to `beginRefreshingProgramatically` and the old call was left in one place [here](2e1707d0e6 (diff-cfafa8d7e42ab87ab863f917e187a4aeR47)).
Now, I am not sure what kind of jumping the mentioned commit was fixing, but since this fix only concerns the initial render, I believe it will not influence the jumping fix.
I have tested this locally in my app, can provide a video if needed.
none
[IOS] [BUGFIX] [RefreshControl] - Make sure refreshControl shows up on initial render if specified
Closes https://github.com/facebook/react-native/pull/17727
Differential Revision: D6827402
Pulled By: shergin
fbshipit-source-id: 25849244e87af54f25d636b6ade7adcf88958980
Summary:
This is a complete rewrite of RCTText, the part of React Native which manages Text and TextInput components.
Key points:
* It's understandable now. It follows a simple architectural pattern, and it's easy to debug and iterate. Text flow layout is a first-class citizen in React Native layout system now, not just a wired special case. It also brings entirely new possibilities such as nested interleaving <Text> and <View> components.
* All <Text>-specific APIs were removed from UIManager and co (it's about ~16 public methods which were used exclusively only by <Text>).
* It relies on new Yoga measurement/cloning API and on-dirty handler. So, it removes built-in dirty propagation subsystem from RN completely.
* It caches string fragments properly and granularly on a per-node basis which makes updating text-containing components more performant.
* It does not instantiate UIView for virtual components which reduces memory utilization.
* It drastically improves <TextInput> capabilities (e.g. rich text inside single line <TextInput> is now supported).
Screenshots:
https://cl.ly/2j3r1V0L0324https://cl.ly/3N2V3C3d3q3R
Reviewed By: mmmulani
Differential Revision: D6617326
fbshipit-source-id: 35d4d81b35c9870e9557d0211c0e934e6072a41e
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
Summary:
Another trivial sugar/helper to access computed by Yoga layout metrics.
We will use it soon in the new Text render/layout engine.
Reviewed By: mmmulani
Differential Revision: D6671979
fbshipit-source-id: d36933415c2fa50bae5cc171434d8f0b281955b7
Summary: Waiting for layout is now available on main thread.
Reviewed By: mmmulani
Differential Revision: D6719836
fbshipit-source-id: ef655095e999df5f77e69c5931459cce1aaeb1f0
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
Summary: Because setting `intrinsicContentSize` for `RCTSurfaceRootView` doesn't have much sense.
Reviewed By: mmmulani
Differential Revision: D6701107
fbshipit-source-id: 259cdd27339bba3e8c9f98b6ca34affeb87f298c
Manman Ren
Ken Woo
siddhantsoni
Kevin Gozali
Valentin Shergin
Pritesh Nandgaonkar
Sophie Alpert
Douglas
Mehdi Mulani
Paco Estevez Garcia
Martin Arista
Ben Nham
Dmitry Zakharov
Marc Horowitz
Ray Shih
Agastya Darma
Semen Zhydenko
Adam Putinski
Vojtech Novak
Alex Dvornikov
Spencer Ahrens
