Showing Instabug
This section covers how to set the user action that initializes Instabug, as well as how to customize what appears to your app users after the SDK is shown for React Native apps.
By default, Instabug is shown when the device is shaken. This can be customized to several other modes that show the SDK. You can also invoke the SDK manually from a custom gesture or a button you add to your app.
Invocation Events
You can set the SDK to be invoked when your users do one or more of the following actions:
- Shake device
- Take a screenshot
- Tap on a floating button shown above your app's UI
- Two-finger swipe from right to left
- None (manual showing)
You have the option to set one or multiple invocation events. To customize the invocation event, pass one of the values of the Instabug.invocationEvent
enum when starting the SDK.
// Open index.ios.js
Instabug.startWithToken('YOUR_TOKEN', [Instabug.invocationEvent.floatingButton]);
//Second argument takes an array of invocation events
// Open android/app/src/main/java/[...]/MainApplication.java
// Shange the invocation event
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new RNInstabugReactnativePackage.Builder("TOKEN",MainApplication.this)
.setInvocationEvent("shake", "button", "screenshot")
.setPrimaryColor("#1D82DC")
.setFloatingEdge("left")
.setFloatingButtonOffsetFromTop(250)
.build()
}
You can find the possible invocation events below.
Instabug.invocationEvent.none
Instabug.invocationEvent.shake
Instabug.invocationEvent.screenshot
Instabug.invocationEvent.twoFingersSwipe
Instabug.invocationEvent.floatingButton
"none"
"shake"
"screenshot"
"swipe"
"button"
Floating Button
If you are using the floating button, you can set its default position as explained here.
None
Use the "none" event if you want to invoke the SDK manually in order to prevent the SDK from being shown through the other events.
Shaking Threshold
If you are using the shaking gesture as your invocation event, you can set how sensitive the device should be to the shaking. The default value is 350. The higher the value, the less sensitive the device will be to shaking.
//iPhone
BugReporting.setShakingThresholdForiPhone(iPhoneShakingThreshold);
//iPad
BugReporting.setShakingThresholdForiPad(iPadShakingThreshold);
BugReporting.setShakingThresholdForAndroid(androidThreshold);
Changing the Invocation Event
If you want to change the invocation event to any of the other supported events, you can do so at runtime as shown below.
BugReporting.setInvocationEvents([Instabug.invocationEvent.shake])
Manual Showing
If you want to show the SDK manually, use the show
method.
Instabug.show();
Changing the Invocation Mode
By default, when the Instabug SDK is shown, a popup appears to your app users that asks "How can we help you?" with options for them to report a bug ("Report a problem"), share feedback ("Suggest an improvement"), or send you a message ("Ask a question") if In-App Chat is supported in your plan.
Instead of showing this Prompt Options menu that lets your users choose what they want to do, you can skip this step and take users directly to the bug or feedback reporting flow or chat pages.
For bug and feedback reporting, you can also specify invocation options as described here.
// Compose a new bug report
BugReporting.showWithOptions(BugReporting.reportType.bug, [BugReporting.option.emailFieldHidden]);
// Compose a new feedback
BugReporting.showWithOptions(BugReporting.reportType.feedback, [BugReporting.option.emailFieldOptional]);
// Compose a new chat
Chats.show();
// Show the previous chats list
Replies.show();
Updated about 5 years ago
Learn how to customize the welcome message to your users or maybe even report your first bug.