Rewrite stack navigator by satya164 · Pull Request #131 · react-navigation/stack

satya164 · 2019-05-24T22:51:49Z

This is a re-implementation of stack navigator using kmagiera/react-native-reanimated.

TODO

Reach consensus regarding: refactor: store more info about the transitions in the state core#64, either merge it or figure out an alternative way
Investigate jank around the middle of the transition animation
Get listeners for animation end to fire reliably
Integrate kmagiera/react-native-screens: Try to setup react-native-screens reanimated-stacks#3
RTL support
Support customising background color in headerStyle
Ensure screen re-renders when screenProps change

osdnk · 2019-06-21T19:08:01Z

src/views/Stack/Stack.tsx

+              index === self.length - 1
+                ? 1
+                : Platform.OS === 'android'
+                ? cond(eq(next, 1), 0, 1)


I think we may get rid of screens support for iOS now. @kmagiera promised me to fix lines breaking this implementation.

Right, I suggest to turn off screens on iOS for the time being. Even when fixed there are still going to be some people on the old version (via expo for example). I am also confident that the fix may not be necessary, we already use screens and panning works fine with gesture handler in the non-reanimated implementation AFAIK

@kmagiera
How did it happen that it worked 🤔?

Even when fixed there are still going to be some people on the old version (via expo for example)

I think this is not a problem coz it's enabled explicitly by the user by calling useScreens

@brentvatne wdyt? should I remove screens usage?

if it isn't then we can just disable screens on iOS temporarily :)

What is the issue? If @kmagiera doesn't have time maybe someone else can fix it?

I wonder how it was possible that the prev version of stack was working

I'm not sure. @brentvatne did last one and you did this one XD

Though I only had this problem on Android when implementing it here react-navigation/reanimated-stacks#3

Otherwise the header background below shows up when header mode is none

brentvatne · 2019-07-04T20:17:02Z

in uikit example:

push a screen
push a screen with no header
go back and the content is under the header

satya164 · 2019-07-04T20:22:50Z

@brentvatne is it alpha or latest commit?

Previously, the header height wasn't stored per screen. This resulted in header height always referring to the one in last mounted screen. As a result, the top margin for screens were incorrect. This resulted in bugs such as when you go to a screen with no header, header height will stay 0 even after navigating back. This commit stores the height for each screen separately, handling this properly.

christoph-jerolimov · 2019-07-08T05:34:15Z

Hey @satya164, create work in the reanimated-stacks alpha branch. 👍

I use already the branch and the alpha versions of the react-navigation-stack. Why did you disable screens (f04b9bf) in the latest alpha for modal dialogs? Using screens and also the new iOS 13 effect was one reason for me to use already the alpha.

(edit: After updating from alpha.2 to alpha.5 is lost the new iOS 13 modal effect. I switched back to the old version for now.)

satya164 · 2019-07-08T09:18:59Z

Why did you disable screens in the latest alpha for modal dialogs

Because for modals such as ModalPresentationIOS, the previous screen needs to be visible underneath. If screens is enabled, the previous screen will be removed from the tree, and screens has a bug which doesn't make it possible to keep last 2 screens active at the same time.

The only things mode: 'modal' does are pick a default transition and disable screens. You don't have to use it, you can specify custom transition.

After updating from alpha.2 to alpha.5 is lost the new iOS 13 modal effect

Please read the release notes: https://github.com/react-navigation/stack/releases/tag/v2.0.0-alpha.3

satya164 · 2019-07-08T10:23:04Z

Merging this to master and continue development from there. This will make sure any new PRs and issues we receive are against the latest changes.

christoph-jerolimov · 2019-07-08T11:32:36Z

Thanks for the fast feedback @satya164

With moving the TransitionPreset attributes into the defaultNavigationOptions it works great with alpha.5 again. 👍

satya164 changed the title ~~Rewrite stack animation~~ Rewrite stack navigator May 24, 2019

satya164 force-pushed the @satya164/reanimated-stacks branch 11 times, most recently from 4f3babe to 883a169 Compare May 31, 2019 12:41

satya164 force-pushed the @satya164/reanimated-stacks branch 18 times, most recently from 44a2442 to 2ae1ea5 Compare June 4, 2019 19:43

osdnk reviewed Jun 21, 2019

View reviewed changes

satya164 added 2 commits June 21, 2019 21:49

feat: add iOS modal presentation style

243839d

chore: release 2.0.0-alpha.2

34e12da

satya164 mentioned this pull request Jun 26, 2019

pass onTransitionStart's return value back to caller react-navigation/native#27

Closed

satya164 added 5 commits July 1, 2019 17:16

refactor: measure back label layout when not truncated

ec23b74

fix: fix broken shadows on card

8fb0da5

fix: use opacity in headerStyle

ca741b6

fix: hide background for unfocused header in fade

1f6fc61

Otherwise the header background below shows up when header mode is none

fix: fix border radius of modal presentation

7cecfcf

brentvatne mentioned this pull request Jul 4, 2019

Customizable per-screen transitions with StackNavigator react-navigation/rfcs#10

Closed

tchayen and others added 14 commits July 6, 2019 12:41

feat: allow specifying style interpolators in navigationOptions (#155)

16823e3

chore: upgrade deps

f41380f

fix: hide overflow in wipe preset

a6335bd

fix: fix typo preventing the screen from being cleaned up

f173a16

fix: disable react-native-screens on iOS

f43800b

feat: add on transition end callback (#153)

a32e43a

fix: fix back button not working in header

9d17440

chore: release 2.0.0-alpha.3

05e1f31

chore: release 2.0.0-alpha.4

973aef1

fix: don't enable screens for modal stacks

f04b9bf

fix: tweak transition spec to prevent jumping effect

3f5b903

refactor: export a modal transition preset

b3c7250

chore: release 2.0.0-alpha.5

67a942d

Conversation

satya164 commented May 24, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

osdnk Jun 21, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

satya164 Jun 21, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

brentvatne commented Jul 4, 2019

Uh oh!

satya164 commented Jul 4, 2019

Uh oh!

christoph-jerolimov commented Jul 8, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

satya164 commented Jul 8, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

satya164 commented Jul 8, 2019

Uh oh!

christoph-jerolimov commented Jul 8, 2019

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

satya164 commented May 24, 2019 •

edited

Loading

osdnk Jun 21, 2019 •

edited

Loading

satya164 Jun 21, 2019 •

edited

Loading

christoph-jerolimov commented Jul 8, 2019 •

edited

Loading

satya164 commented Jul 8, 2019 •

edited

Loading