Flutter本地数据存储插件shared_preferences_tools的使用

shared_preferences_tools 是一个为 Flutter 的 shared_preferences 包提供的 DevTools 扩展。通过这个工具，你可以在 Flutter DevTools 中更方便地管理和操作 SharedPreferences 中的数据。

特性

• 列出所有键：查看应用中存储的所有 SharedPreferences 键。
• 搜索特定键：快速找到特定的键。
• 直接编辑或删除值：对值进行编辑或删除，更改会立即反映在应用中。

支持的数据类型包括：

• String
• int
• double
• bool
• List<String>

选择键	编辑值

入门指南

要将此包添加到你的项目中，运行以下命令：

flutter pub add shared_preferences_tools

完成后，只需打开 Flutter DevTools 并使用 SharedPreferences 工具即可！

贡献到此包

1. 运行示例项目（或任何依赖于 shared_preferences_tools 的项目），并复制其调试服务 URL。
2. 通过 VSCode 或运行以下命令来运行 shared_preferences_tools_devtools_extension 项目：

flutter run -d chrome --dart-define=use_simulated_environment=true

更多详细信息，请参阅 devtools_extensions 包文档。

示例代码

以下是一个完整的示例代码，展示了如何使用 shared_preferences_tools 和 shared_preferences 存储和读取数据。

example/lib/main.dart

// ignore_for_file: public_member_api_docs

import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:shared_preferences/shared_preferences.dart';

Future<void> _setInitialValues() async {
  WidgetsFlutterBinding.ensureInitialized();
  final SharedPreferences prefs = await SharedPreferences.getInstance();

  if (prefs.getKeys().isNotEmpty) {
    return;
  }

  final SharedPreferencesAsync asyncPrefs = SharedPreferencesAsync();

  await <Future<void>>[
    prefs.setString('someStringKey', 'Hello, world!'),
    prefs.setInt('someIntKey', 42),
    prefs.setDouble('someDoubleKey', 3.14),
    prefs.setBool('someBoolKey', true),
    prefs.setStringList(
      'someStringListKey',
      <String>['Hello World 1', 'Hello World 2'],
    ),
    asyncPrefs.setString('asyncStringKey', 'Hello, async world!'),
    asyncPrefs.setInt('asyncIntKey', 24),
    asyncPrefs.setDouble('asyncDoubleKey', 1.41),
    asyncPrefs.setBool('asyncBoolKey', false),
    asyncPrefs.setStringList(
      'asyncStringListKey',
      <String>['Hello Async World 1', 'Hello Async World 2'],
    ),
  ].wait;
}

Future<void> main() async {
  await _setInitialValues();

  runApp(const SharedPreferencesToolsExample());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Shared Preferences Tools Example',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const Scaffold(
        body: _Content(),
      ),
    );
  }
}

class _Content extends HookWidget {
  const _Content();

  @override
  Widget build(BuildContext context) {
    final SharedPreferences? prefs =
        useFuture(SharedPreferences.getInstance()).data;
    final SharedPreferencesAsync asyncPrefs =
        useMemoized(() => SharedPreferencesAsync());
    final ValueNotifier<bool> loadingState = useState(false);
    final asyncStringKey = useFuture(asyncPrefs.getString('asyncStringKey')).data;
    final asyncIntKey = useFuture(asyncPrefs.getInt('asyncIntKey')).data;
    final asyncDoubleKey = useFuture(asyncPrefs.getDouble('asyncDoubleKey')).data;
    final asyncBoolKey = useFuture(asyncPrefs.getBool('asyncBoolKey')).data;
    final asyncStringListKey = useFuture(asyncPrefs.getStringList('asyncStringListKey')).data;

    if (prefs == null || loadingState.value) {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }

    return Center(
      child: ListView(
        shrinkWrap: true,
        padding: const EdgeInsets.all(16),
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text('someStringKey: ${prefs.getString('someStringKey')}'),
              const SizedBox(height: 8),
              Text('someIntKey: ${prefs.getInt('someIntKey')}'),
              const SizedBox(height: 8),
              Text('someDoubleKey: ${prefs.getDouble('someDoubleKey')}'),
              const SizedBox(height: 8),
              Text('someBoolKey: ${prefs.getBool('someBoolKey')}'),
              const SizedBox(height: 8),
              Text(
                'someStringListKey: ${prefs.getStringList('someStringListKey')}',
              ),
              const SizedBox(height: 8),
              Text('asyncStringKey: $asyncStringKey'),
              const SizedBox(height: 8),
              Text('asyncIntKey: $asyncIntKey'),
              const SizedBox(height: 8),
              Text('asyncDoubleKey: $asyncDoubleKey'),
              const SizedBox(height: 8),
              Text('asyncBoolKey: $asyncBoolKey'),
              const SizedBox(height: 8),
              Text('asyncStringListKey: $asyncStringListKey'),
            ],
          ),
        ],
      ),
    );
  }
}

解释

1. 初始化数据：_setInitialValues 函数在应用启动时初始化一些示例数据。
2. 主函数：main 函数调用 _setInitialValues 并启动应用。
3. 应用入口：SharedPreferencesToolsExample 是应用的入口点，创建了一个 MaterialApp。
4. 内容展示：_Content 组件使用 flutter_hooks 来管理状态，并展示从 SharedPreferences 中读取的数据。

通过这个示例，你可以看到如何使用 shared_preferences 存储和读取不同类型的值，并且可以通过 shared_preferences_tools 在 DevTools 中方便地管理这些数据。