Tour guides in the scrollview are not showing

[eugene-zheng0208]

No description provided.

[cfnelson]

@eugene-zheng0208 Could you please provide some more details on the issue, a reproduction would be very helpful. Otherwise we wont be able to effectively assist you?

[eugene-zheng0208]

We have a fixed navbar at the top of our screen, and scrolling to our next step which is now up the screen and under the navbar means only some of the dialog is highlighted instead of the full box. Is there a way to override the highlighted area with CSS so that we can move it down? Or add in that the page scrolls fully back to the top before selecting the next item in the joyride?

[mohebifar]

I believe having a stepChange hook would be helpful. We can save a reference to the scrollView, and use that in the stepChange event listener for scrolling to the right position. We can also use promises to delay showing the next step while it's scrolling.

  componentWillMount() {
    this.props.on('stepChange', ({ step }) => {
      if (step.name === 'StepWithScroll') {
        this.scrollView.scrollToEnd();
        return new Promise(r => setTimeout(r, 300));
      }
    });
  }

@eugene-zheng0208 What do you think?

[mohebifar]

We haven't heard back on this and there is also another issue for the same issue suggesting a solution: #15
Closing this.