首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何使用provider和sqflite数据库flutter在现场存储设备中保存收藏的项目

在Flutter中使用provider和sqflite数据库来保存收藏的项目到本地存储设备,可以按照以下步骤进行:

  1. 首先,确保你已经在Flutter项目中添加了provider和sqflite的依赖。在pubspec.yaml文件中添加如下代码:
代码语言:txt
复制
dependencies:
  flutter:
    sdk: flutter
  provider: ^6.0.1
  sqflite: ^2.0.0+4

然后运行flutter pub get命令来获取依赖包。

  1. 创建一个数据模型类,用于表示收藏的项目。例如,可以创建一个名为Project的类,包含项目的相关属性,如项目名称、描述等。
代码语言:txt
复制
class Project {
  final String name;
  final String description;

  Project({required this.name, required this.description});
}
  1. 创建一个Provider类,用于管理收藏项目的状态和操作。可以创建一个名为ProjectProvider的类,继承自ChangeNotifier,并在其中定义相关方法。
代码语言:txt
复制
import 'package:flutter/material.dart';

class ProjectProvider extends ChangeNotifier {
  List<Project> _projects = [];

  List<Project> get projects => _projects;

  void addProject(Project project) {
    _projects.add(project);
    notifyListeners();
  }

  void removeProject(Project project) {
    _projects.remove(project);
    notifyListeners();
  }
}
  1. 创建一个数据库帮助类,用于管理本地数据库的创建和操作。可以创建一个名为DatabaseHelper的类,其中包含创建数据库、插入数据、查询数据等方法。
代码语言:txt
复制
import 'package:sqflite/sqflite.dart';
import 'package:path/path.dart';

class DatabaseHelper {
  static final DatabaseHelper _instance = DatabaseHelper.internal();
  factory DatabaseHelper() => _instance;

  static late Database _database;

  Future<Database> get database async {
    if (_database != null) {
      return _database;
    }

    _database = await initDatabase();
    return _database;
  }

  DatabaseHelper.internal();

  Future<Database> initDatabase() async {
    String databasesPath = await getDatabasesPath();
    String path = join(databasesPath, 'my_database.db');

    return await openDatabase(
      path,
      version: 1,
      onCreate: (Database db, int version) async {
        await db.execute(
          'CREATE TABLE projects(id INTEGER PRIMARY KEY, name TEXT, description TEXT)',
        );
      },
    );
  }

  Future<int> insertProject(Project project) async {
    final db = await database;
    return await db.insert('projects', project.toMap());
  }

  Future<List<Project>> getProjects() async {
    final db = await database;
    final List<Map<String, dynamic>> maps = await db.query('projects');
    return List.generate(maps.length, (i) {
      return Project(
        name: maps[i]['name'],
        description: maps[i]['description'],
      );
    });
  }
}
  1. 在Flutter应用程序的入口处,创建ChangeNotifierProvider并将其作为顶层Widget包装整个应用程序。
代码语言:txt
复制
void main() {
  runApp(
    ChangeNotifierProvider(
      create: (context) => ProjectProvider(),
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: HomePage(),
    );
  }
}
  1. 在需要使用收藏项目的页面中,使用Consumer来获取ProjectProvider的实例,并使用其中的方法和状态。
代码语言:txt
复制
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final projectProvider = Provider.of<ProjectProvider>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
      ),
      body: ListView.builder(
        itemCount: projectProvider.projects.length,
        itemBuilder: (context, index) {
          final project = projectProvider.projects[index];
          return ListTile(
            title: Text(project.name),
            subtitle: Text(project.description),
            trailing: IconButton(
              icon: Icon(Icons.delete),
              onPressed: () {
                projectProvider.removeProject(project);
              },
            ),
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {
          final newProject = Project(
            name: 'New Project',
            description: 'Description',
          );
          projectProvider.addProject(newProject);
        },
      ),
    );
  }
}

通过以上步骤,你可以在Flutter应用中使用provider和sqflite数据库来保存收藏的项目到本地存储设备中。每当添加或删除项目时,界面会自动更新以反映最新的状态。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Flutter 应用数据持久化指南

数据持久化是指将应用程序中的数据保存在持久存储介质(如硬盘、数据库等)中的过程。在计算机科学领域,持久化数据是指数据在程序退出或系统关机后仍然存在的能力。...在移动应用开发中,数据持久化是指将应用程序中的用户数据(如用户偏好设置、用户登录状态、应用配置等)保存在设备上,以便在应用关闭或设备重启后仍然保持。...SQLite 数据库 4.1 安装与导入 在Flutter项目中使用SQLite数据库,需要添加sqflite依赖,并运行flutter pub get来安装依赖包。...文件存储 5.1 安装与导入 在Flutter项目中使用文件存储,无需额外安装依赖,因为文件操作相关的库已经包含在Flutter SDK中。...5.2 使用示例 下面是一个简单的示例,演示了如何使用文件存储在Flutter应用中读取和写入数据。

53810

FlutterUnit 桌面分支合并,一套代码 - 五端通行

image.png ---- 二、SQLite 数据库的全平台支持 sqflite 目前已经支持了 Android、 iOS, 和 MacOS 平台;对 Windows 和 Linux 的支持,可以使用...image.png ---- 目前 path_provider 已经支持了五个平台, image.png 所以我们可以不使用 sqflite#getDatabasesPath 方法,直接用 path_provider...打开数据库 由于 windows 和 linux 使用的是 sqflite_common_ffi 所以开启数据库的方式不同。...---- 三、运行项目与窗口优化 在 AndroidStudio 中可以选择对应的对应的桌面设备来运行: image.png ---- 1....image.png 让一个项目同时支持多端的好处在于 业务逻辑 可以共用,这时候使用状态管理,分离视图和业务层次的优势就可以体现出来了。

1.6K20
  • Flutter 入门指北之数据持久化

    数据持久化主要有如下方式 文件读写 shared_preferences存储 数据库存储 持久化的实现都需要通过三方插件来实现,接着会慢慢介绍三种实现方式 文件读写/ IO 操作 文件读写需要 path_provider...path_provider用于获取手机的存储文件位置,一共有三个方法 getTemporaryDirectory临时目录,在 Android 中对应的方法为 getCacheDir,而在 iOS 中对应为...因为在例子中,我们保存的数据相对比较简单,所以这边就不得不说另外一种更方便的持久化方式了 shared_preferences SharedPreferences 写 Android 的小伙伴对这个应该不陌生了...以上代码查看 data_persistence_main.dart文件 Sqflite Flutter实现数据库存储需要通过插件 sqflite来实现,写文章的时候最新的版本是 sqflite 1.1.3...sqflite 的基本操作语句,在文档中已经写得非常明白了,所以就不搬运了,这边直接讲下对于数据库的一些封装处理吧,因为打开数据库是一个很消耗资源的一个过程,所以呢,推荐实现单例会比较好。

    1.5K10

    Flutter学习指南App, 一起来玩Flutter吧~

    Flutter是谷歌的移动UI框架,可以快速在iOS、Android、Web和PC上构建高质量的原生用户界面。Flutter可以与现有的代码一起工作。...在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。同时它也是构建未来的Google Fuchsia应用的主要方式。...如何入门Flutter 1.了解Android/IOS基础知识.包括平台特性、项目结构等. 2.了解Dart基础语法知识.可点击Dart中文网进行学习. 3.学习Flutter基础知识.包括组件使用、包管理...Flutter学习指南 为了能够方便大家快速学习Flutter, 我简单写了一个Flutter学习指南App,包含众多组件和插件的使用, 是学习和体验flutter组件的小Demo....device_info (设备信息) 非常感谢 阿里巴巴的入门级项目 flutter-go flutter实战 flutter插件平台

    1.7K10

    Flutter中的本地存储

    好吧,还是回归今天的主题,我们还是来看下Flutter中的本地存储吧 Flutter本地存储 ---- 和Android、Ios类似,Flutter也支持Preferences(Shared Preferences...同样的方法,我们需要在pubspec.yaml文件中引入 path_provider: ^0.4.0 然后调用flutter packages get 最后在自己的Dart文件中引入 import ‘package...:path_provider/path_provider.dart’; 即可使用Flutter中的文件存储 在path_provider中有三个获取文件路径的方法: getTemporaryDirectory...同样的方法,我们需要在pubspec.yaml文件中引入 sqflite: >=0.8.5 然后调用flutter packages get 最后在自己的Dart文件中引入 import ‘package...:sqflite/sqflite.dart’; 即可在Flutter使用Sqlite 同样的,我慢还是先贴代码: 首先,我们需要获取一下我们数据库存储的目录,数据库名字为name.db 然后建立库和数据表

    5K30

    【Flutter 实战】大量复杂数据持久化

    老孟导读:上一篇文章讲解了 Android 和 iOS 的文件目录系统,此篇文章讲解如何使用 SQLite 保存大量复杂数据数据。...SQLite 是目前最受欢迎的本地存储框架之一,此篇文章将会介绍如何使用 SQLite 保存、查询、删除数据等。...我觉得没有必要,应用程序使用的数据库和 SQL 语句相关知识都是非常基础的,比如打开数据库、创建表、SQL 查询语句、更新语句、删除语句等,这些都是固定的格式,固定语句记住即可。...添加依赖 SQLite 并不是 Flutter 系统自带的,而是一个第三方插件,在项目的 pubspec.yaml 文件中添加依赖: dependencies: sqflite: ^1.3.1...path_provider: ^1.6.11 执行命令: flutter pub get 使用 SQLite 创建数据库的时候需要本地路径做为参数,所以添加path_provider 插件获取本地路径

    2.2K30

    Flutter 本地数据库sqflite实战操作「建议收藏」

    Flutter 本地数据库sqflite实战操作 通过本文章将带你了解sqflite如何使用并管理,注意要学习本功能、要具备一定的sql数据库操作的基础知识!...知识点: 本地化列表数据 本地化列表详情数据 sqflite 本地化数据库增删改查操作 一、安装sqflite https://pub.flutter-io.cn/packages/sqflite 二、..., whereArgs:[id]); } // 关闭此表的链接 Future close() async => db.close(); } 四、使用创建的数据库文件 注意: 首先安装网络监听插件...var res = await api.request('https://xxx.xxxx/api', formData: params); // 不为空的话,证明拿到了正常数据,将其存储到要存储的数据参数中...stepDataDetails:dataBase['assets_listDetails'])); }, onLongPress: (){ // 只在获取了本地存储的情况下

    1.7K30

    从 Flutter Go 到 Flutter Go web - 手把手带你轻松玩转 Flutter-web(一)

    下面是 Flutter 官方的2019年,是“ Google的一个早期采用者计划 ”,其中提到: “ 优秀的候选人将参与到引人注目的场景中,计划在2019年底将有一个基于 Flutter web 的体验发布...手动创建 yaml 文件 在项目根目录,需要创建两个关键的 .yaml 文件 build.yaml 是发布版本的必要的配置 pubspec.yaml 是所有依赖配置,类似于 webpack 里的 package.json...之后提示一直在连接中, 说明 缺少 resource 资源文件,继续下面操作 8....bloc dio city_pickers markdown path_provider cookie_jar sqflite 真的好多,怎么办,Google 大法 留的坑,目前只能自力更生了...的 pull request 提交规范(第三方共建) 用户中心 (专属个人的widget案例) 用户登录(通过GitHub账户) 全网搜索 (全网搜索 Flutter 资讯) 收藏个人组件(保存到远端

    1.7K20

    基于 Flutter 定制一套快速开发框架(一)

    因为其自己实现的渲染引擎,因此在多端显示上具备其他跨平台框架不具备的优势,因此注重交互体验一致性的小伙伴来说,这毫无疑问就是首选,今天的主题是基于 Flutter ,如何打造一款快速开发的框架。...网络请求:考虑使用dio包,因为它提供了更多的功能,如拦截器、全局配置、FormData、请求取消等,基本覆盖了网络请求常见的功能,在拦截器中我们可以实现很多统一处理的业务逻辑,嗯,很棒。...数据持久化:考虑持久化方案,如shared_preferences、hive、sqflite等,设计数据模型和存储API,以便于数据的读取和写入,最好是统一的 Storage 抽象,来屏蔽掉这些持久化的细节...主题切换模块我决定使用使用provider库来管理主题状态,并允许用户在亮色和暗色主题之间切换,以下是我们 App 入口的架子。...数据持久化模块和路由模块我们使用auto_route库来自动生成路由表和处理导航,然后使用hive库来实现本地数据存储。前者是因为可以自动生成路由,后者是性能比较不错。

    60020

    Flutter 凉了吗?

    几年前,我在Android和iOS开发中略有涉足,使用的是Java和Objective-C。在花了大约一个月的时间学习后,我决定不再深入学习了。我就是无法找到那种深入其中的状态。...您现在可以进行更改,保存,然后在大概一秒内就能看到更改后的效果。 4 库 Flutter提供了许多开箱即用的强大功能,但有时你需要更多功能。...5 后端开发 现在大多数App都依赖于某种数据,所有这些数据需要存储在某个地方,以便以后可以显示和使用。因此,在寻找使用新SDK(例如Flutter)创建应用时,牢记这一点非常重要。...不管是对于初学者还是专家,创建数据驱动的App都非常简单,但这种简单性并不等同于质量底下。 可以使用库,以便你使用所选择的数据库。使用sqflite库,我们可以非常快速地启动并运行SQLite数据库。...或者,如果要将对象存储在数据库中,可以使用相同的模型将其转换为JSON。 如果没有将其显示给用户的方法,这些数据就不是那么有用了。

    3.1K20

    【Flutter 专题】26 图解关于 SQL 数据库的二三事 (一)

    和尚刚刚学习一下关于数据存储方面的小知识点,用 sqflite 对数据库进行基本操作。sqflite 为三方 pub 通用的引入方式。和尚仅对数据库的基本操作进行学习整理。...集成方式 pubspec.yaml 中添加 sqflite: any; 在相应的 .dart 文件中添加引用 import 'package:sqflite/sqflite.dart'; 根据需求对数据存储进行具体的...创建数据库 sqflite 创建数据库时优先创建一个路径,用来存储数据库。注:对于数据库的操作都是耗时操作,都要通过 async 和 await 异步处理。...【删】删除数据 借助 rawDelete 或 db.delete 对数据库表进行数据删除,和尚测试删除 id = 0和1 的对应数据,sqflite 内部已处理好,若数据库表不存在也不会报异常...,可对部分数据字段进行调整,可以看图例中的【更新】结果; 在使用 db.transaction 对数据库表进行增删改查时要注意 SQL 语句的完整性,包括传递 String 类型参数时要加引号,执行的是一个完整的

    1K51

    Flutter 数据持久化存储之Hive库

    以下是一些常见的方式: Shared Preferences: 使用shared_preferences插件,可以将数据存储在设备的轻量级持久化存储中。...这种方式适合存储少量简单的键值对数据,比如用户偏好设置等。 文件存储: 使用dart:io库可以进行文件存储,可以将数据以文件的形式存储在设备上。...这种方式适合存储结构化数据,可以使用JSON格式或者其他格式进行数据的读写。 SQLite数据库: 可以使用sqflite插件在Flutter应用中使用SQLite数据库。...NoSQL数据库: 一些Flutter插件(如moor)也提供了对NoSQL数据库的支持,比如使用对象数据库(如Hive)来存储数据。...正文   Hive是一个轻量级、快速的本地数据库解决方案,适用于在移动应用程序中进行数据持久化存储。Hive采用高效的自定义序列化算法,能够在移动设备上快速读写数据,适用于处理结构化数据。

    41000

    Flutter完整开发实战详解(二、 快速开发实战篇)

    大家都知道在 Flutter 中 ,是通过实现 State 与 setState 来渲染和改变 StatefulWidget 的。如果使用了flutter_redux 会有怎样的效果?  ...所以如下代码,我们先创建一个 State 用于存储需要保存的对象,其中关键代码在于 UserReducer。...4、数据库   在 GSYGithubAppFlutter 中,数据库使用的是 sqflite 的封装,其实就是 sqlite 语法的使用而已,有兴趣的可以看看完整代码 DemoDb.dart 。...这里主要提供一种思路,按照 sqflite 文档提供的方法,重新做了一小些修改,通过定义 Provider 操作数据库: 在 Provider 中定义表名与数据库字段常量,用于创建表与字段操作; 提供数据库与数据实体之间的映射...,比如数据库对象与User对象之间的转化; 在调用 Provider 时才先判断表是否创建,然后再返回数据库对象进行用户查询。

    5K30

    Flutter完整开发实战详解(二、 快速开发实战篇)

    大家都知道在 Flutter 中 ,是通过实现 State 与 setState 来渲染和改变 StatefulWidget 的。如果使用了flutter_redux 会有怎样的效果?  ...所以如下代码,我们先创建一个 State 用于存储需要保存的对象,其中关键代码在于 UserReducer。...4、数据库   在 GSYGithubAppFlutter 中,数据库使用的是 sqflite 的封装,其实就是 sqlite 语法的使用而已,有兴趣的可以看看完整代码 DemoDb.dart 。...这里主要提供一种思路,按照 sqflite 文档提供的方法,重新做了一小些修改,通过定义 Provider 操作数据库: 在 Provider 中定义表名与数据库字段常量,用于创建表与字段操作; 提供数据库与数据实体之间的映射...,比如数据库对象与User对象之间的转化; 在调用 Provider 时才先判断表是否创建,然后再返回数据库对象进行用户查询。

    5.2K10

    Flutter 学习路线图

    环境搭建 其实学习每一项技术首先都需要搭建环境,这并不属于学习路线的一部分,拿到这里单独说,也并不是告诉大家如何搭建环境,而是给大家推荐环境的选择,因为Flutter的开发并没有专门的IDE,可以使用vscode...、android studio等,这里推荐使用android studio,系统建议Mac OS,因为Flutter目前主要用于Android和IOS的开发。...命名规范 如何定义变量作用域(private、public) 因为这些方面和其他高级语言有些区别,至于其他的方法差别不大。...sqflite:数据库的形式存储数据,适合存储大量数据。 路由管理 什么是路由?简单的理解就是页面的跳转,从一个页面跳转到另一个页面。路由管理就是对这些页面跳转到管理。...混合开发 混合开发是一个非常重要的内容,即使你完全使用Flutter开发一个全新的App,也可能涉及到原生开发。这部分你需要了解如下内容: 在原生项目中增加Flutter模块。

    1.6K10

    Flutter开发 - 数据持久化

    由于 Flutter 仅接管了渲染层,真正涉及到存储等操作系统底层行为时,还需要依托于原生 Android、iOS,因此与原生开发类似的,根据需要持久化数据的大小和方式不同,Flutter 提供了三种数据持久化方法...2、文件是存储在某种介质(比如磁盘)上指定路径的、具有文件名的一组有序信息的集合。...3、使用Sqflite轻量数据库 SharedPrefernces 的使用固然方便,但这种方式只适用于持久化少量数据的场景,我们并不能用它来存储大量数据,比如文件内容(文件路径是可以的)。...SQLite是一个进程内的库,实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。它是一个零配置的数据库,这意味着与其他数据库不一样,您不需要在系统中配置。...不需要一个单独的服务器进程或操作的系统(无服务器的)。 SQLite 不需要配置,这意味着不需要安装或管理。 一个完整的 SQLite 数据库是存储在一个单一的跨平台的磁盘文件。

    1.6K40

    【- Flutter 桌面篇 -】 FlutterUnit win版闪亮登场

    ---- 一、如何运行FlutterUnit windows 1.如果你只是想用 可以下载我打的包,然后运行FlutterUnit.exe即可 在我电脑上是可以运行的,别人电脑不知道怎么样 ?...如何打包项目 打包windows: flutter build windows,在build/windows/Build/Release中可以看到应用 ?...Flutter&Windows 数据库的支持 pub插件地址: pub.flutter-io.cn/packages/mo… GitHub主页 : github.com/simolus3/mo…...有一点需要注意的是,你需要自己将sqlite3.dll拷贝到项目根目录下才能使用。在打包之后也需要将sqlite3.dll拷贝到项目根目录。 ? ? ---- 2....待处理的其他问题 由于shared_preferences未支持windows,使用设置的储存被我注释了,即暂时无法保存配置 ---- 二、.

    2.4K72

    Flutter中利用MapCache加sqflite实现一个伪LRU三级缓存

    然而不信的是,经过我的调研,flutter仓库中的库不太符合要求。...首先,我列一下自己的需求 1、网络请求,我使用的是dio框架,在其上面稍微封装了一下,我的想法是需要在onSuccess回调中把get请求缓存下来,就像下面这样: image.png 2、然后,在需要的地方...3、假如说,我们把接口定义成这样的,那么背后的实现,我们准备如何去做,首先,我是这么考虑的,写缓存,要先写到内存缓存,在写到磁盘缓存,在写的过程中,要使用新的替换旧的,磁盘缓存,和内存缓存都也要有大小的显示...,主要是一些数据库的操作,以及偷懒的LRU实现: import 'package:path/path.dart'; import 'package:sqflite/sqflite.dart'; ///...蓦然回首 当然,我在实现的时候,也了解到有人做了disk_lru_cache了,不过我还是没有使用这个,如果要替换也是相当简单的一件事,不过因为现在这个库测试覆盖不全,评分不是太高,所以暂且还是使用自己的实现

    3.5K61

    Flutter必备技能:轻松掌握本地存储与数据库优化技巧!

    因此,我们需要把这些更新后的数据以一定的形式,通过一定的载体保存起来,这样应用下次运行时,就可以把数据从存储的载体中读出来,也就实现 数据持久化。 数据持久化应用场景很多。...接下来,我通过一个例子来演示在Flutter中如何通过SharedPreferences实现数据的读写。...,有三个地方需要注意: 在设定数据库存储地址时,使用join方法对两段地址进行拼接。...数据库只会创建一次,也就意味着onCreate方法在应用从安装到卸载的生命周期中只会执行一次。如果我们在版本升级过程中,想对数据库的存储字段进行改动又该如何处理呢?...围绕如何将一个对象持久化到数据库,我与你介绍了数据库的创建、写入和读取方法。可以看到,使用数据库的方式虽然前期准备工作多了不少,但面对持续变更的需求,适配能力和灵活性都更强了。

    98220
    领券