Flutter

Latest Version: 1.2.5

GitHub Example App: View Example

Below are the various processes involved in setting up Spotcheck in Flutter

Installation

To install the SurveySparrowSdk, make sure you are in the root folder of your Flutter project in the terminal and run the following command.

flutter pub add surveysparrow_flutter_sdk

Permissions

Android — android/app/src/main/AndroidManifest.xml

Required

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Optional — camera

<uses-permission android:name="android.permission.CAMERA" />
<queries>
    <intent>
        <action android:name="android.media.action.IMAGE_CAPTURE" />
    </intent>
</queries>

Optional — voice

<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />

iOS — ios/Runner/Info.plist

Optional — camera

<key>NSCameraUsageDescription</key>
<string>Your usage description</string>

Optional — voice

<key>NSMicrophoneUsageDescription</key>
<string>Your usage description</string>
<key>NSSpeechRecognitionUsageDescription</key>
<string>Your usage description</string>

Optional — photo library

<key>NSPhotoLibraryUsageDescription</key>
<string>Your usage description</string>

Initialization

Declare and initialize the spotcheck variable using the Spotcheck().

Anonymous users

If you wish not to keep track of users' data, you can follow the below syntax for initialization.

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

final SpotCheck spotCheck = SpotCheck(
  domainName: "<your_domain>",
  targetToken: "<target_token>",
  // Should Not Pass userDetails as const
  userDetails: {},
  variables: {
    sparrowLang: "ta" // Eg: ta, en
  },
  customProperties: {}
);

Known Users

If you wish to keep track of users' data and perform conditional Survey triggers, you can follow the below syntax for initialization.

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

final SpotCheck spotCheck = SpotCheck(
  domainName: "<your_domain>",
  targetToken: "<target_token>",
  // Should Not Pass userDetails as const
  userDetails: {
       email:"<user_email>",
       mobile:"<user_mobile>",
       uuid: '<uuid_value>' // Optional
  },
  variables: {
        sparrowLang: "ta" // Eg: ta, en, 
       <api_identifier_of_variable>:"<variable_value>",
  },
  customProperties: {
       <custom_property_name>: "<custom_property_value>"
  }
);

Then, add the SpotCheck initialized variable in the MaterialApp builder and add the navigation observer.

import 'package:flutter/material.dart';
import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

class <your-app-class> extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: <your-home-screen>,
      builder: (context, child) {
        return Scaffold(
          body: Stack(
            children: [
              child ?? const SizedBox(),
              spotCheck,
            ],
          ),
        );
      },
      navigatorObservers: [
        SsNavigationListener(spotCheck.spotCheckState) // to support spotCheck buttons
      ],
    );
  }
}

Screen Track

It provides the ability to keep track of screens the users are visiting and to enable the survey trigger on that screen.

Syntax:

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

spotCheck.trackScreen("ScreenName");

Example:

If a survey needs to be triggered on the payment page, the name of the ScreenName should be specified in the TrackScreen function.

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

spotCheck.trackScreen("paymentScreen");

Event Track

It provides the ability to keep track of events which when triggered, will enable the survey to be popped.

Syntax:

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

spotCheck.trackEvent("ScreenName", {"EventName": {}});

Example:

If a survey needs to be triggered when the user completes a payment, then the TrackEvent function should be called with the respective ScreenName and optional custom properties.

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

spotCheck.trackEvent("paymentScreen", {"paymentComplete": {
    "email":"[email protected]",
    "paymentStatus":true
}});

Make sure to have the eventName configured in the Checks section of the configure panel

Callbacks (Optional)

Callbacks are used to listen to events that are part of the SpotChecks. All callback functions are optional — you can implement only the ones you need. The available callbacks include:

• Survey Response - triggers when the user submits a response.

• Survey Loaded - triggers when the SpotChecks is loaded on the user's page.

• Survey Close - triggers when the SpotChecks is closed by the user.

• Partial Submission - triggers when the PartialSubmission is enabled and received.

Syntax:

import 'package:surveysparrow_flutter_sdk/surveysparrow_flutter_sdk.dart';

// Step 1: Add callbacks to the SpotChecks Initialization

final SpotCheck spotCheck = SpotCheck(
  //...
  spotCheckListener: mySpotcheckListener
);

// Step 2: Listen to the SpotChecks events
class MySpotcheckListener extends SsSpotcheckListener {
  @override
  Future<void> onSurveyLoaded(Map<String, dynamic> response) async {}

  @override
  Future<void> onSurveyResponse(Map<String, dynamic> response) async {}

  @override
  Future<void> onCloseButtonTap() async {}

  @override
  Future<void> onPartialSubmission(Map<String, dynamic> response) async {}
}