Use copilot with custom native-base components about react-native-copilot HOT 17 CLOSED

You can add:

copilot({
    androidStatusBarVisible: false
}),

from react-native-copilot.

@mohebifar I found that

1. In style.js
   tooltipText: { }

When I added like 

tooltipText: {
    color: 'rgba(20,20,20,1)'
  }

Then I am able to see the color for text in Android.

2. In CopilotModel.js file, I found one condition that

if (this.props.androidStatusBarVisible && Platform.OS === 'android') {
obj.top -= StatusBar.currentHeight; // eslint-disable-line no-param-reassign
}

   When I commented obj.top -= StatusBar.currentHeight; then I am able to see the badge number properly. 


   

from react-native-copilot.

Thank you for the quick reply. It worked for me, meaning I get a step-by-step walkthrough, but the position of the highlights doesn't match the position of the buttons.

Code:

Application:
Step 1:

Step 2:

Any idea how I can fix this?

from react-native-copilot.

@sujitpk-perennial It is really hard to figure out what the issue is without being able to reproduce it. It would be great if you could provide a very minimal expo snack or a gist to help me reproduce this.

from react-native-copilot.

Hello team, I am able to show the copilot UI for iOS properly. But for Android, the UI is not showing proper place. It is happening throughout the app. Also text also not visible. I am using "@okgrow/react-native-copilot": "^2.2.6"

from react-native-copilot.

Is it Button from 'native-base' or Button from 'react-native'? If you don't have access to the underlying component's code (being a third-party lib), one possible workaround is to wrap it within a View component.

Only "native" components can be made walkthroughable using the walkthroughable helper.

https://github.com/okgrow/react-native-copilot#custom-components-as-steps

from react-native-copilot.

Could you please confirm that you're using v2.2.2?
v2.2.1 was buggy on Android having the same positioning issue and got fixed just last week.

from react-native-copilot.

I can confirm that I am using v2.2.2.

from react-native-copilot.

Okay, thanks. I'm curious to see what happens with 2.2.1.

from react-native-copilot.

I have already tried version 2.2.1, but I still have the same problem.

from react-native-copilot.

It'd be good if you share a minimal code that helps me reproduce this issue.

from react-native-copilot.

@dirkvanherpen Can you please now try v2.2.3?

from react-native-copilot.

I tried version 2.2.3 and 2.2.4, but I still have the same issues with both versions.

v2.2.3

v2.2.4

from react-native-copilot.

I have tried multiple versions to try to fix this, but I can't get the highlight parts exactly on the button.
Any idea how to fix this?

from react-native-copilot.

Facing the same issue when used with https://wix.github.io/react-native-navigation.
Need Help!!

from react-native-copilot.

@mohebifar Can you take another look at this, please?

from react-native-copilot.

@dirkvanherpen @mohebifar facing same issue in android. have you found any solution for it?

from react-native-copilot.