Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for react-native-screen 's createNativeStackNavigator #14

Open
hirbod opened this issue Dec 29, 2019 · 72 comments
Open

Support for react-native-screen 's createNativeStackNavigator #14

hirbod opened this issue Dec 29, 2019 · 72 comments
Labels
enhancement New feature or request help wanted Extra attention is needed

Comments

@hirbod
Copy link

hirbod commented Dec 29, 2019

Hi,

would be awesome if this lib would support

import createNativeStackNavigator from 'react-native-screens/native-stack';

since the performance of native-stack is awesome and absolutely no comparison to the usual createStackNavigator

@hirbod hirbod changed the title Support for react-native-screen Support for react-native-screen 's createNativeStackNavigator Dec 31, 2019
@IjzerenHein IjzerenHein added the enhancement New feature or request label Jan 16, 2020
@IjzerenHein
Copy link
Owner

Nice, that would indeed be very cool. I'm not sure it's possible though as that navigator needs to expose the transition progress as an Animated Value.

Would be great if someone could do some research on this on post the findings here.

@hirbod
Copy link
Author

hirbod commented Jan 17, 2020

Well I think we need to ask for support @kmagiera or @satya164 since they are building that stuff on the new navigation v5 and react-native-screens

@nandorojo
Copy link

This would be great!

@IjzerenHein IjzerenHein added the help wanted Extra attention is needed label Jan 27, 2020
@Jarred-Sumner
Copy link

software-mansion/react-native-screens#317

@bogdansoare
Copy link

Would be awesome to have this implemented

@hirbod
Copy link
Author

hirbod commented Apr 19, 2020

Instead of createNativeStackNavigator it should support react-native-screens/native-stack (which was moved from react-navigation to react-native-screens).

Its still a pretty similar approach but a totally different API.
https://github.com/software-mansion/react-native-screens/tree/master/native-stack

Sad that its "most likely not to be supported" (I've read this on your readme), since the native-stack performance is outplaying the JS navigation.

@mrousavy
Copy link

mrousavy commented Jun 2, 2020

I'm not sure if it's the fault of the JS navigation library, a React-Native bug, a react-navigation-shared-element bug or an Image rendering bug, but on bigger iPhones (such as iPhone X, iPhone 11, etc.) the animation is really laggy. (noticeable micro-stuttering)

Demo in slow-mo:

iPhone 8, very smooth
iPhone 11 Pro, very stuttery

Hopefully we will get an update soon at software-mansion/react-native-screens#317 👀

@mrousavy
Copy link

mrousavy commented Jun 10, 2020

The wix/react-native-navigation library supports shared element transitions aswell, I haven't looked into the code much but it looks like their approach is to create a transitions queue which will get worked on batch-wise. They're searching the UIManager for a given View by it's ID (see: this) and then create the animations (text interpolation, rectangle scaling, ...) here. Isn't react-native-screens/native-stack essentially doing the same? Here's the Stack Transition Delegate

@mrousavy
Copy link

mrousavy commented Aug 5, 2020

Could software-mansion/react-native-screens#499 be of any help?

@Irshadmirza
Copy link

I have a problem when Im going from home screen to details screen after press back image get stucked in the home screen,
and if i press home button on bottom tab navigator its not going back.
can anyone please help me out?
thanks in advance

@numandev1
Copy link

@IjzerenHein Any updates on this? 👀

@mrousavy
Copy link

SWM is working on exposing the transition progress, which is exactly what we need for the Shared Element Transitions: software-mansion/react-native-screens#890

I don't know if they expose it via a default RCTEventEmitter (JS Bridge) or if it's going to be sync on the UI thread (REA v2) though

@numandev1
Copy link

@mrousavy it is the kind of listener that will give us a callback of every frame. onTransitionProgress I think we have to add support for createSharedElementStackNavigator after software-mansion/react-native-screens#890 merge

@mrousavy
Copy link

so that PR was merged and I've DM'd Hein to ask him if he wanted any help in implementing the native stack support :)

@hirbod
Copy link
Author

hirbod commented Aug 26, 2021

My thread has 21 likes. Let's create a Moneypool and each of us throws 100 € in it as a motivation for @IjzerenHein to support native-stack!

@haibert
Copy link

haibert commented Aug 26, 2021

@hirbod I agree with this! I’m sure many people would be willing to support since it’s such a coveted feature.

Our company is going to make a bigger contribution to Hein already to get this done and I have spoken with Hein.

I was hoping we can gather people with a following on Twitter like @nandorojo @mrousavy to tweet out a funding link and see if we can get further “crowd funding” for such an awesome cause. I’m sure expo will give us a retweet to increase exposure.

@nandorojo
Copy link

@nandorojo
Copy link

I'd gladly donate $100 to make this feature happen. @IjzerenHein does GitHub sponsors work?

@hirbod
Copy link
Author

hirbod commented Aug 26, 2021

The reason why I started the pool is that sponsors are recurring payments. If trusting me is an issue I am open to anybody with better reputation to take over.

Since I can't use this library without native stack support right now, it's mandatory for me to have that support first.

@nandorojo
Copy link

Since I can't use this library without native stack support right now, it's mandatory for me to have that support first.

Same here.

The reason why I started the pool is that sponsors are recurring payments.

One-time payments are allowed on GitHub, but @IjzerenHein would need to add it as an option.

Let’s just wait for Hein to return from his vacation, and he can tell us what the best way to pay him would be

@haibert
Copy link

haibert commented Aug 26, 2021

Our company is willing to do a 700 dollar one time payment so far. Hopefully with the crowd funding we can get to a good point. But Fernando's right lets see what Hein decides at the end of the day.

@IjzerenHein
Copy link
Owner

Hello everyone! Thanks for all the willingness to sponsor and the encouragement regarding the native-stack implementation. It's really heart-warming to see ❤️
I've created an official money-pool for collecting donations to make this is reality.
Love, Hein
https://paypal.me/pools/c/8Cyt3ED5wV

@nandorojo
Copy link

nandorojo commented Sep 1, 2021

Screen Shot 2021-09-01 at 1 22 49 PM

$100 sent on behalf of beatgig.com! Could not be more excited for this feature.

I'll gladly sponsor more for web support as well after native stack. Thank you @IjzerenHein!

@hirbod
Copy link
Author

hirbod commented Sep 1, 2021

$100 sent! Web support would be huge aswell, but afaik there is already some decent web support irc.
I removed my Moneypool!

@hirbod
Copy link
Author

hirbod commented Sep 21, 2021

Nice! So we're 15$ short :D. I have high hopes someone will fill this gap soon ;)

@davesimtech
Copy link

I was just wondering if transitions on gestures (e.g. swipe back) would be something that's possible with native stack compared to the js stack?

@haibert
Copy link

haibert commented Oct 12, 2021

@IjzerenHein @davesimtech this would be absolutely the most useful thing! Having to disable gestures from the navigation and implementing a pan gesture handler becomes a pain when the content of the given page has scrollables.. :/
Do you think its possible @IjzerenHein ?

@IjzerenHein
Copy link
Owner

Hey guys, the money-pool has been closed and in total $2000+ has been collected. I would like to thank everyone who contributed and especially @haibert and the react-navigation Open Collective for their generous contributions. Many thanks!

I hope to find some time soon to continue work on this. I'm currently working on 3 projects and I don't have any spare time atm. I expect to have some time next month and continue work on this.

best regards, Hein

@IjzerenHein
Copy link
Owner

@IjzerenHein @davesimtech this would be absolutely the most useful thing! Having to disable gestures from the navigation and implementing a pan gesture handler becomes a pain when the content of the given page has scrollables.. :/ Do you think its possible @IjzerenHein ?

Well that will depend on the lifecycle events that are emitted by the stack navigator. If it emits start/stop events and updates the animated-value, then theoretically it should work

@haibert
Copy link

haibert commented Oct 14, 2021

@IjzerenHein @davesimtech this would be absolutely the most useful thing! Having to disable gestures from the navigation and implementing a pan gesture handler becomes a pain when the content of the given page has scrollables.. :/ Do you think its possible @IjzerenHein ?

Well that will depend on the lifecycle events that are emitted by the stack navigator. If it emits start/stop events and updates the animated-value, then theoretically it should work

I see, if you make it happen it would be absolutely amazing ❤️ maybe with a prop, animateOnGoBack={true} which can be added to the stack or screen options? Which ever one makes sense.. it would probably be the default behavior everyone wants from this amazing library.

@hirbod
Copy link
Author

hirbod commented Nov 24, 2021

Hi @IjzerenHein,

could you please provide some insights and transparency on the development? Everything started kinda cool and motivated but after the 8th of September, nothing new happened. First it has been 2 weeks, then there was no spare time at all and you wanted to invest some time this month but nothing has happened and you’re remaining silent on the status.

I understand that you have 3 other projects running but things haven’t sound like that when we’ve been collecting.

I’ve donated 200$ into a library I can’t use in its current state and would kindly ask to see if there is a realistic ETA. I am worried that we will miss out Expo SDK 44, which would cause another 3 months of waiting time for us Expo users.

I hope you don’t get me wrong!

@IjzerenHein
Copy link
Owner

Hey guys, sorry for the long waits but I have resumed development.

I've also put up a Sponsors section in the readme, but I was not able to locate everyone who donated.
https://github.com/IjzerenHein/react-navigation-shared-element#sponsors
For those who donated and are not in the list yet, please let me know what your GitHub user-account is so I can add you.

@hirbod

I’ve donated 200$ into a library I can’t use in its current state and would kindly ask to see if there is a realistic ETA. I am worried that we will miss out Expo SDK 44, which would cause another 3 months of waiting time for us Expo users.

You're assuming that there are native changes needed. This might be needed, but for now I have no reason to believe that this is the case though. All work done so far is pure JavaScript and can be updated anytime.

@hirbod
Copy link
Author

hirbod commented Nov 27, 2021

@IjzerenHein thank you very much, these are good news!

@hirbod
Copy link
Author

hirbod commented Jan 25, 2022

@IjzerenHein any news on the progress?

@IjzerenHein
Copy link
Owner

Status update (as I send to a stakeholder by email)

I have not not been able to work on it this month. I injured my back earlier in Januari, but luckily everyone is fine again.
And at the moment I am putting all my time into reaching a deadline for a client, and another client also requires attention for their app launch.

The current status is that the JS part is about finished in terms of functionality. I still need to create PRs in react-navigation to make some changes there. As for performance and timing. That is the biggest problem. I've sped up the time it requires react-navigation-shared-element to trigger the transition, in order to have a smooth transition, but that has revealed new problems. For some reason, the layout measurement is incorrect when snapshotting the views earlier. I'm pretty sure it has something to do with how RN does layouting or something with react-native-screens, but that requires further investigating and deeper probing. It's a tough problem for which I really need to dedicate some time to understand (and hopefully fix).

@hirbod
Copy link
Author

hirbod commented Mar 7, 2022

@IjzerenHein it's been 6 months now. Do you really think that's ok how you treat your sponsors?
You can't accuse us of being impatient or not understanding your situation, but now I've reached the point where I feel really screwed.

I have brought the whole thing with haibert to work and it comes absolutely nothing more from you.

I'll wait until the end of the month, otherwise I expect a refund.
Exactly this kind of stuff is the reason for people developing trust issues and being extremely careful funding projects or developers.

@MauriceNino
Copy link

@hirbod I don't think you understand what a donation is. You willingly supported an open source creator for a library that he has already put great efforts in to, in the hopes that he is then motivated to implement a feature you would like to see. But that is not how Open Source works. You did not pay for a product, and you are not entitled to any return on that money.

If you absolutely need this feature, create it. Fork the library and create your own version, or create a pull request and add the features you want.

If @IjzerenHein gives you a refund or not is his decision, but I would definitely not. He is putting his clients (who probably paid for a certain performance/product) and his health first, and an open source project second. I don't think there is anything wrong with that.

@hirbod
Copy link
Author

hirbod commented Mar 22, 2022

@MauriceNino I did not make a donation, I funded for this specific feature. I am not using this library, because it has this missing piece. I also came up with the idea to collect this funds FOR THIS SPECIFIC feature. Not more, not less. Do your research until you try to tell me how kickstarting/funding works.

I am sponsoring PLENTY open source projects. I am donating couple of hundreds every month on open source projects (I am changing them every month to show my appreciation to libs I am using on a regular basis). This is something totally different and I would never do a call out on them to have anything specific developed, just asking for what they have offered through github sponsor tiers.

This one is different, since I am not using it and I wanted to kickstart this specific feature. But the project progress has been stuck for couple of months now.

@MauriceNino
Copy link

@hirbod Still, you donated (or funded, you can call it however you want...) to a progress, not a product. What if the goal is unachievable? What if it would take way too much time? You can't just pay a fixed sum of money and expect that whatever you want will be done.
Sure the author may have communicated it better, but he is not obligated to complete a feature for you, unless you set up a legal contract with him (and on the moral side: pay him a fixed hourly rate).

There is also no GitHub Sponsors tier that says "You earn the right to get a feature in a set amount of time". Do your own research before telling me how to do mine.

Also, I don't give a damn what you donate to other projects and I also don't care if you use this library or not? Bringing up how generous you are doesn't prove your point, nor add anything to your argument.

@mrousavy
Copy link

mrousavy commented Mar 22, 2022

I don't want to take any side in this argument here, but also note that Hein is a very good developer and $200 pays for about 1 or 2 hours of development in this business. That's not a lot of time, we can't expect a car to be built for $200 either.

@hirbod
Copy link
Author

hirbod commented Mar 22, 2022

@mrousavy I am not saying it is much. But the whole campaign gathered 2k, thats a decent amount for a feature imho.
I am just speaking for myself, that I did not donate money, I funded for something. Thus I except some transparency and some ETAs. Its been more than 6 months now. I would rather donate that 200 bucks to an Ukrainian fund (which I also already did)

@MauriceNino
Copy link

@hirbod It is a decent amount, I'm not saying it isn't - I am just trying to tell you that you are not obligated to get anything for your money. It doesn't matter if you think it is a donation, or not.

If you think you have been wronged, try talking to GitHub about it, but I am pretty sure they will tell you more or less the same thing.

Also, please stop bringing up all your other donations, the humblebragging is just weird.

@hirbod
Copy link
Author

hirbod commented Mar 22, 2022

@MauriceNino

Still, you donated (or funded, you can call it however you want...) to a progress, not a product.

It is a big difference if you donate or fund something.

What if the goal is unachievable?

If a goal is unachievable, then just be transparent and we can move on. I also lost money and time on kickstarter. This is basically the same: you fund for something with risks, but at least get some insights, ETAs etc. There has not been much traction on this project lately anyway. It feels like it has been frozen.

There is also no GitHub Sponsors tier that says "You earn the right to get a feature in a set amount of time"

The tiers are promises the developers make by themselves. Some do not have any, some have. I was referring to those who do pledge what you can except from a tier. This one was funded trough PayPal Moneypool anyway.

Also, I don't give a damn what you donate to other projects and I also don't care if you use this library or not? Bringing up how generous you are doesn't prove your point, nor add anything to your argument.

It is a big difference if I use this library or not. If I was a regular user of this software, I would've been quiet on the whole topic, since I have use for it and would count this in as a donation. But in its current form, it might be helpful for others, but not for me, because I am only using the native stack.

The whole reason I started this argument with you was not to prove how generous I am (which I am), but to prove that I know the difference between a donation and a funding and that I do have a lot of respect for open source software developers and I do my best to give something back. I am done arguing with you.

P.S: Don't tell me what to talk about and not and mind your own business.

@brentvatne
Copy link

i know @IjzerenHein personally and can vouch that if he had the time to work on this then he would.

it's important to have empathy and recognize that sometimes things don't go to plan. i understand that some folks are very interested in this feature, but please remember that we are all humans here trying to do what we think is best. feel free to reach out to me if you have any concerns.

@davesimtech
Copy link

As far as I'm aware the moneypool stated it would be used towards the development of the feature, however it was no guarantee that it could actually be achieved. I donated (although a rather small amount) fully aware of that situation with the hope it could be achieved and more out of support for the library and all of work @IjzerenHein has done, as it was described on the moneypool.

@IjzerenHein I know sometimes explaining what needs to be done actually takes more effort than actually doing the implementation. However, is there anything that we can do to help, any pointers for things I can look at?

@jkk
Copy link

jkk commented Mar 28, 2022

My company donated -- no hard feelings from us. "No guarantees" was literally in the moneypool description. We actually considered doing a small up-front donation, no strings attached, and another larger donation contingent upon completion, for that exact reason. But we didn't do that, so no expectations were violated. We appreciate all the work done so far!

@IjzerenHein
Copy link
Owner

IjzerenHein commented Mar 29, 2022

Dear fellow coders,

All good things come to an end. And I have decided to stop working on shared-element as it no longer fits into my life and I lack sufficient time, energy and motivation.

One of the most important reasons for that is that I haven't used shared-element myself in the last 2 years. And maintaining Open Source libs is something you do mostly because of the love and utility you have for it yourself. As I've grown older the energy to spend time on my OS libs (either in my spare time or between projects) has decreased, to the point that I get very little satisfaction from it. I'm content with how the native building blocks turned out and it's an interesting solution to a rather tricky problem. The react-navigation binding has however been a struggle from the start. When ReactNavigation@4 support was completed, ReactNavigation@5 was released, and in the beginning things were still changing and breaking at a regular pace. Supporting, testing and making sure the code-base is maintainable requires a far greater dedication than I am willing to put into it, for something I don't use myself.

Looking back I should probably not have accepted the donations/funds to work on this project/feature. But it felt like such great energy and love for the project that I wanted to give it a go. Circumstances have however not been favourable and breaking up with my GF, moving to a new place and being an emotional wreck at times have not helped. Some good progress has however been made but it's not there yet. The testing app has been extended to showcase all the tests with the native navigator. The whole lifecycle mechanism has been reworked to capture the start of the navigation faster. Temporary patches have been applied to react-navigation to fix certain issues. The current state is that it somewhat works, but there is an issue with determining the position of the target element. Which seems somehow related to the native code performing its measurement sooner in combination with react-native-screens. This requires deeper analysis and debugging in order to understand the problem and hopefully fix it.

Which brings me to this last paragraph. I would love to see that shared-element continues to exist, as it solves a problem within the react-native ecosystem. Functionally it's probably not essential, but it's one of those things that brings shine to an app, and takes the attention of the user on a journey to make for a better UI experience. I'm therefore looking for a new home or maintainer for both react-native-shared-element and react-navigation-shared-element. And I will make $1000 of the donation funds available to the person or company willing to take this on (and continue with native-stack support). Please reach out to me personally if you want to take this over or have ideas or suggestions for a new home.

peace out,
Hein

@haibert
Copy link

haibert commented Mar 29, 2022

@IjzerenHein

Really sorry to hear about your recent struggles. You did your best. Thank you for the progress that you did provide and over all mental health and life balance is more important than anything else, and Im glad you chose a path that will give you more of that. Wish you the best Hein!

@Johan-dutoit
Copy link

All the best to you @IjzerenHein! Mental health trumps everything.

Is this something the react-navigation team or SWM team could bring into their space?
Totally get it's a hard ask and both do so much to help the RN community already!

cc @satya164 & @kmagiera

@nandorojo
Copy link

@IjzerenHein - wishing you the best. The open source path can be tough. Thanks for everything you contributed. I hope someone else is able to continue your great work.

@hirbod
Copy link
Author

hirbod commented Apr 14, 2022

@IjzerenHein thanks for the statement and honesty.
Through your open statement I have of course full understanding for the process and your situation. I wish you all the best for the future.

@fukemy
Copy link

fukemy commented Aug 10, 2022

@andreialecu pay 10000$ for this help

@andreialecu
Copy link

I'm not sure what that's supposed to mean, but there's a draft PR here that is supposed to implement this into react-native-screens so if you have any bounties to throw, perhaps throw them over here: software-mansion/react-native-screens#1479

@RajeshChoudhary1700
Copy link

Uploading _fed1d2ff-2157-46aa-b3fb-ec5f465f3594.jpeg…

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests