Flutter用户体验监控插件flutter_uxcam的使用

flutter_uxcam

UXCam插件用于Flutter应用，可以方便地进行用户行为追踪、屏幕录制等功能，以帮助开发者优化用户体验。

Installation 安装

要在您的项目中使用flutter_uxcam，首先需要在项目的pubspec.yaml文件中的dependencies下添加如下内容：

dependencies:
  flutter_uxcam: ^latest_version # 请根据Pub上的最新版本号替换latest_version

然后执行flutter pub get命令来安装依赖。

Usage 使用方法

接下来，在您的Dart文件中导入flutter_uxcam包，并在应用程序启动时初始化它。通常是在lib/main.dart文件中void main() => runApp(MyApp());所在的类里添加以下代码：

import 'package:flutter_uxcam/flutter_uxcam.dart';

// 确保获得用户同意后调用此方法
FlutterUxcam.optIntoSchematicRecordings();

FlutterUxConfig config = FlutterUxConfig(
  userAppKey: "UXCAM_APP_KEY", // 替换为您的UXCam App Key
);
FlutterUxcam.startWithConfiguration(config);

注意：UXCAM_APP_KEY可以在UXCam官网获取。

Example 示例代码

下面是一个完整的示例，展示了如何集成并使用flutter_uxcam的各种功能，如手动标记屏幕、设置用户身份等。

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

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 确认已经获得了用户的屏幕录制权限
    FlutterUxcam.optIntoSchematicRecordings();

    // 配置
    FlutterUxConfig config = FlutterUxConfig(
      userAppKey: 'UXCAM_API_KEY', // 替换成您自己的API密钥
      enableAutomaticScreenNameTagging: false, // 控制是否自动给屏幕打标签
    );

    FlutterUxcam.startWithConfiguration(config);

    return const MaterialApp(home: UXCamPage());
  }
}

class UXCamPage extends StatelessWidget {
  const UXCamPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('UXCam Features')),
      body: ListView(
        padding: const EdgeInsets.all(8.0),
        children: [
          FeatureSection(
            title: 'Screen Tagging',
            onPressed: () => FlutterUxcam.tagScreenName('Example Screen'),
            buttonTitle: 'Tag Screen',
          ),
          FeatureSection(
            title: 'Setting User Identity',
            onPressed: () => FlutterUxcam.setUserIdentity('Guest User'),
            buttonTitle: 'Set User Identity',
          ),
          FeatureSection(
            title: 'Setting User Property',
            onPressed: () =>
                FlutterUxcam.setUserProperty('userPropKeyString', 'valueString'),
            buttonTitle: 'Set User Property',
          ),
          FeatureSection(
            title: 'Custom Event',
            onPressed: () => FlutterUxcam.logEvent('Custom Event'),
            buttonTitle: 'Log Custom Event',
          ),
          FeatureSection(
            title: 'Custom Event With Properties',
            onPressed: () => FlutterUxcam.logEventWithProperties('Custom Event', {
              'Property 1': 12345,
            }),
            buttonTitle: 'Log Custom Event with Properties',
          ),
        ],
      ),
    );
  }
}

typedef OnFeatureButtonPressed = Function();

class FeatureSection extends StatelessWidget {
  final String title;
  final OnFeatureButtonPressed onPressed;
  final String buttonTitle;

  const FeatureSection({
    Key? key,
    required this.title,
    required this.onPressed,
    required this.buttonTitle,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: Theme.of(context).textTheme.headlineSmall,
        ),
        ElevatedButton(
          onPressed: onPressed,
          child: Text(buttonTitle),
        ),
        const Divider(),
      ],
    );
  }
}

iOS平台注意事项

如果您在iOS平台上遇到类似“Automatically assigning platform ios with version 8.0 on target Runner”的错误信息，建议您打开ios/Podfile文件，并取消注释# platform :ios, '10.0'这一行（去掉前面的#），这将指定iOS平台的最低版本要求为10.0。

通过以上步骤，您应该能够在Flutter项目中成功集成并使用flutter_uxcam插件来进行用户体验监控了。希望这些信息对您有所帮助！