Apxor
IntegrationProduct Guides
  • Introduction to Apxor
  • Getting Started with Apxor
    • Adding a New App
    • Firebase Credentials (optional)
    • SDK
      • Android (x)
      • iOS SDK
      • iOS SDK (Swift UI)
      • iOS SDK (Manual)
      • Web npm based
        • Tracking Events and Pages for Web
      • Web URL based
        • Tracking Events and Pages for Web
      • React Native
      • Cordova
      • Flutter
      • Jetpack Compose
    • API Guides
      • iOS
      • Web
      • React Native
      • Cordova
      • Flutter
    • Release Notes
    • Performance
    • Troubleshooting
  • Product Guides
    • Integration Checklist
    • Create a Campaign
      • Mobile
        • Target
        • Trigger
        • Schedule and Limit
        • Review and Test
        • Set Priority and Publish
        • A/B Testing
        • Campaign Listings Page
        • Campaign Analytics
        • Campaign Designs
          • Tooltips
          • In-App Messages
          • Coachmarks
          • Badges
      • Web
        • Target
        • Trigger
        • Schedule and Limit
        • Review and Test
        • Set Priority and Publish
        • A/B Testing
        • Campaign Listings Page
        • Campaign Analytics
        • Web Templates
    • Create a Survey
      • Legacy
        • Target
        • Trigger
        • Schedule and Limit
        • Review and Test
        • Publish
        • Survey Listings Page
        • Survey Analytics
        • Survey Designs
          • Request for Survey
          • Single Response
          • Multi Response
          • Rating
          • Short Answer
          • Success Message
      • Latest
        • Survey Stop Conditions
        • Target
        • Trigger
        • Schedule and Limit
        • Review and Test
        • Publish
        • Survey Listings Page
    • Custom Reports
    • Analytics
      • Custom Dashboards
      • Uninstalls
      • Retention
      • Funnels
      • Paths
      • Event Analysis
    • BI Dashboard
      • Frequency
      • Aggregates
      • Trends
      • Pie Chart/Advanced Pie Chart
      • Table
    • Insights
      • Activation Analysis
      • Correlation Analysis
    • Adding a Test Device
    • Preview vs. Test vs. Publish
    • Dynamic Script
  • Partner Integrations
    • Mixpanel
    • MoEngage
    • Amplitude
    • CleverTap
  • Glossary of Terms
  • Video Gallery
  • Beta Features
    • Create Embedded Cards Campaign
    • Create Stories Campaign
Powered by GitBook
On this page
  • Identifying Users
  • Setting up campaign triggers, capturing data for targeting and goal tracking​
  • App Events​
  • User Attributes
  • Session Attributes
  • Client Events​
  • Track Screens
  • Tooltips in WebView
  • Log Events inside WebView
  • Yeah! You are ready to create your first Campaign or Survey
  1. Getting Started with Apxor
  2. API Guides

Flutter

PreviousCordovaNextRelease Notes

Last updated 1 year ago

Identifying Users

The Apxor SDK automatically captures device IDs and this is used to identify users uniquely by Apxor. Apart from this, you can log a custom user identifier that you use to uniquely identify users in your app.

This identifier would be very instrumental especially when exporting data of a certain campaign or survey to your analytics system to create a cohort and measure the results of the campaign.

Similarly, when you are importing data to Apxor from your system that your marketing/product / data science team has identified and wants to run campaigns specifically to them the custom user identifier will serve as the bridge to communicate between your systems and Apxor effectively.

Here is how you can set your user identifier for Apxor to recognize your users :

ApxorFlutter.setUserIdentifier("<SOME_USER_ID>");

Setting up campaign triggers, capturing data for targeting and goal tracking

The product/marketing or the growth team lists out the use cases with an idea of when to launch and to whom to launch. To do this we need to capture data in the form of events. Let us consider the following use case as an example :

In the above scenario, we want to trigger the campaign for users who have spent 'x' seconds and haven't tapped on a product. To understand that if the user has tapped the product we should log an event along with its attributes as follows to capture data:

Similarly if you want to send promotions to users who have viewed at least five products of the category shoes in the last three days or you want to measure how many people added an item to a cart from the campaign as a goal all this information is captured in the form of events.

These types of events are classified as app events - the data that is transferred to the servers at Apxor where you can segment users based on historic behaviour or measure your goals as specified above.

Here is how we track app events :

ApxorFlutter.logAppEvent("Login", attributes: {
  "type": "Google",
  "language": "valyrian",
});

User Attributes

We can personalize the messaging copy in the experiences we build for the user or target based on his persona using information that is centric to individual users. Let us consider the following example where we know the user is an English with Gold membership.

This information helps to tailor content in English to that specific user and gives us the flexibility to different messaging to different membership tiers. This is how the information captured here is used for segmenting.

Similarly capturing attributes like Name can help to personalize your message copy where it reads Hi {username} can't find your product? where the username is replaced by the attribute value of the property from the nudges dashboard along with providing meaningful defaults in their absence.

This is how you log user information to Apxor :

ApxorFlutter.setUserAttributes({
  'age': 27,
  'gender': "male",
});

Session Attributes

A Session can be simply defined as user journey as he opens the app, until he closes the app. There can be various pieces of information that be very impactful when accumulated in a session. For example, location in a session can be useful to know exactly where, the user is utilizing the app most.

To add session attributes that are specific to a session,

ApxorFlutter.setSessionAttributes({
  "network": "4G",
  "location": "Hyderabad",
});

In the below scenario, let's assume you want to launch a survey when the soft back button is pressed asking the user for product feedback. In this, we don't need to capture the data of how many people pressed the back button which is useless and it bloats your event storage as it is a high-frequency event which increases your cost unnecessarily. This data point doesn't potentially answer any of your product questions and hence there is no ROI in storing data from this event.

So for such scenarios where we need the behavioral data to launch a campaign or to collect feedback, which doesn't provide ROI on storing for measuring goals, answering your product questions or segmenting your target audience, we log these events as Client Events which involves zero transfer of data and is used only to set up your triggers on behavioral information from the user.

Example:

Soft back button, user reaching end of page, etc.

ApxorFlutter.logClientEvent("SoftBackPressed", attributes: {
  "screenName": "Payment",
});

Track Screens

In the scenario discussed in this guide, how will we know if the user has spent thirty seconds on the home screen and did not click on the product? For this reason, it is important to use track the screens to set them up as triggers and also to capture the time spent on the screens.

Note

Use the following APIs only if you have not defined routes in navigator or application. If you already have defined the routes, the same route names will be used to setup campaigns on inactivity or time spent on those screens.

By using the following API to track the screens in the app you can setup campaigns on inactivity or time spent on those screens:

ApxorFlutter.trackScreen("LoginScreen", context); // Pass build context

ApxorFlutter.trackScreen("AddToCartScreen", context); // Pass build context

ApxorFlutter.trackScreen("PaymentScreen", context); // Pass build context

Tooltips in WebView

Note

Please check the updated versions for Android

apxor-android-sdk-core >= 2.9.4

apxor-android-sdk-rtm plugin version >= 2.2.0

wysiwyg >= 1.4.1

Many native applications feature WebViews to display descriptive content and much more. Apxor Flutter SDK provides a way to show tooltips inside that WebView to make the most of it.

Following are the steps in order to show tooltips in your WebView.

Support for webview_flutter
  • Create webview controller if you don't have one and Add a tag to the WebView and set the controller with the same tag

_controller = new WebViewController();
_controller.setJavaScriptMode(JavaScriptMode.unrestricted);
_controller.addJavaScriptChannel("ApxorFlutter",
      onMessageReceived: (message) {
            ApxorFlutter.apxorJsMessageHandler(message.message);
   });
_controller.setNavigationDelegate(NavigationDelegate(
      onPageStarted: (url) async =>
      await ApxorFlutter.setWebViewController("MyWebView",_controller)));
  • Add a tag to the WebView and set the controller as shown.

WebViewWidget(
    key: const ValueKey("MyWebView"),
    controller: _controller,
    ),
Support for flutter_inappwebview
  • Add a tag to the WebView and set the controller with the same tag

InAppWebView(
  //...
  key: const ValueKey("MyWebView"),
  onWebViewCreated: (controller) {
    //...
    ApxorFlutter.setInAppWebViewController("MyWebView",controller);
    controller.addJavaScriptHandler(
      handlerName: "ApxorFlutter",
      callback: (args) {
        ApxorFlutter.apxorJsMessageHandler(args[0]);
      });
    //...
  },
  /...
),

Log Events inside WebView

It is suggested that you log events inside your WebView once the page is completely rendered using Apxor Javascript Interface methods. Based on these events, you can configure Tooltips.

  • Methods exposed from Apxor Javascript Interface

    window.Apxor.logAppEvent(event_name[, event_props]);
    window.Apxor.logClientEvent(event_name[, event_props]);
  • Examples for logging App Event

    Example:

    Log an event on page load event.

    ...
    <head>
      ...
      <script>
        function logApxorEvent(eventName, attributes) {
          if (window.Apxor && window.Apxor.logAppEvent) {
            window.Apxor.logAppEvent(eventName, attributes);
          }
        }
      </script>
    </head>
    <body onload="logApxorEvent('PageLoaded')">
      ...
    </body>

    Example (React based web pages):

    Log an event on componentDidMount.

    componentDidMount() {
        if (window.Apxor && window.Apxor.logAppEvent) {
            window.Apxor.logAppEvent('LoginPageLoaded', null);
        }
    }

App Events

Personalizing and targetting by user persona

Client Events

Yeah! You are ready to create your first or

​
​
​
Campaign
Survey
​