Flutter支持Repro所有功能的插件repro_flutter的使用

发布于 1周前 作者 bupafengyu 最后一次编辑是 5天前 来自 Flutter

Flutter支持Repro所有功能的插件repro_flutter的使用

概述

repro_flutter 是一个用于Flutter应用的插件,提供了Repro SDK的功能支持。Repro是一个用户行为分析平台,帮助开发者更好地理解用户在应用中的行为和体验。此插件支持Repro的所有功能,除了WebView事件跟踪。

如何添加repro_flutter插件到你的应用

1. 添加依赖

pubspec.yaml 文件中添加 repro_flutter 依赖并运行 flutter packages get

dependencies:
  flutter:
    sdk: flutter
  ...
  repro_flutter: ^3.13.0 # 添加这一行

2. 安装本地库(Android)

android/app/build.gradle 中添加依赖:

dependencies {
    implementation 'io.repro:repro-android-sdk:5.18.0' // 添加这一行
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

3. 安装本地库(iOS)

在项目的根目录下运行以下命令:

$ cd ios
$ pod install

4. 添加本地代码(Android)

创建一个新的 Application 类扩展自 io.flutter.app.FlutterApplication 并设置它到 AndroidManifest.xml

package your.package.name;

import io.flutter.app.FlutterApplication;
import io.repro.android.Repro;

public class MyApplication extends FlutterApplication {

    @Override
    public void onCreate() {
        super.onCreate();
        Repro.setup(this, "YOUR SDK TOKEN"); // 替换为你的SDK token
    }
}

AndroidManifest.xml 中设置:

      <application
-         android:name="io.flutter.app.FlutterApplication"
+         android:name="your.package.name.MyApplication"
          android:label="repro_integration_test"
          android:icon="@mipmap/ic_launcher">

5. 添加本地代码(iOS)

ios/Runner/AppDelegate.m 中调用 Repro#setup 方法:

- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [GeneratedPluginRegistrant registerWithRegistry:self];
  [Repro setup:@"YOUR SDK TOKEN"]; // 替换为你的SDK token
  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

启用推送通知

要启用推送通知,请按照以下步骤操作:

设置Android

  1. 添加Firebase Flutter插件:

    dependencies:
      firebase_core: ^1.14.1
      firebase_messaging: ^11.2.13
    
  2. main.dart 中初始化Firebase并监听Firebase令牌的变化:

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  FirebaseMessaging messaging = FirebaseMessaging.instance;
  messaging.onTokenRefresh.listen((token) async {
    await Repro.setPushRegistrationID(token);
  });
  runApp(MyApp());
}

设置iOS

请参考Repro文档进行APNs证书和FCM设置。

示例Demo

以下是示例应用的完整代码,展示了如何使用 repro_flutter 插件的基本功能:

import 'package:flutter/material.dart';
import 'package:repro_flutter/repro.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final userIdController = TextEditingController();

  String _userID = "";
  String _deviceID = "";
  String _logLevel = "Debug";

  @override
  void dispose() {
    userIdController.dispose();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();
    getUserID();
    getDeviceID();
  }

  Future<void> getUserID() async {
    String userID = await Repro.getUserID();
    if (!mounted) return;
    setState(() {
      _userID = userID;
    });
  }

  Future<void> getDeviceID() async {
    String deviceID = await Repro.getDeviceID();
    if (!mounted) return;
    setState(() {
      _deviceID = deviceID;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('ReproDev')),
        body: Center(
          child: ListView(padding: const EdgeInsets.all(8.0), children: <Widget>[
            Text('Device ID: $_deviceID'),
            Row(children: [
              const Text('log level'),
              SizedBox(width: 4),
              DropdownButton<String>(
                value: _logLevel,
                onChanged: (String? newValue) async {
                  switch (newValue) {
                    case 'Info':
                      await Repro.setLogLevel(LogLevel.info);
                      break;
                    case 'Warn':
                      await Repro.setLogLevel(LogLevel.warn);
                      break;
                    case 'Error':
                      await Repro.setLogLevel(LogLevel.error);
                      break;
                    default:
                      await Repro.setLogLevel(LogLevel.debug);
                      break;
                  }
                  setState(() {
                    _logLevel = newValue!;
                  });
                },
                items: <String>['Debug', 'Info', 'Warn', 'Error']
                    .map<DropdownMenuItem<String>>((String value) {
                  return DropdownMenuItem<String>(
                    value: value,
                    child: Text(value),
                  );
                }).toList(),
              ),
            ]),
            Row(children: [
              ElevatedButton(
                onPressed: () async {
                  await Repro.setUserID(userIdController.text);
                  getUserID();
                },
                child: const Text('Set User ID'),
              ),
              const SizedBox(width: 4),
              Flexible(
                child: TextField(
                  controller: userIdController,
                  decoration: InputDecoration(border: InputBorder.none, hintText: '$_userID'),
                ),
              ),
            ]),
            ElevatedButton(
              onPressed: () async {
                await Repro.setStringUserProfile("name", "Foo Bar");
                await Repro.setIntUserProfile("score", 1234);
                await Repro.setDoubleUserProfile("balance", 123.456);
                await Repro.setDateUserProfile("registration_date", DateTime.now());
                await Repro.setUserGender(UserGender.female);
                await Repro.setUserEmailAddress("foo@repro.io");
              },
              child: const Text('Set User Profiles'),
            ),
            ElevatedButton(
              onPressed: () async {
                await Repro.track("Track Events Button Pressed");
                await Repro.trackViewContent("example_item_id", {
                  "value": 123.456,
                  "currency": "dollar",
                  "content_name": "protein",
                  "content_category": "healthcare",
                  "extras": {"volumn": 1000}
                });
              },
              child: const Text('Track Events'),
            ),
            ElevatedButton(
              onPressed: () async {
                var newsFeeds = await Repro.getNewsFeeds(limit: 10, campaignType: NewsFeedCampaignType.PushNotification);
                for (var feed in newsFeeds) {
                  debugPrint('[NewsFeed]'
                      ' id: ${feed.id},'
                      ' campaignType: ${feed.campaignType},'
                      ' deviceID: ${feed.deviceID},'
                      ' title: ${feed.title},'
                      ' summary: ${feed.summary},'
                      ' body: ${feed.body},'
                      ' linkUrl: ${feed.linkUrl},'
                      ' linkUrlString: ${feed.linkUrlString},'
                      ' imageUrl: ${feed.imageUrl},'
                      ' imageUrlString: ${feed.imageUrlString},'
                      ' deliveredAt: ${feed.deliveredAt},'
                      ' read: ${feed.read},'
                      ' shown: ${feed.shown}');
                }
              },
              child: const Text('Get NewsFeeds'),
            ),
            ElevatedButton(
              onPressed: () async {
                var values = await Repro.remoteConfig.getAllValues();
                for (var key in values.keys) {
                  debugPrint('[RemoteConfig] $key: ${values[key]}');
                }
              },
              child: const Text('Get all RemoteConfig values'),
            ),
            Row(children: [
              ElevatedButton(
                onPressed: () async {
                  await Repro.optIn(true);
                },
                child: const Text('Opt-In'),
              ),
              const SizedBox(width: 4),
              ElevatedButton(
                onPressed: () async {
                  await Repro.optIn(false);
                },
                child: const Text('Opt-Out'),
              ),
            ]),
          ]),
        ),
      ),
    );
  }
}

以上示例展示了如何使用 repro_flutter 插件来获取设备ID、设置日志级别、设置用户ID、设置用户配置文件、跟踪事件、获取新闻推送以及获取远程配置值等功能。


更多关于Flutter支持Repro所有功能的插件repro_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter支持Repro所有功能的插件repro_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


由于repro_flutter这个插件的具体介绍为undefined,并且名称中的repro可能暗示着某种“重现”或“报告”的功能,我们可以基于Flutter插件开发的一般模式,推测其可能的功能和使用方法。以下是一个假设性的代码案例,展示如何在一个Flutter项目中集成并使用一个名为repro_flutter的插件(请注意,这只是一个示例,实际插件可能有所不同)。

1. 添加插件依赖

首先,在pubspec.yaml文件中添加repro_flutter插件的依赖(假设它已经在pub.dev上发布):

dependencies:
  flutter:
    sdk: flutter
  repro_flutter: ^x.y.z  # 替换为实际版本号

然后运行flutter pub get来安装插件。

2. 导入插件并使用其功能

假设repro_flutter插件提供了某种重现或报告UI元素的功能,我们可以这样使用它:

import 'package:flutter/material.dart';
import 'package:repro_flutter/repro_flutter.dart';  // 导入插件

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

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

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

class _MyHomePageState extends State<MyHomePage> {
  // 假设插件有一个ReportWidget用于显示报告或重现信息
  ReportWidget? _reportWidget;

  @override
  void initState() {
    super.initState();
    // 初始化插件并获取ReportWidget实例(假设这是插件的功能之一)
    _initializePlugin();
  }

  void _initializePlugin() async {
    // 假设插件有一个初始化方法,并返回一个ReportWidget实例
    final ReproFlutterPlugin plugin = ReproFlutterPlugin();
    _reportWidget = await plugin.initializeReportWidget();

    // 如果需要在UI中使用这个widget,可以使用setState来更新UI
    if (mounted) {
      setState(() {});
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Demo Home Page'),
      ),
      body: Center(
        child: _reportWidget ?? CircularProgressIndicator(),  // 在插件初始化完成前显示加载指示器
      ),
    );
  }
}

// 假设这是插件提供的ReportWidget类(实际插件可能不同)
class ReportWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text('Report Title', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
            SizedBox(height: 8),
            Text('This is a sample report content.'),
            // 可以添加更多报告内容,如按钮、图表等
          ],
        ),
      ),
    );
  }
}

// 假设这是插件提供的ReproFlutterPlugin类(实际插件可能不同)
class ReproFlutterPlugin {
  // 假设这是一个异步方法,用于初始化ReportWidget
  Future<ReportWidget> initializeReportWidget() async {
    // 这里可以是插件的初始化逻辑,比如从服务器获取数据等
    await Future.delayed(Duration(seconds: 2));  // 模拟异步操作
    return ReportWidget();
  }
}

注意事项

  1. 插件文档:实际使用时,请务必参考repro_flutter插件的官方文档,因为上述代码是基于假设的。
  2. 权限:如果插件需要访问设备资源(如相机、文件系统等),请确保在AndroidManifest.xmlInfo.plist中添加了相应的权限。
  3. 错误处理:在实际应用中,应添加适当的错误处理逻辑,以处理插件初始化失败或数据获取失败的情况。

由于repro_flutter插件的具体功能和用法未知,上述代码仅为示例,用于展示如何在Flutter项目中集成和使用一个假设的插件。

回到顶部