Flutter笔记:Widgets Easier组件库-使用隐私守卫

简介: Flutter笔记:Widgets Easier组件库-使用隐私守卫

1. 概述

1.1 关于Widgets Easier

本库是一个 Flutter 组件库,旨在提供用于Flutter开发的组件,使得开发者能够更简单地构建出更丰富地界面效果。项目地址为:

1.2 模块安装

在你的Flutter项目中,运行下面的命令:

flutter pub add widgets_easier

即可安装最新版本的 Widgets Easier 库。

2. 隐私守卫

隐私保护组件PrivacyGuard用于保护一些页面信息不被截屏和泄露。在一些场景下,我们需要对页面做一些保护处理。比如用户输入密码时,我系需要禁止截屏录屏,而用户离开页面时,也可能需要对页面实现一个模糊化的效果。这是比价常用的功能,但是对话禁止录屏等操作Flutter没有直接的接口,每次都些通信实现这样一个简单组件比较麻烦。因此widgets Easier 针对于Android和iOS进行了封装,直接以单子部件的形式提供使用。PrivacyGuard部件的签名如下:

const PrivacyGuard({
  super.key,
  required this.child, // 被保护的子组件
  this.blurRadius = 10.0, // 模糊半径
  this.blurColor = const Color.fromARGB(136, 225, 225, 225), // 模糊颜色
  this.onEnterPrivacyMode, // 离开页面时的回调
  this.onExitPrivacyMode, // 回到页面时的回调
  this.preventScreenshot = false, // 是否禁止截屏
});

下面的代码展示了一个被PrivacyGuard所守卫的登录页面:

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

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

  @override
  Widget build(BuildContext context) {
    return PrivacyGuard(
      preventScreenshot: true,
      onEnterPrivacyMode: () => print('onEnterPrivacyMode'),
      onExitPrivacyMode: () => print('onExitPrivacyMode'),
      child: SafeArea(
        child: Scaffold(
          appBar: AppBar(
            title: const Text('登录页面'),
          ),
          body: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  const Text(
                    '守卫登录页',
                    style: TextStyle(
                      fontSize: 24.0,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  const SizedBox(height: 32.0),
                  const TextField(
                    decoration: InputDecoration(
                      labelText: '账户',
                      border: OutlineInputBorder(),
                    ),
                  ),
                  const SizedBox(height: 16.0),
                  const TextField(
                    decoration: InputDecoration(
                      labelText: '密码',
                      border: OutlineInputBorder(),
                    ),
                    obscureText: true,
                  ),
                  const SizedBox(height: 16.0),
                  ElevatedButton(
                    onPressed: () {
                      // 登录逻辑
                    },
                    child: const Text('登录'),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

页面的大致效果如下:

image.png

image.png

3. 问题报告和代码贡献

问题报告

您可以在该项目的 GitHub 页面上提供反馈或报告问题。如果您觉得这个库缺少某个功能,请创建一个功能请求。在提交前,请先检查是否已又类似问题。

代码贡献

请将此仓库Fock到您的账户中,修改后rebase再PR到dev分支。建议提交信息格式为:

type(scope): info about commit.
目录
相关文章
|
2月前
|
API 容器
Flutter UI组件库(JUI)
Flutter UI组件库(JUI)
181 17
|
1月前
|
Dart JavaScript 前端开发
Flutter 的 Widget 概述与常用 Widgets 与鸿蒙 Next 的对比
Flutter 是 Google 开发的开源 UI 框架,用于快速构建高性能的移动、Web 和桌面应用。Flutter 通过 Widget 构建 UI,每个 UI 元素都是 Widget,包括文本、按钮、图片等。Widget 不仅描述外观,还描述行为,是不可变的。常见的 Widget 包括结构型(Container、Column、Row)、呈现型(Text、Image)、交互型(ElevatedButton)和状态管理型(StatefulWidget)。Flutter 与鸿蒙 Next 在组件化架构、开发语言、布局系统、性能和跨平台支持方面各有优势
75 0
|
4月前
|
Dart
Flutter笔记:手动配置VSCode中Dart代码自动格式化
Flutter笔记:手动配置VSCode中Dart代码自动格式化
581 5
|
4月前
|
UED 开发者
Flutter笔记:Widgets Easier组件库(13)- 使用底部弹窗
Flutter笔记:Widgets Easier组件库(13)- 使用底部弹窗
102 2
|
4月前
|
数据采集 API 调度
Flutter笔记:关于SchedulerBinding
Flutter笔记:关于SchedulerBinding
104 1
|
4月前
|
开发者
Flutter笔记:Widgets Easier组件库 - 使用标签(Tag)
Flutter笔记:Widgets Easier组件库 - 使用标签(Tag)
134 0
|
2月前
|
Android开发 iOS开发 容器
鸿蒙harmonyos next flutter混合开发之开发FFI plugin
鸿蒙harmonyos next flutter混合开发之开发FFI plugin
|
1月前
|
开发框架 Dart 前端开发
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。本文从 Flutter 简介、特点、开发环境搭建、应用架构、组件详解、路由管理、状态管理、与原生代码交互、性能优化、应用发布与部署及未来趋势等方面,全面解析 Flutter 技术,助你掌握这一前沿开发工具。
56 8
|
1月前
|
存储 JavaScript 前端开发
在Flutter开发中,状态管理至关重要。随着应用复杂度的提升,有效管理状态成为挑战
在Flutter开发中,状态管理至关重要。随着应用复杂度的提升,有效管理状态成为挑战。本文介绍了几种常用的状态管理框架,如Provider和Redux,分析了它们的基本原理、优缺点及适用场景,并提供了选择框架的建议和使用实例,旨在帮助开发者提高开发效率和应用性能。
36 4
|
1月前
|
传感器 前端开发 Android开发
在 Flutter 开发中,插件开发与集成至关重要,它能扩展应用功能,满足复杂业务需求
在 Flutter 开发中,插件开发与集成至关重要,它能扩展应用功能,满足复杂业务需求。本文深入探讨了插件开发的基本概念、流程、集成方法、常见类型及开发实例,如相机插件的开发步骤,同时强调了版本兼容性、性能优化等注意事项,并展望了插件开发的未来趋势。
40 2