首页
学习
活动
专区
工具
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应用读取写入数据。

44110

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本地存储

    好吧,还是回归今天主题,我们还是来看下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 然后建立库和数据表

    4.9K30

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

    Flutter是谷歌移动UI框架,可以快速iOS、Android、WebPC上构建高质量原生用户界面。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 实战】大量复杂数据持久化

    老孟导读:上一篇文章讲解了 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插件供我们用于大量数据执行CRUD操作。...本篇我们就来一起学习sqflite使用sqflite是一款轻量级关系型数据库,类似SQLite。 Flutter平台我们使用sqflite库来同时支持Android iOS。...sqflite使用 引入插件 pubspec.yaml文件添加path_provider插件,最新版本为1.0.0,如下: dependencies: flutter: sdk: flutter...关闭数据库 数据库对象使用完之后要在适当时候关闭掉,可在helper类实现以下方法。...= null; }); } 写在最后 以上介绍了sqflite我们常用几个操作,有了sqflite我们就可以开发更丰富应用程序,开发实践中大家遇到任何问题都可以给我们发消息反馈,大家一起交流探讨共同进步

    3.8K40

    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 凉了吗?

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

    3.1K20

    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库来实现本地数据存储。前者是因为可以自动生成路由,后者是性能比较不错。

    54920

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

    和尚刚刚学习一下关于数据存储方面的小知识点,用 sqflite数据库进行基本操作。sqflite 为三方 pub 通用引入方式。和尚仅对数据库基本操作进行学习整理。...集成方式 pubspec.yaml 添加 sqflite: any; 相应 .dart 文件添加引用 import 'package:sqflite/sqflite.dart'; 根据需求对数据存储进行具体...创建数据库 sqflite 创建数据库时优先创建一个路径,用来存储数据库。注:对于数据库操作都是耗时操作,都要通过 async await 异步处理。...【删】删除数据 借助 rawDelete 或 db.delete 对数据库表进行数据删除,和尚测试删除 id = 01 对应数据,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采用高效自定义序列化算法,能够移动设备上快速读写数据,适用于处理结构化数据。

    31500

    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目前主要用于AndroidIOS开发。...命名规范 如何定义变量作用域(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
    领券