开源鸿蒙跨平台Flutter开发:密码生成器应用

欢迎加入开源鸿蒙跨平台社区:
https://openharmonycrossplatform.csdn.net

一、项目概述

运行效果图

1.1 应用简介

密码生成器是一款实用工具类应用,专门用于生成强密码,支持不同网站的密码需求,还能保存密码提示,安全又方便。应用以科技感的紫色为主色调,象征安全与创新。涵盖密码生成、密码管理、设置三大模块,帮助用户轻松管理各类账号密码,提升网络安全。

1.2 核心功能

功能模块 功能描述 实现方式
密码生成 生成强密码 随机算法
密码强度检测 评估密码强度 强度分析
密码管理 保存密码提示 本地存储
网站分类 按网站类型分类 分类管理
复制功能 一键复制密码 剪贴板操作
导出功能 导出密码列表 文件导出

1.3 密码类型定义

序号 类型名称 Emoji 描述
1 通用密码 🔐 适用于一般网站
2 金融密码 💰 适用于银行、支付网站
3 社交密码 📱 适用于社交媒体
4 邮箱密码 📧 适用于邮箱账号
5 工作密码 💼 适用于工作相关账号
6 自定义 ⚙️ 自定义密码规则

1.4 密码强度定义

序号 强度等级 Emoji 描述
1 🟥 容易被破解
2 🟨 有一定安全性
3 🟩 安全性较高
4 非常强 🟪 安全性极高

1.5 密码规则定义

序号 规则名称 Emoji 描述
1 包含大写字母 🔠 包含A-Z
2 包含小写字母 🔡 包含a-z
3 包含数字 🔢 包含0-9
4 包含特殊字符 🎭 包含!@#$%^&*
5 避免相似字符 🚫 避免1,l,I,0,O等
6 避免连续字符 🔄 避免123,abc等

1.6 技术栈

技术领域 技术选型 版本要求
开发框架 Flutter >= 3.0.0
编程语言 Dart >= 2.17.0
设计规范 Material Design 3 -
本地存储 SharedPreferences -
剪贴板 clipboard -
加密 crypto -
目标平台 鸿蒙OS / Web API 21+

1.7 项目结构

复制代码
lib/
└── main_password_generator.dart
    ├── PasswordGeneratorApp         # 应用入口
    ├── PasswordType                  # 密码类型枚举
    ├── PasswordStrength              # 密码强度枚举
    ├── PasswordRule                  # 密码规则枚举
    ├── Password                     # 密码模型
    ├── WebsiteCategory               # 网站分类枚举
    ├── PasswordGeneratorHomePage     # 主页面(底部导航)
    ├── _buildGeneratePage            # 生成密码页面
    ├── _buildManagePage              # 密码管理页面
    ├── _buildSettingsPage            # 设置页面
    ├── _buildAboutPage               # 关于页面
    ├── PasswordCard                  # 密码卡片组件
    ├── StrengthIndicator            # 强度指示器组件
    └── RuleSelector                 # 规则选择器组件

二、系统架构

2.1 整体架构图

Data Layer
Business Layer
Presentation Layer
主页面

PasswordGeneratorHomePage
生成密码页
密码管理页
设置页
关于页
密码设置
规则选择
强度检测
生成密码
复制密码
密码列表
密码详情
添加密码
编辑密码
安全设置
导出设置
界面设置
密码生成器

PasswordGenerator
密码管理器

PasswordManager
强度检测器

StrengthDetector
Password

密码
WebsiteCategory

网站分类
PasswordRule

密码规则

2.2 类图设计

has
has
has
PasswordGeneratorApp
+Widget build()
<<enumeration>>
PasswordType
+String label
+String emoji
+String description
+general()
+financial()
+social()
+email()
+work()
+custom()
<<enumeration>>
PasswordStrength
+String label
+String emoji
+String color
+weak()
+medium()
+strong()
+veryStrong()
<<enumeration>>
PasswordRule
+String label
+String emoji
+String regex
+uppercase()
+lowercase()
+numbers()
+special()
+avoidSimilar()
+avoidConsecutive()
<<enumeration>>
WebsiteCategory
+String label
+String emoji
+String color
+socialMedia()
+financial()
+email()
+work()
+shopping()
+entertainment()
Password
+String id
+String website
+String username
+String password
+String hint
+PasswordType type
+WebsiteCategory category
+PasswordStrength strength
+DateTime createdAt
+DateTime updatedAt
PasswordGeneratorHomePage
+Widget build()

2.3 页面导航流程

生成密码
密码管理
设置
应用启动
生成密码页
底部导航
密码设置
密码列表
安全设置
选择密码类型
设置密码长度
选择密码规则
生成密码
复制密码
查看密码
编辑密码
保存密码
添加密码
填写密码信息

2.4 密码生成流程

强度检测器 密码生成器 生成密码页 用户 强度检测器 密码生成器 生成密码页 用户 设置密码长度 选择密码规则 选择规则 点击生成 生成密码 返回密码 检测强度 返回强度 显示密码和强度 点击复制 复制到剪贴板


三、核心模块设计

3.1 数据模型设计

3.1.1 密码类型枚举 (PasswordType)
dart 复制代码
enum PasswordType {
  general(label: '通用密码', emoji: '🔐', description: '适用于一般网站'),
  financial(label: '金融密码', emoji: '💰', description: '适用于银行、支付网站'),
  social(label: '社交密码', emoji: '📱', description: '适用于社交媒体'),
  email(label: '邮箱密码', emoji: '📧', description: '适用于邮箱账号'),
  work(label: '工作密码', emoji: '💼', description: '适用于工作相关账号'),
  custom(label: '自定义', emoji: '⚙️', description: '自定义密码规则');

  final String label;
  final String emoji;
  final String description;
}
3.1.2 密码强度枚举 (PasswordStrength)
dart 复制代码
enum PasswordStrength {
  weak(label: '弱', emoji: '🟥', color: '#F44336'),
  medium(label: '中', emoji: '🟨', color: '#FF9800'),
  strong(label: '强', emoji: '🟩', color: '#4CAF50'),
  veryStrong(label: '非常强', emoji: '🟪', color: '#9C27B0');

  final String label;
  final String emoji;
  final String color;
}
3.1.3 密码模型 (Password)
dart 复制代码
class Password {
  final String id;              // 密码ID
  final String website;         // 网站名称
  final String username;        // 用户名
  final String password;        // 密码
  final String hint;            // 密码提示
  final PasswordType type;      // 密码类型
  final WebsiteCategory category; // 网站分类
  final PasswordStrength strength; // 密码强度
  final DateTime createdAt;     // 创建时间
  final DateTime updatedAt;     // 更新时间
}
3.1.4 网站分类枚举 (WebsiteCategory)
dart 复制代码
enum WebsiteCategory {
  socialMedia(label: '社交媒体', emoji: '📱', color: '#2196F3'),
  financial(label: '金融服务', emoji: '💰', color: '#4CAF50'),
  email(label: '电子邮箱', emoji: '📧', color: '#FF9800'),
  work(label: '工作相关', emoji: '💼', color: '#9C27B0'),
  shopping(label: '购物网站', emoji: '🛒', color: '#F44336'),
  entertainment(label: '娱乐休闲', emoji: '🎮', color: '#673AB7');

  final String label;
  final String emoji;
  final String color;
}
3.1.5 密码强度分布

40% 25% 25% 10% 密码强度分布示例 弱 中 强 非常强

3.2 页面结构设计

3.2.1 主页面布局

PasswordGeneratorHomePage
IndexedStack
生成密码页
密码管理页
设置页
关于页
NavigationBar
生成密码 Tab
密码管理 Tab
设置 Tab

3.2.2 生成密码页结构

生成密码页
SliverAppBar
密码类型选择
密码长度设置
密码规则选择
密码显示区
强度指示器
操作按钮
标题
功能说明
密码类型列表
长度滑块
规则复选框
密码文本
复制按钮
生成按钮
保存按钮

3.2.3 密码管理页结构

密码管理页
SliverAppBar
搜索栏
分类筛选
密码列表
标题
统计信息
分类芯片
密码卡片
网站图标
网站名称
用户名
密码强度
操作按钮

3.2.4 设置页结构

设置页
SliverAppBar
安全设置
导出设置
界面设置
自动锁定
生物识别
导出密码
导入密码
主题设置
语言设置

3.3 密码生成逻辑



开始生成
获取密码长度
获取密码规则
生成随机字符
应用密码规则
检查密码强度
强度达标?
返回密码
显示密码
复制到剪贴板

3.4 密码强度检测逻辑

0-25
26-50
51-75
76-100
开始检测
分析密码长度
分析字符类型
分析复杂度
计算强度分数
分数范围



非常强
返回强度


四、UI设计规范

4.1 配色方案

应用以科技感的紫色为主色调,象征安全与创新:

颜色类型 色值 用途
主色 #9C27B0 (Purple) 导航、主题元素
辅助色 #BA68C8 生成密码页面
第三色 #CE93D8 密码管理页面
强调色 #E1BEE7 设置页面
背景色 #FAFAFA 页面背景
卡片背景 #FFFFFF 密码卡片
成功色 #4CAF50 复制成功
警告色 #FF9800 强度警告

4.2 密码强度颜色定义

强度 色值 视觉效果
#F44336 红色,不安全
#FF9800 黄色,一般安全
#4CAF50 绿色,安全
非常强 #9C27B0 紫色,非常安全

4.3 字体规范

元素 字号 字重 颜色
页面标题 24px Bold 主色
密码文本 18px Medium #000000
网站名称 16px Bold #000000
用户名 14px Regular 灰色
强度标签 14px Regular 对应强度颜色

4.4 组件规范

4.4.1 密码生成卡片
复制代码
┌─────────────────────────────────────┐
│  🔐  通用密码                      │
│                                     │
│  长度: 12                           │
│  规则: 大写字母、小写字母、数字、特殊字符 │
│                                     │
│  ┌─────────────────────────────┐   │
│  │  A7$b9@C3!d5#E7            │   │
│  └─────────────────────────────┘   │
│                                     │
│  🟪  非常强                          │
│                                     │
│  [复制] [生成] [保存]                │
└─────────────────────────────────────┘
4.4.2 密码卡片
复制代码
┌─────────────────────────────────────┐
│  📱  社交媒体                      │
│                                     │
│  网站: 微信                          │
│  用户名: user123                    │
│  密码: ********                      │
│  提示: 生日+宠物名字                  │
│                                     │
│  🟩  强                              │
│                                     │
│  [查看] [编辑] [删除]                │
└─────────────────────────────────────┘
4.4.3 强度指示器
复制代码
┌─────────────────────────────────────┐
│  密码强度                            │
│                                     │
│  ┌─────────────────────────────┐   │
│  │▓▓▓▓▓▓▓▓░░░░░░  75%          │   │
│  └─────────────────────────────┘   │
│                                     │
│  🟪  非常强                          │
└─────────────────────────────────────┘
4.4.4 规则选择器
复制代码
┌─────────────────────────────────────┐
│  密码规则                            │
│                                     │
│  □ 🔠 包含大写字母                    │
│  □ 🔡 包含小写字母                    │
│  □ 🔢 包含数字                      │
│  □ 🎭 包含特殊字符                    │
│  □ 🚫 避免相似字符                    │
│  □ 🔄 避免连续字符                    │
└─────────────────────────────────────┘
4.4.5 密码长度滑块
复制代码
┌─────────────────────────────────────┐
│  密码长度: 12                        │
│                                     │
│  ┌─────────────────────────────┐   │
│  │▓▓▓▓▓▓░░░░░░░░░░░░         │   │
│  └─────────────────────────────┘   │
│  8       12       16       20      │
└─────────────────────────────────────┘

五、核心功能实现

5.1 密码生成页面实现

dart 复制代码
class GeneratePage extends StatefulWidget {
  @override
  State<GeneratePage> createState() => _GeneratePageState();
}

class _GeneratePageState extends State<GeneratePage> {
  int _passwordLength = 12;
  PasswordType _selectedType = PasswordType.general;
  bool _includeUppercase = true;
  bool _includeLowercase = true;
  bool _includeNumbers = true;
  bool _includeSpecial = true;
  String _generatedPassword = '';
  PasswordStrength _strength = PasswordStrength.weak;

  @override
  void initState() {
    super.initState();
    _generatePassword();
  }

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: [
        SliverAppBar(
          title: Text('生成密码'),
        ),
        SliverToBoxAdapter(
          child: Padding(
            padding: const EdgeInsets.all(16),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                _buildPasswordTypeSelector(),
                _buildPasswordLengthSlider(),
                _buildPasswordRules(),
                _buildPasswordDisplay(),
                _buildStrengthIndicator(),
                _buildActionButtons(),
              ],
            ),
          ),
        ),
      ],
    );
  }

  void _generatePassword() {
    final generator = PasswordGenerator();
    _generatedPassword = generator.generate(
      length: _passwordLength,
      includeUppercase: _includeUppercase,
      includeLowercase: _includeLowercase,
      includeNumbers: _includeNumbers,
      includeSpecial: _includeSpecial,
    );
    _strength = PasswordStrengthDetector.detect(_generatedPassword);
    setState(() {});
  }

  void _copyPassword() {
    Clipboard.setData(ClipboardData(text: _generatedPassword));
    ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(content: Text('密码已复制到剪贴板')),
    );
  }
}

5.2 密码管理页面实现

dart 复制代码
class ManagePage extends StatefulWidget {
  @override
  State<ManagePage> createState() => _ManagePageState();
}

class _ManagePageState extends State<ManagePage> {
  List<Password> _passwords = [];
  WebsiteCategory? _selectedCategory;

  @override
  void initState() {
    super.initState();
    _loadPasswords();
  }

  void _loadPasswords() {
    _passwords = [
      Password(
        id: '1',
        website: '微信',
        username: 'user123',
        password: 'A7$b9@C3!d5#',
        hint: '生日+宠物名字',
        type: PasswordType.social,
        category: WebsiteCategory.socialMedia,
        strength: PasswordStrength.strong,
        createdAt: DateTime.now().subtract(Duration(days: 30)),
        updatedAt: DateTime.now().subtract(Duration(days: 10)),
      ),
      Password(
        id: '2',
        website: '支付宝',
        username: 'alipay_user',
        password: 'P@ssw0rd!2024',
        hint: '纪念日+幸运数字',
        type: PasswordType.financial,
        category: WebsiteCategory.financial,
        strength: PasswordStrength.medium,
        createdAt: DateTime.now().subtract(Duration(days: 60)),
        updatedAt: DateTime.now().subtract(Duration(days: 5)),
      ),
    ];
  }

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: [
        SliverAppBar(
          title: Text('密码管理'),
          actions: [
            IconButton(
              icon: Icon(Icons.add),
              onPressed: () => _addPassword(),
            ),
          ],
        ),
        SliverToBoxAdapter(
          child: _buildCategoryFilter(),
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) => PasswordCard(password: _passwords[index]),
            childCount: _passwords.length,
          ),
        ),
      ],
    );
  }

  void _addPassword() {
    // 添加密码逻辑
  }
}

5.3 密码生成器实现

dart 复制代码
class PasswordGenerator {
  static const String _uppercase = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
  static const String _lowercase = 'abcdefghijklmnopqrstuvwxyz';
  static const String _numbers = '0123456789';
  static const String _special = '!@#%^&*()_+-=[]{}|;:,.<>?';
  static const String _similar = '1lI0O';

  String generate({
    required int length,
    required bool includeUppercase,
    required bool includeLowercase,
    required bool includeNumbers,
    required bool includeSpecial,
    bool avoidSimilar = false,
    bool avoidConsecutive = false,
  }) {
    String chars = '';
    if (includeUppercase) chars += _uppercase;
    if (includeLowercase) chars += _lowercase;
    if (includeNumbers) chars += _numbers;
    if (includeSpecial) chars += _special;

    if (avoidSimilar) {
      for (var char in _similar.split('')) {
        chars = chars.replaceAll(char, '');
      }
    }

    final random = Random();
    String password = '';
    String lastChar = '';

    for (int i = 0; i < length; i++) {
      String char;
      do {
        char = chars[random.nextInt(chars.length)];
      } while (avoidConsecutive && char == lastChar);
      password += char;
      lastChar = char;
    }

    return password;
  }
}

5.4 密码强度检测器实现

dart 复制代码
class PasswordStrengthDetector {
  static PasswordStrength detect(String password) {
    int score = 0;

    // 长度得分
    if (password.length >= 8) score += 20;
    if (password.length >= 12) score += 10;
    if (password.length >= 16) score += 10;

    // 字符类型得分
    if (RegExp(r'[A-Z]').hasMatch(password)) score += 15;
    if (RegExp(r'[a-z]').hasMatch(password)) score += 15;
    if (RegExp(r'[0-9]').hasMatch(password)) score += 15;
    if (RegExp(r'[!@#$%^&*(),.?":{}|<>]').hasMatch(password)) score += 15;

    // 复杂度得分
    if (password.length >= 10 &&
        RegExp(r'[A-Z]').hasMatch(password) &&
        RegExp(r'[a-z]').hasMatch(password) &&
        RegExp(r'[0-9]').hasMatch(password) &&
        RegExp(r'[!@#$%^&*(),.?":{}|<>]').hasMatch(password)) {
      score += 10;
    }

    if (score <= 25) return PasswordStrength.weak;
    if (score <= 50) return PasswordStrength.medium;
    if (score <= 75) return PasswordStrength.strong;
    return PasswordStrength.veryStrong;
  }
}

5.5 密码管理器实现

dart 复制代码
class PasswordManager {
  static Future<void> savePassword(Password password) async {
    final prefs = await SharedPreferences.getInstance();
    final passwords = prefs.getStringList('passwords') ?? [];
    passwords.add(jsonEncode(password.toJson()));
    await prefs.setStringList('passwords', passwords);
  }

  static Future<List<Password>> getPasswords() async {
    final prefs = await SharedPreferences.getInstance();
    final passwords = prefs.getStringList('passwords') ?? [];
    return passwords
        .map((p) => Password.fromJson(jsonDecode(p)))
        .toList();
  }

  static Future<void> deletePassword(String id) async {
    final prefs = await SharedPreferences.getInstance();
    final passwords = prefs.getStringList('passwords') ?? [];
    passwords.removeWhere((p) => jsonDecode(p)['id'] == id);
    await prefs.setStringList('passwords', passwords);
  }
}

六、交互设计

6.1 密码生成流程

强度检测器 密码生成器 生成密码页 用户 强度检测器 密码生成器 生成密码页 用户 设置密码长度 选择密码规则 选择规则 点击生成 生成密码 返回密码 检测强度 返回强度 显示密码和强度 点击复制 复制到剪贴板

6.2 密码管理流程

点击查看
点击编辑
点击删除
点击添加
打开密码管理页
加载密码列表
显示密码卡片
用户操作
显示密码详情
编辑密码
删除密码
添加密码
复制密码
保存修改
确认删除
填写密码信息

6.3 密码强度检测流程

输入密码
分析长度
分析字符类型
分析复杂度
计算得分
评估强度
显示结果


七、扩展功能规划

7.1 后续版本规划

2024-01-07 2024-01-14 2024-01-21 2024-01-28 2024-02-04 2024-02-11 2024-02-18 2024-02-25 2024-03-03 2024-03-10 2024-03-17 2024-03-24 2024-03-31 2024-04-07 基础UI框架 密码生成功能 密码管理功能 强度检测功能 导出导入功能 生物识别功能 云同步功能 密码健康检查 批量操作功能 V1.0 基础版本 V1.1 增强版本 V1.2 进阶版本 密码生成器应用开发计划

7.2 功能扩展建议

7.2.1 云同步功能

云同步功能:

  • 密码数据云端备份
  • 多设备同步
  • 加密传输
  • 恢复功能
7.2.2 密码健康检查

健康检查功能:

  • 检测弱密码
  • 检测重复密码
  • 检测过期密码
  • 提供改进建议
7.2.3 批量操作功能

批量操作功能:

  • 批量导出密码
  • 批量删除密码
  • 批量更新密码
  • 批量分类管理

八、注意事项

8.1 开发注意事项

  1. 数据安全:密码数据需加密存储,确保安全

  2. 权限管理:剪贴板操作需注意权限申请

  3. 用户体验:密码显示需支持明文/密文切换

  4. 性能优化:密码生成算法需高效,避免卡顿

  5. 隐私保护:本地存储需加密,防止数据泄露

8.2 常见问题

问题 原因 解决方案
密码生成失败 规则冲突 检查密码规则设置
密码强度低 规则设置简单 增加密码长度和规则
复制失败 权限不足 引导用户开启权限
数据丢失 未备份 定期导出备份
同步失败 网络问题 检查网络连接

8.3 使用技巧

🔐 密码安全使用技巧 🔐

密码设置建议

  • 不同网站使用不同密码
  • 密码长度至少12位
  • 包含大小写字母、数字和特殊字符
  • 避免使用个人信息

密码管理技巧

  • 使用密码管理器存储密码
  • 定期更新重要密码
  • 启用双因素认证
  • 不要在不安全的设备上输入密码

安全习惯

  • 不要将密码告诉他人
  • 不要在公共场合输入密码
  • 定期检查账户活动
  • 及时更新密码

紧急情况处理

  • 如果密码泄露,立即修改
  • 启用账户保护
  • 联系网站客服
  • 监控账户活动

九、运行说明

9.1 环境要求

环境 版本要求
Flutter SDK >= 3.0.0
Dart SDK >= 2.17.0
鸿蒙OS API 21+
Web浏览器 Chrome 90+
存储权限 读写权限

9.2 运行命令

bash 复制代码
# 查看可用设备
flutter devices

# 运行到Web服务器
flutter run -d web-server -t lib/main_password_generator.dart --web-port 8150

# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_password_generator.dart

# 代码分析
flutter analyze lib/main_password_generator.dart

十、总结

密码生成器应用通过生成密码、密码管理、设置三大模块,为用户提供了一个安全、便捷的密码管理工具。应用支持生成强密码、检测密码强度、管理密码信息等功能,帮助用户提升网络安全。

核心功能涵盖密码生成、密码强度检测、密码管理、网站分类四大模块。密码生成支持自定义长度和规则;密码强度检测评估密码安全性;密码管理支持添加、编辑、删除密码;网站分类方便用户按类别管理密码。

应用采用 Material Design 3 设计规范,以科技感的紫色为主色调,象征安全与创新。通过本应用,希望能够帮助用户轻松管理各类账号密码,提升网络安全意识,保护个人信息安全。

密码生成器------安全密码,一键生成


相关推荐
江畔何人初2 小时前
http协议的概念以及http1,http2,http3的区别
网络·网络协议·http
SariHcr1232 小时前
PG2K100千兆以太网接口速度测试
网络·嵌入式硬件·嵌入式实时数据库
三道渊2 小时前
Linux进程通信与信号处理全解析
linux·服务器·网络
fengci.2 小时前
LilCTF2025web(前半部分)
开发语言·网络·学习·php
AI_Claude_code2 小时前
ZLibrary访问困境方案六:自建RSS/Calibre内容同步服务器的完整指南
运维·服务器·网络·爬虫·python·tcp/ip·http
zhangrelay2 小时前
蓝桥云课一分钟-绚丽贪吃蛇-后续-cmake
笔记·学习
百撕可乐2 小时前
WenDoraAi官网NextJS实战04:HTTP 请求封装与SSR
前端·网络·网络协议·react.js·http
AI_零食2 小时前
开源鸿蒙跨平台Flutter开发:生日纪念日提醒应用
运维·flutter·开源·harmonyos·鸿蒙
世人万千丶2 小时前
Flutter 框架跨平台鸿蒙开发 - AR寻宝探险游戏应用
学习·flutter·游戏·华为·开源·ar·harmonyos