Installation

Gradle Android

Add this line to your build.gradle file:

implementation 'com.softnoesis.shakebug:ShakeBug:1.2.46'

You may also need to add the following to your project/build.gradle file:

buildscript {
    repositories {
        mavenCentral()
        maven { url 'https://jitpack.io' }
   }
}

Then, update the following sdkVersion to your app's `build.gradle` file:

android {
    compileSdk 33
        defaultConfig {
             ...
             targetSdk 33
             ...
        }
        ...
}

Code

1. In your Launching activity add this line to your onCreate method. This initializes Shake Bug with the default invocation event, Shake.

Java

ShakeBug.sharedInstance().initiateWithKey(this, "<Your Key>");

Kotlin

ShakeBug.sharedInstance().initiateWithKey(this,"<Your Key>");

Optional Settings

1. If you want add event to any screen or activity use following methods.

Java

ShakeBug.sharedInstance().addEventKey(this,"<Key>","<Key Value>");//pass any key or value

Kotlin

ShakeBug.sharedInstance().addEventKey(this,"<Key>","<Key Value>") // pass any key or value

2. Add the following for enabling/disabling first time tutorial screen.

Java

ShakeBug.sharedInstance().showTutorialScreenFirstTime(true); // Default value True

Kotlin

ShakeBug.sharedInstance().showTutorialScreenFirstTime(true) // Default value True

Want to know more

CocoaPods IOS

To integrate ShakeBug into your Xcode project using CocoaPods, specify it in your Podfile:

pod 'ShakeBug'

Then, run the following command:

$ pod install

Code

1. Import the ShakeBug framework header into your app delegate.

Swift

import ShakeBug

Objective-C

#import <ShakeBug/ShakeBug.h>

Note: If you are working React Native exported project then you also need to mention this line too

#import <ShakeBug/ShakeBug-Swift.h>

2. Add the following to your app delegate's application:didFinishLaunchingWithOptions: method.

Swift

ShakeBugSDK.sharedInstance().initiate(withKey: "Your Key")

Objective-C

[[ShakebugSDK sharedInstance] initiateWithKey: "Your Key"];

3. Add the following to your Info.plist to request permission to access the Photo Library.

<dict>
<key>NSPhotoLibraryUsageDescription</key>
<string>Require access for reporting bugs.</string>
</dict>

Be sure to replace with your application key which given by ShakeBug website.

Note: NSPhotoLibraryUsageDescription must be added in info.plist.

Want to know more

npm

Navigate to your React Native project directory and install shakebug-react-native

npm install shakebug-react-native

Or if you prefer to use Yarn instead of npm:

yarn add shakebug-react-native

Want to know more

Native

Native-IOS

For iOS project, developer must need to install Shakebug in xCode project using pod.

To install Shakebug SDK in xCode project. Please follow above "For iOS" guide.

Native-Android

Add this line to your build.gradle file.

implementation ("com.softnoesis.shakebug:ShakeBug:1.2.46 ")

Open package having MainActivity.java file and add following 2 lines in "onCreate" method.

ShakeBug.sharedInstance().initiateWithFlutterKey(this, " Your-API-Key");
initializeShakeDetection();

Below the "onCreate" method, write all the following methods.

//Manages the registration and unregistration of the sensor listener.
@Override
protected void onResume() {
    super.onResume();
    if (mSensorManager != null && mSensorListener != null) {
        Sensor accelerometer = mSensorManager.getDefaultSensor(Sensor.TYPE_ACCELEROMETER);
        if (accelerometer != null) {
            mSensorManager.registerListener(mSensorListener, accelerometer, SensorManager.SENSOR_DELAY_UI);
        }
    }
}

@Override
protected void onPause() {
    super.onPause();
    if (mSensorManager != null && mSensorListener != null) {
        mSensorManager.unregisterListener(mSensorListener);
    }
}

// Sets up the shake event listener.
private void initializeShakeDetection() {
    mSensorManager = (SensorManager) this.getSystemService(Context.SENSOR_SERVICE);
    mSensorListener = new ShakeBugShakeEventListener();
    mSensorListener.setOnShakeListener(this::captureScreenshot);
}

//Captures a screenshot of the Flutter view using PixelCopy.
private void captureScreenshot() {
    FrameLayout content = findViewById(android.R.id.content);
    FlutterView flutterView = (FlutterView) content.getChildAt(0);

    if (flutterView == null) {
        Log.e("ShakeBug", "FlutterView not found");
        return;
    }

    SurfaceView surfaceView = (SurfaceView) flutterView.getChildAt(0);
    surfaceView.post(() -> {
        Bitmap screenshot = Bitmap.createBitmap(surfaceView.getWidth(), surfaceView.getHeight(),
Bitmap.Config.ARGB_8888);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N) {
            PixelCopy.request(surfaceView, screenshot, result -> {
                if (result == PixelCopy.SUCCESS) {
                    ShakeBug.sharedInstance().flutterScreenshot(screenshot, this);
            } else {
                    Log.e("ShakeBug", "Screenshot failed");
            }
            }, new Handler());
        } else {
            Log.e("ShakeBug", "PixelCopy requires Android Nougat or higher.");
        }
    });
}

Want to know more

JavaScript SDK (NPM)

We no longer support the legacy JavaScript snippet. For modern web projects, use our official NPM package.

This package is suitable for React, Next.js, Express.js, and other JavaScript-based frameworks or applications.

Install with NPM

npm install @softnoesis/shakebug-js

Or, if you prefer Yarn:

yarn add @softnoesis/shakebug-js

Next steps

Use the app key from your Shakebug dashboard and follow our detailed web integration guide to complete setup in your project.

Want to know more? Open the full Web SDK guide

Google Chrome Extension

You can seamlessly integrate Shakebug into your web project using our Google Chrome Extension:

First, ensure that the URL of your website is added to your Shakebug account. Log in to your Shakebug account and navigate to the project page to add your website URL.

Next, install the Shakebug Chrome Extension from the Chrome Web Store.

After installation, click on the Shakebug Extension icon in your browser's toolbar. That new icon/tool will allow you to report bugs directly from your Chrome browser.