Flutter本地存储插件get_storage_pro的使用

发布于 1周前 作者 eggper 来自 Flutter

Flutter本地存储插件 get_storage_pro 的使用

get_storage_pro 是一个基于 get_storage 的 Flutter 插件,它简化了对象的存储和检索过程。本文将详细介绍如何使用 get_storage_pro 来进行本地数据存储。

概述

get_storage_pro 提供了存储对象、对象列表以及从存储中获取单个或多个对象的功能。在使用 GetStoragePro 之前,必须调用 GetStoragePro.init() 进行初始化。

初始化

main.dart 中,首先需要初始化 GetStoragePro

import 'package:get_storage_pro/get_storage_pro.dart';
import 'main.reflectable.dart';

void main() async {
  initializeReflectable();
  WidgetsFlutterBinding.ensureInitialized();

  // Initialize GetStoragePro (call this before using any GetStoragePro functionality)
  await GetStoragePro.init();

  runApp(const MyApp());
}

使用步骤

1. 定义模型类

定义你的模型类,并使用 [@gsp](/user/gsp) 注解,继承 CommonDataClass 并实现必要的方法。确保模型类包含一个 id 属性,类型为 String,并实现 fromMaptoMap 方法。

import 'package:get_storage_pro/src/common_data_class.dart';

[@gsp](/user/gsp)
class YourModel extends CommonDataClass<YourModel> {
  final String id;
  final String name;

  YourModel({required this.id, required this.name});

  // Must have a factory named constructor fromMap
  factory YourModel.fromMap(Map<String, dynamic> map) {
    return YourModel(
      id: map['id'] as String,
      name: map['name'] as String,
    );
  }

  [@override](/user/override)
  Map<String, dynamic> toMap() {
    return {'id': id, 'name': name};
  }
}

2. 生成反射文件

运行以下命令生成反射文件:

dart pub run build_runner build

这将在项目根目录生成 main.reflectable.dart 文件,请不要修改该文件。

3. 初始化反射

main.dart 中调用 initializeReflectable()

import 'package:get_storage_pro/get_storage_pro.dart';
import 'main.reflectable.dart';

void main() {
  initializeReflectable();
  
  // Your code here...
}

存储和获取数据

存储单个对象

YourModel model = YourModel(id: '1', name: 'John');
GetStoragePro.saveObject(model);

存储对象列表

List<YourModel> models = [
  YourModel(id: '2', name: 'Alice'),
  YourModel(id: '3', name: 'Bob'),
];
GetStoragePro.saveObjectsList(models);

获取单个对象

YourModel? retrievedModel = GetStoragePro.getObjectById<YourModel>('1');
print(retrievedModel?.name); // Output: John

获取所有对象

List<YourModel> allModels = GetStoragePro.getAllObjects<YourModel>();
print(allModels.length); // Output: 3 (including the previously saved objects)

删除对象

按 ID 删除

GetStoragePro.deleteById<YourModel>('1');

删除所有对象

GetStoragePro.deleteAllObjects<YourModel>();

监听数据变化

监听单个对象的变化

GetStoragePro.listenForObjectChanges<YourModel>(id: '1', onData: (model) {
  print('Updated model: ${model?.name}');
});

监听所有对象的变化

GetStoragePro.listenAllObjects<YourModel>(onData: (models) {
  print('All models: $models');
});

示例应用

下面是一个完整的示例应用,展示如何使用 get_storage_pro 存储用户信息:

import 'package:flutter/material.dart';
import 'package:get_storage_pro/get_storage_pro.dart';
import 'package:reflectable/reflectable.dart';

import 'main.reflectable.dart';

void main() async {
  initializeReflectable();
  WidgetsFlutterBinding.ensureInitialized();
  await GetStoragePro.init();
  runApp(const MyApp());
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'CommonDataClass Example',
      home: HomePage(),
    );
  }
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('CommonDataClass Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            User user = User(id: '1', name: 'John');
            debugPrint(user.toMap().toString()); // Output: {id: 1, name: John}

            GetStoragePro.saveObject(user);
          },
          child: const Text('Run Example'),
        ),
      ),
    );
  }
}

// Example subclass of CommonDataClass
[@gsp](/user/gsp)
class User extends CommonDataClass<User> {
  [@override](/user/override)
  final String id;
  final String name;

  User({required this.id, required this.name});

  [@override](/user/override)
  Map<String, dynamic> toMap() {
    return {
      'id': id,
      'name': name,
    };
  }

  factory User.fromMap(Map<String, dynamic> map) {
    return User(
      id: map['id'] as String,
      name: map['name'] as String,
    );
  }
}

更多关于Flutter本地存储插件get_storage_pro的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter本地存储插件get_storage_pro的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是一个关于如何在Flutter项目中使用get_storage_pro插件进行本地存储的示例代码。这个插件提供了一种简单的方法来持久化应用程序的数据。

首先,确保你的pubspec.yaml文件中已经添加了get_storage_pro依赖:

dependencies:
  flutter:
    sdk: flutter
  get_storage_pro: ^latest_version  # 请替换为最新版本号

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

接下来,你可以在你的Flutter项目中使用GetStorage来进行本地存储。以下是一个完整的示例:

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

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  // 初始化GetStorage
  final box = GetStorage();
  await box.init();

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GetStorage Pro Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final box = GetStorage();
  String? _savedValue;

  @override
  void initState() {
    super.initState();
    // 从存储中读取数据
    box.read('savedKey').then((value) {
      setState(() {
        _savedValue = value;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GetStorage Pro Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Saved Value: $_savedValue',
              style: TextStyle(fontSize: 20),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                // 显示输入框对话框
                showDialog(
                  context: context,
                  builder: (context) {
                    return AlertDialog(
                      title: Text('Enter a value'),
                      content: TextField(
                        onChanged: (value) {
                          // 更新状态以保存输入值
                          _savedValue = value;
                        },
                        decoration: InputDecoration(hintText: 'Type something'),
                      ),
                      actions: <Widget>[
                        TextButton(
                          onPressed: () {
                            Navigator.of(context).pop();
                          },
                          child: Text('Cancel'),
                        ),
                        ElevatedButton(
                          onPressed: () {
                            // 保存值到存储
                            box.write('savedKey', _savedValue!);
                            Navigator.of(context).pop();
                          },
                          child: Text('Save'),
                        ),
                      ],
                    );
                  },
                );
              },
              child: Text('Save Value'),
            ),
          ],
        ),
      ),
    );
  }
}

代码解释

  1. 初始化GetStorage: 在main函数中,我们初始化GetStorage实例并调用init方法。这一步确保存储系统已经准备好使用。

  2. 读取存储数据: 在MyHomePageinitState方法中,我们使用box.read('savedKey')从存储中读取数据,并在读取完成后更新UI。

  3. 显示和保存数据: 在UI中,我们显示当前存储的值,并提供一个按钮来打开一个对话框让用户输入新的值。当用户点击“Save”按钮时,新的值被保存到存储中。

这个示例展示了如何使用get_storage_pro插件进行基本的读写操作。你可以根据需要扩展这个示例来处理更复杂的数据结构或添加更多的功能。

回到顶部