Flutter应用设置管理插件easy_app_setting的使用

Flutter应用设置管理插件easy_app_setting的使用

easy_app_setting 插件是一个用于轻松管理和实时更新应用设置的工具。它通过 Firebase Realtime Database 提供了一个直观且高效的用户界面来管理用户的额外数据。

功能概述

  • easy_app_setting 提供了简单易用的 UI/UX 和逻辑,用于在实时数据库中管理设置。
  • 它是一个简单的容器,用于存储用户的额外数据。这些数据可以在多个地方使用,但它是公开的。如果数据量过大,可能会增加成本,并且无法保存私密信息(如密码、电子邮件等)。
  • 可以配置任意类型的设置。

待办事项

  • 添加 sync 选项。
  • 将用户设置与应用设置分开。
  • 提供一个选项,允许使用 Firebase Firestore 或 Realtime Database。例如,有些值可能经常变化且可读。easy_app_setting 支持同时使用 Firebase 和 Realtime Database,可以将设置数据镜像到 Realtime Database 并使用它。

安全规则

  1. 安装以下安全规则文件:
    https://github.com/thruthesky/easy_packages/blob/main/docs/database_security_rules.json
    

数据库结构

  • /user-settings: 每个用户的设置节点。
    • /user-settings/<uid>: 用户的设置节点。
      • /user-settings/<uid>/<key>: 设置的键。
      • /user-settings/<uid>/<key>: value: 设置的值。
  • 数据是私有的,只有用户可以读写。

使用方法

显示和更新值

要显示和更新某个值,可以使用以下代码:

UserSettingModel(
  builder: (sm) {
    return ListTile(
      title: Text('系统计数: ${sm.value<int>('count') ?? 0}'), // 获取设置值
      onTap: () {
        // 更新任何形式的数据
        sm.update({'count': (sm.value<int>('count') ?? 0) + 1});
      },
    );
  },
),

增加或减少整数值

要增加或减少整数值,可以使用以下代码:

sm.increment('count'); // 增加计数

用户设置

对于用户设置,可以使用 Firebase Auth 的 UID 来标识用户。例如:

Setting(
  id: FirebaseAuth.instance.currentUser!.uid, // 获取当前用户的 UID
  builder: (sm) {
    return ListTile(
      title: Text('我喜欢: ${sm.value<String>('fruit') ?? '...'}'), // 获取水果设置
      subtitle: Row(
        children: [
          TextButton(
            child: const Text('苹果'),
            onPressed: () {
              sm.update({'fruit': 'Apple'}); // 更新为苹果
            },
          ),
          TextButton(
            child: const Text('香蕉'),
            onPressed: () {
              sm.update({'fruit': 'Banana'}); // 更新为香蕉
            },
          ),
        ],
      ),
    );
  },
),

完整示例代码

以下是一个完整的示例代码,展示了如何使用 easy_app_setting 插件来管理应用设置:

import 'package:flutter/material.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:easy_app_setting/easy_app_setting.dart';

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SettingsPage(),
    );
  }
}

class SettingsPage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('应用设置'),
      ),
      body: Column(
        children: [
          UserSettingModel(
            builder: (sm) {
              return ListTile(
                title: Text('系统计数: ${sm.value<int>('count') ?? 0}'),
                onTap: () {
                  sm.update({'count': (sm.value<int>('count') ?? 0) + 1});
                },
              );
            },
          ),
          Setting(
            id: FirebaseAuth.instance.currentUser!.uid,
            builder: (sm) {
              return ListTile(
                title: Text('我喜欢: ${sm.value<String>('fruit') ?? '...'}'),
                subtitle: Row(
                  children: [
                    TextButton(
                      child: Text('苹果'),
                      onPressed: () {
                        sm.update({'fruit': 'Apple'});
                      },
                    ),
                    TextButton(
                      child: Text('香蕉'),
                      onPressed: () {
                        sm.update({'fruit': 'Banana'});
                      },
                    ),
                  ],
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

更多关于Flutter应用设置管理插件easy_app_setting的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter应用设置管理插件easy_app_setting的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


easy_app_setting 是一个用于 Flutter 应用的插件,它简化了应用设置的管理。通过这个插件,你可以轻松地存储和获取应用的配置信息,例如用户偏好、主题设置、语言选择等。以下是如何使用 easy_app_setting 插件的详细步骤:

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 easy_app_setting 插件的依赖。

dependencies:
  flutter:
    sdk: flutter
  easy_app_setting: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 初始化插件

在你的应用的 main.dart 文件中初始化 easy_app_setting

import 'package:easy_app_setting/easy_app_setting.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyAppSetting.init();  // 初始化插件
  runApp(MyApp());
}

3. 使用插件存储和获取设置

你可以在应用的任何地方使用 EasyAppSetting 来存储和获取设置。

存储设置

EasyAppSetting.setString('theme', 'dark');  // 存储字符串
EasyAppSetting.setInt('font_size', 14);     // 存储整数
EasyAppSetting.setBool('is_first_run', false); // 存储布尔值
EasyAppSetting.setDouble('opacity', 0.5);   // 存储双精度浮点数

获取设置

String theme = await EasyAppSetting.getString('theme', defaultValue: 'light');
int fontSize = await EasyAppSetting.getInt('font_size', defaultValue: 12);
bool isFirstRun = await EasyAppSetting.getBool('is_first_run', defaultValue: true);
double opacity = await EasyAppSetting.getDouble('opacity', defaultValue: 1.0);

4. 删除设置

你可以使用 remove 方法来删除特定的设置。

await EasyAppSetting.remove('theme');

5. 清除所有设置

如果你想清除所有的设置,可以使用 clear 方法。

await EasyAppSetting.clear();

6. 监听设置变化

你可以监听设置的变化,以便在设置改变时更新 UI。

EasyAppSetting.addListener('theme', (key, value) {
  print('Theme changed to $value');
});

7. 示例代码

以下是一个完整的示例,展示了如何使用 easy_app_setting 插件来管理应用的设置。

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

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyAppSetting.init();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Easy App Setting Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SettingScreen(),
    );
  }
}

class SettingScreen extends StatefulWidget {
  [@override](/user/override)
  _SettingScreenState createState() => _SettingScreenState();
}

class _SettingScreenState extends State<SettingScreen> {
  String _theme = 'light';

  [@override](/user/override)
  void initState() {
    super.initState();
    _loadTheme();
  }

  Future<void> _loadTheme() async {
    String theme = await EasyAppSetting.getString('theme', defaultValue: 'light');
    setState(() {
      _theme = theme;
    });
  }

  Future<void> _toggleTheme() async {
    String newTheme = _theme == 'light' ? 'dark' : 'light';
    await EasyAppSetting.setString('theme', newTheme);
    setState(() {
      _theme = newTheme;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('App Settings'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Current Theme: $_theme',
              style: TextStyle(fontSize: 24),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _toggleTheme,
              child: Text('Toggle Theme'),
            ),
          ],
        ),
      ),
    );
  }
}
回到顶部