Requirement: How to go back specific page when use Android physical back key about hyperview HOT 7 CLOSED

Hi @terryatgithub , in your code sample what does hyperviewRef refer to? I'm guessing this may be causing problems.

As to your question about supporting question about supporting the Android back button:
I think what is needed is not a custom behavior, but a new trigger. The action you want (navigate) already exists, but the trigger (back-button-press) does not exist:

<behavior trigger="back-button-press" action="navigate" href="/home.xml" />

This trigger would need to be added to the HyperRef class, adding an event listener to componentDidMount and cleaning up in componentWillUnmount.

One thing I'm not sure about: currently the functionality of "back" is handled by react-navigation library. So it's possible that pressing back will always unwind the navigation stack, even if we add other behaviors on top of it. I'm not sure about the best way to address this. @flochtililoch or @ashwinibm any thoughts?

from hyperview.

hi @adamstep ,

1. hyperviewRef is a standard react ref that refer to the Hyperview component,
   both two methods will fail the same error as above mentioned pic.

const androidBackBehavior = {
    action: 'android-back-action',
    callback: (element: Element, onUpdate: HvComponentOnUpdate, getRoot: HvGetRoot, updateRoot: HvUpdateRoot) => {
      const href = element?.getAttributeNode('action-href')?.nodeValue;
      const action = element?.getAttributeNode('action-action')?.nodeValue;

      // method 1: error
      hyperviewRef.current.onUpdate(href, action, {}, {}); 

     // method 2: the same error too.
      onUpdate(href, action, {}, {}); 

    }
  };                                                                                           
                                                                                               
 <Hyperview                                                                         
        ref={hyperviewRef} // <-------------------- _this is the ref_ 
        back={goBack}
        closeModal={closeModal}
        fetch={(input: any) => {
          return fetchWrapper(input, customHeaders);
        }}
        navigate={navigate}
        navigation={navigation}
        openModal={openModal}
        push={push}
        replace={navigation.replace}
        formatDate={formatDate}
        behaviors={[androidBackBehavior]}
 />

2. will there be the same error if use trigger back-button-press?
3. Is there specific schedule to implement this feature? It's a function that will affect the user experience flow.
   thanks a lot.

from hyperview.

1. will there be the same error if use trigger back-button-press?

I don't think there will be an error in this case, because we don't need the ref passed to the behavior. I believe that's causing the error, the ref gets replaced after every update.

2. Is there specific schedule to implement this feature? It's a function that will affect the user experience flow.

I will discuss it with the team tomorrow evening, will have a better idea at that time. Like I said, this implementation is a bit tricky since we need to account for the default behavior of react-navigation library.

from hyperview.

ok, i see. thank you so much, and looking forward to good news.

from hyperview.

Hi @terryatgithub , in your code sample what does hyperviewRef refer to? I'm guessing this may be causing problems.

As to your question about supporting question about supporting the Android back button:
I think what is needed is not a custom behavior, but a new trigger. The action you want (navigate) already exists, but the trigger (back-button-press) does not exist:

<behavior trigger="back-button-press" action="navigate" href="/home.xml" />

This trigger would need to be added to the HyperRef class, adding an event listener to componentDidMount and cleaning up in componentWillUnmount.

One thing I'm not sure about: currently the functionality of "back" is handled by react-navigation library. So it's possible that pressing back will always unwind the navigation stack, even if we add other behaviors on top of it. I'm not sure about the best way to address this. @flochtililoch or @ashwinibm any thoughts?

Perhaps we could use the BackHandler provided by react-native to do some custom handling? For example, to disable going back on some screen or going back to the root screen or navigate to a certain screen. May need to watch out for react-navigation behaviors like you mentioned.

from hyperview.

It's probably better to handle this at the app level. I've created an example on the demo app that creates a wrapper component where we can customize android back handling. It's a simplified example but one can adapt this to check other route params for example.
#272

from hyperview.

@ashwinibm it's a great idea, I will adapt it and try to see how to handle different navigation requirements in different pages.
thanks a lot.

from hyperview.