Flutter(二十七)——shared_preferences本地存储

简介: Flutter(二十七)——shared_preferences本地存储

前言


从这篇博文开始,博主将为大家介绍Flutter的持久化方式。相信,对于有过Android开发经验的人来说,应该或多或少都接触过。比如,在Android里面的SharedPreferences,数据库Sqlite,文件读写,以及在服务器上的存储HTML5的localStorage,PWA。

合理地运用持久化,可以让App支持离线化操作,给用户带来极大地操作体验的提升。这篇,我们将讲解在Flutter中的SharedPreferences。


shared_preferences本地存储


在Flutter开发中,官方推荐我们使用shared_preferences进行数据存储,它是Flutter社区开发的一个本地数据存取插件,具有一下特性:


(1)它是一个异步的,简单的,持久化的,key-value形式的存储系统


(2)在Android端,它是基于SharedPreferences开发的


(3)在IOS端,他是基于NSUserDefaults开发的


因为它是一个插件,所以在我们开发Flutter项目的时候,需要先引入这个插件,才能使用它,所以在pubspec.yaml里添加以下依赖就可以了,代码如下:

dependencies:
  shared_preferences: ^0.5.1+1


基本用法


引入shared_preferences后,我们就可以使用起来了,首先,博主介绍一下常用的方法,比如保存的方式,代码如下:

SharedPreferences sharedPreferences=await SharedPreferences.getInstance();
sharedPreferences.setString(key,value);


同样,我们取出来数据,代码如下:

SharedPreferences sharedPreferences=await SharedPreferences.getInstance();
sharedPreferences。getString(key);


除了写入和读取外,我们还可能用到删除数据,代码如下:

SharedPreferences sharedPreferences=await SharedPreferences.getInstance();
sharedPreferences.remove(key);


其实使用过Java开发Android的程序员都对上面的代码了如指掌,基本上一摸一样,到这里,shared_preferences本地存储的基本用法就讲解完了。


实现记录自增数据的程序


接着,我们通过一个项目实战来应用shared_preferences本地存储,我们都知道,我们使用Android Studio创建一个Flutter程序的时候,默认就有一个自增程序的代码,这里我们稍微做一下改变,让这个系统自增的程序,每次启动的时候,从shared_preferences本地存储获取数据,代码如下:

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  @override
  void initState() {
    super.initState();
    _getSharedDate();//获取本地存储的数据
  }
//自增的方法
  void _incrementCounter() async{
    SharedPreferences sharedPreferences=await SharedPreferences.getInstance();
    int count=(sharedPreferences.get("counter") ?? 0)+1;//获取本地存储的数据自增
    setState(() {
      _counter=count;//显示到界面上
    });
    await sharedPreferences.setInt("counter", count);//把自增后的数据在存储到本地
  }
//取出存储的数据
  _getSharedDate() async{
    SharedPreferences sharedPreferences=await SharedPreferences.getInstance();
    setState(() {
      _counter=sharedPreferences.get('counter') ?? 0;//从本地存储的数据获取,如果没有设置为0,如果有设置为存储的数据
    });
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

使用到shared_preferences本地存储的代码都有备注,这里就不在过多赘述了,本段代码实现的效果如首图所示,shared_preferences本地存储就讲到这里,下一篇讲解SQLite数据库。

相关文章
|
存储 JSON 数据库
Flutter必备技能:轻松掌握本地存储与数据库优化技巧!
Flutter必备技能:轻松掌握本地存储与数据库优化技巧!
286 0
|
存储 缓存 API
Flutter-本地存储shared_preferences
Flutter-本地存储shared_preferences
511 0
Flutter-本地存储shared_preferences
|
存储 Dart Android开发
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
561 0
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
|
存储 Android开发 iOS开发
Flutter 本地存储之shared_preferences
Flutter 本地存储之shared_preferences
232 0
|
Dart
Flutter:删除所有已保存的shared_preferences首选项
dart - Flutter:删除所有已保存的shared_preferences首选项 想在用户点击注销时删除所有保存的shared_preferences首选项。有什么方法可以一次性完成而不删除一个吗?
301 0
|
存储
flutter中本地存储shared_preferences的使用·
首先在 pubspec.yaml 文件中添加 shared_preferences 引用并 Packages get
279 0
|
存储 Dart Android开发
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
352 0
【Flutter】shared_preferences 本地存储 ( 简介 | 安装 shared_preferences 插件 | 使用 shared_preferences 流程 )
|
8月前
flutter开发中Use ‘const’ with the constructor to improve performance. Try adding the ‘const’ keyword to the constructor invocation.报错如何解决-优雅草卓伊凡
flutter开发中Use ‘const’ with the constructor to improve performance. Try adding the ‘const’ keyword to the constructor invocation.报错如何解决-优雅草卓伊凡
108 1
|
7月前
|
前端开发 安全 开发工具
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
371 90
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
8月前
|
Dart 前端开发
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
259 75
【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈