Flutter用户权限管理插件 user_profile_gatekeeper 的使用

简介

user_profile_gatekeeper 是一个用于确保用户在访问应用之前提供了必要个人信息的Flutter插件。它可以帮助开发者验证用户的输入，并在用户导航前确保所有必要的数据都已提供。

• Live Demo: https://jake-mok-nelson.github.io/user_profile_gatekeeper/

使用场景

适用场景

• 确保用户已完成所有必需的信息填写，以便应用正常运行。
• 在允许用户导航前验证用户输入，确保所有必需的数据都已存在。
• 确保现有必需的用户属性不被移除或更改成不符合要求的内容。

不适用场景

• 如果你没有额外的必填用户属性（如ID、邮箱、密码等）。
• 如果你不需要在允许用户导航前验证用户输入。
• 如果你不关心现有必需的用户属性是否被移除或更改。
• 作为完整的用户配置系统（如用户设置、用户资料等）的替代品。
• 存储敏感信息（如SSN、信用卡信息、密码等）。

安装

在你的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  user_profile_gatekeeper: ^1.0.0

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

使用方法

配置用户属性

首先，你需要定义所需的用户属性。下面是一个示例，展示了如何配置 UserProperty 类：

UserProperty(
  label: 'displayName',
  get: () async {
    // 调用API获取属性值并检查是否已设置
    return Future.value('John');
  },
  validate: (String value) => switch (value) {
    String s when s.isEmpty => false,
    String s when s.length < 2 || s.length > 50 => false,
    String s when !RegExp(r'^[a-zA-Z0-9 ]+$').hasMatch(s) => false,
    _ => true,
  },
  save: (String value) async {
    // 将新值存储到持久化位置以继续导航
    debugPrint('Name saved: $value');
  },
),

包裹应用

使用 UserProfileGatekeeper 组件包裹你的应用，以确保收集必要的用户资料：

UserProfileGatekeeper(
  requiredUserProperties: [...],
  child: HomeScreen(),
)

示例代码

以下是一个完整的示例，展示了如何在实际项目中使用 user_profile_gatekeeper 插件：

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

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    final List<UserProperty> userProperties = [
      UserProperty(
        label: 'Name',
        get: () async => '', // 替换为实际获取逻辑
        validate: (value) => value.length >= 2,
        save: (value) async {
          debugPrint('Name saved: $value');
        },
      ),
      UserProperty(
        label: 'Email',
        get: () async => '', // 替换为实际获取逻辑
        validate: (value) => RegExp(r'^[^@]+@[^@]+\.[^@]+').hasMatch(value),
        save: (value) async {
          debugPrint('Email saved: $value');
        },
        inputType: TextInputType.emailAddress,
      ),
      UserProperty(
        label: 'Phone Number',
        get: () async => '', // 替换为实际获取逻辑
        validate: (value) =>
            value.length > 7 &&
            value.length < 25 &&
            value.contains(RegExp(r'^[0-9]*$')),
        save: (value) async {
          debugPrint('Phone Number saved: $value');
        },
        inputType: TextInputType.phone,
      ),
      UserProperty(
        label: 'Date of Birth (YYYY-MM-DD)',
        get: () async => '', // 替换为实际获取逻辑
        validate: (value) {
          final datePattern = RegExp(r'^\d{4}-\d{2}-\d{2}$');
          if (!datePattern.hasMatch(value)) {
            return false;
          }
          final parts = value.split('-');
          final year = int.parse(parts[0]);
          final month = int.parse(parts[1]);
          final day = int.parse(parts[2]);
          if (year < 1900 || year > 2022) {
            return false;
          }
          if (month < 1 || month > 12) {
            return false;
          }
          if (day < 1 || day > 31) {
            return false;
          }
          return true;
        },
        save: (value) async {
          debugPrint('Date of Birth saved: $value');
        },
        inputType: TextInputType.datetime,
      ),
    ];

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: UserProfileGatekeeper(
        requiredUserProperties: userProperties,
        child: const MyHomePage(title: 'Flutter Demo Home Page'),
      ),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}