Flutter功能扩展插件refiner_flutter的使用

Flutter功能扩展插件refiner_flutter的使用

1) 安装

要使用此插件，在你的pubspec.yaml文件中添加refiner_flutter作为依赖项。

dependencies:
  refiner_flutter: ^[version]

iOS

在你的iOS目录中运行命令：

pod install

2) 使用

访问我们的文档以获取更多关于如何使用SDK方法的信息。

初始化与配置

在应用中初始化SDK，并传递所需的配置参数。

第二个参数用于激活调试模式。如果激活，SDK将记录所有与Refiner后端服务器的交互。

import 'package:refiner_flutter/refiner_flutter.dart';

await Refiner.initialize(projectId: 'PROJECT_ID', debugMode: false);

标识用户

调用Identify User来创建或更新用户特征。

第一个参数是已登录用户的userId，这是唯一必须的参数。

第二个参数是一个包含用户特征的对象。如果你不想发送任何用户特征到你的Refiner账户，可以提供一个空对象。

var userTraits = {
  'email': 'hello@hello.com',
  'a_number': 123,
  'a_date': '2022-16-04 12:00:00'
};

await Refiner.identifyUser(userId: 'my-user-id', userTraits: userTraits);

第三个参数是设置用户的locale（可选）。格式应为两个字母的ISO 639-1语言代码。提供时，locale代码将用于启动特定语言的调查。如果没有使用任何语言特定的功能，你可以将其设置为null。

第四个参数是可选的Identity Verification签名。我们建议在生产环境中使用身份验证签名以提高安全性。开发用途下，你可以将其设置为null。

var userTraits = {
  'email': 'hello@hello.com',
  'a_number': 123,
  'a_date': '2022-16-04 12:00:00'
};

await Refiner.identifyUser(userId: 'my-user-id', userTraits: userTraits, locale: 'LOCALE', signature: 'SIGNATURE');

设置用户

Set User方法作为Identify User方法的替代方案。

与Identify User不同，Set User方法不会立即在你的Refiner账户中创建用户对象。提供的用户ID和特征将本地保存在你的应用中，不会立即与服务器通信。只有当用户执行有意义的操作（例如执行Track Event或Track Screen）时，才会在Refiner中创建用户对象。提供的用户特征将在显示调查时附加到用户对象上。

var userTraits = {
  'email': 'hello@hello.com',
  'a_number': 123,
  'a_date': '2022-16-04 12:00:00'
};

await Refiner.setUser(userId: 'my-user-id', userTraits: userTraits, locale: 'LOCALE', signature: 'SIGNATURE');

跟踪事件

Track Event允许你跟踪用户事件。跟踪的事件可用于在Refiner中创建用户段和目标受众。

await Refiner.trackEvent('EVENT_NAME');

跟踪屏幕

Track Screen允许你跟踪用户当前所在的屏幕。屏幕信息可用于在应用的特定区域启动调查。

我们建议仅在你将来可能想在该屏幕上展示调查时才跟踪屏幕。没有必要系统地跟踪应用中的所有屏幕。

await Refiner.trackScreen('SCREEN_NAME');

Ping

根据你的设置，你可能希望定期检查为当前用户安排的调查。例如，当你使用基于时间的触发事件或目标受众基于从我们的后端API接收到的用户数据时。

Ping方法提供了进行此类检查的简便方式。你可以在用户旅程的关键时刻调用Ping方法，例如当应用重新打开或用户执行特定操作时。

await Refiner.ping();

显示表单

如果你使用手动触发事件来启动调查，你需要在想要启动调查时调用Show Form。

第二个参数是一个布尔值，用于强制显示调查并绕过在Refiner仪表板中设置的所有目标规则。设置该参数为true对于测试SDK很有帮助。在生产中，该参数应设置为false。

await Refiner.showForm('FORM_UUID');

await Refiner.showForm('FORM_UUID', force: true);

附加上下文数据

使用addToResponse将上下文数据附加到调查提交。设置null以移除上下文数据。

var contextualData = { 'some_data': 'hello', 'some_more_data': 'hello again'};
await Refiner.addToResponse(contextualData);

开始用户会话

当用户在至少一小时无活动后返回你的应用时，会自动检测到一个新的用户会话。你也可以选择手动开始新的用户会话。例如，你可以在用户打开应用时调用此方法。

await Refiner.startSession();

重置用户

调用Reset User以重置通过Identify User设置的用户标识。我们建议在用户从你的应用中登出时调用此方法。

await Refiner.resetUser();

设置项目

在SDK初始化后，可以在运行时更改环境UUID。

await Refiner.setProject('PROJECT_ID');

关闭调查

使用closeForm方法可以编程方式关闭调查而不向后端API发送任何信息。

await Refiner.closeForm('FORM_UUID');

使用dismissForm方法可以编程方式关闭调查并向后端服务器发送“dismissed at”时间戳。

await Refiner.dismissForm('FORM_UUID');

注册回调函数

注册回调函数允许你在调查生命周期的特定时刻执行任何代码。一个流行的用例是当用户完成调查后将其重定向到新屏幕。

onBeforeShow会在调查即将显示之前被调用。

Refiner.addListener("onBeforeShow", (value) {
    print("***onBeforeShow***");
    print(value);
});

onNavigation会在用户浏览调查时被调用。

Refiner.addListener("onNavigation", (value) {
    print("***onNavigation***");
    print(value);
});

onShow会在调查小部件对用户可见时被调用。

Refiner.addListener("onShow", (value) {
    print("***onShow***");
    print(value);
});

onClose会在调查小部件从屏幕上消失时被调用。

Refiner.addListener("onClose", (value) {
    print("***onClose***");
    print(value);
});

onDismiss会在用户点击右上角的“x”按钮关闭调查时被调用。

Refiner.addListener("onDismiss", (value) {
    print("***onDismiss***");
    print(value);
});

onComplete会在用户完成（提交）调查时被调用。

Refiner.addListener('onComplete', (args) {
    print('onComplete');
    print(value);
});

示例代码

以下是从GitHub仓库中获取的示例代码：

import 'dart:math';

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:refiner_flutter/refiner_flutter.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  [@override](/user/override)
  void initState() {
    super.initState();
    initRefiner();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Refiner Flutter Example'),
        ),
        body: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () async {
                var userTraits = {
                  'email': 'hello@hello.com',
                  'a_number': 123,
                  'a_date': '2022-16-04 12:00:00',
                };
                await Refiner.identifyUser(
                    userId: '111',
                    userTraits: userTraits,
                    locale: 'de');
              },
              child: const Text("Identify User"),
            ),
            ElevatedButton(
              onPressed: () async {
                await Refiner.resetUser();
              },
              child: const Text("Reset User"),
            ),
            ElevatedButton(
              onPressed: () async {
                await Refiner.showForm("e67598a0-cc8d-11ed-a913-47c5ab4910b7",
                    force: true);
              },
              child: const Text("Show Form"),
            ),
          ],
        ),
      ),
    );
  }

  Future<void> initRefiner() async {
    //enableDebugMode : true for testing
    await Refiner.initialize(
        projectId: "a95a2e00-afb7-11ea-92d4-fd03275706ee",
        debugMode: true);

    await Refiner.setProject(
        projectId: "a95a2e00-afb7-11ea-92d4-fd03275706ee");

    await Refiner.ping();

    await Refiner.trackEvent("eventName");
    await Refiner.trackScreen("screenName");

    await Refiner.addToResponse({"testKey": "testValue"});

    Refiner.addListener("onBeforeShow", (value) {
      print("***onBeforeShow***");
      print(value);
    });
    Refiner.addListener("onNavigation", (value) {
      print("***onNavigation***");
      print(value);
    });
    Refiner.addListener("onShow", (value) {
      print("***onShow***");
      print(value);
    });
    Refiner.addListener("onClose", (value) {
      print("***onClose***");
      print(value);
    });
    Refiner.addListener("onDismiss", (value) {
      print("***onDismiss***");
      print(value);
    });
    Refiner.addListener("onComplete", (value) {
      print("***onComplete***");
      print(value);
    });
  }
}

更多关于Flutter功能扩展插件refiner_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter功能扩展插件refiner_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，下面是一个关于如何在Flutter项目中使用refiner_flutter插件的示例代码。这个插件假设它提供了一些功能扩展，但具体的API和功能需要根据实际的插件文档进行调整。以下是一个基本的集成和使用示例：

1. 添加依赖

首先，你需要在pubspec.yaml文件中添加refiner_flutter插件的依赖。

dependencies:
  flutter:
    sdk: flutter
  refiner_flutter: ^最新版本号  # 请替换为实际的最新版本号

2. 导入插件

在你的Dart文件中导入插件。

import 'package:refiner_flutter/refiner_flutter.dart';

3. 初始化插件

在应用的入口文件（通常是main.dart）中初始化插件。

void main() {
  runApp(MyApp());

  // 假设插件需要初始化，可以在这里进行（根据插件文档）
  // RefinerFlutter.initialize();
}

4. 使用插件功能

假设refiner_flutter插件提供了一些UI组件和功能扩展，比如一个自定义的按钮和一些实用函数。以下是如何使用这些功能的示例。

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Refiner Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  // 假设插件有一个自定义按钮
  void handleCustomButtonClick() {
    // 执行按钮点击后的逻辑
    print("Custom button clicked!");
  }

  // 假设插件提供了一个实用函数来获取设备信息
  void printDeviceInfo() async {
    try {
      var deviceInfo = await RefinerFlutter.getDeviceInfo();
      print("Device Info: ${deviceInfo.toMap()}");
    } catch (e) {
      print("Error getting device info: $e");
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Refiner Flutter Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 使用插件提供的自定义按钮
            RefinerButton(
              onPressed: handleCustomButtonClick,
              child: Text('Custom Button'),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: printDeviceInfo,
              child: Text('Get Device Info'),
            ),
          ],
        ),
      ),
    );
  }
}

// 假设RefinerButton是插件提供的一个自定义按钮组件
// class RefinerButton extends StatelessWidget {
//   final VoidCallback onPressed;
//   final Widget child;
//
//   RefinerButton({required this.onPressed, required this.child});
//
//   @override
//   Widget build(BuildContext context) {
//     return ElevatedButton(
//       onPressed: onPressed,
//       child: child,
//       style: ButtonStyle(
//         backgroundColor: MaterialStateProperty.all(Colors.green),
//       ),
//     );
//   }
// }

// 注意：上面的RefinerButton是一个假设的实现，实际使用时请参考插件的文档。

注意事项

  1. 插件版本：确保你使用的是最新版本的refiner_flutter插件。
  2. API文档：根据插件的官方API文档来调整代码，因为实际的API和功能可能与示例有所不同。
  3. 权限：如果插件需要访问设备的某些功能（如相机、存储等），请确保在AndroidManifest.xml和Info.plist中添加了相应的权限。

希望这个示例能帮助你开始在Flutter项目中使用refiner_flutter插件。如果有更多具体的问题或需要更详细的示例，请参考插件的官方文档或联系插件的开发者。

回到顶部