Flutter：如何使用 sharedPreferences 设置 Switch 的状态

Question

如何读取 sharedPreference 并使用结果设置开关？

我正在尝试开发一个可以检查的项目列表，并使用 sharedPreferences 保存每个开关的状态。

我想我正在存储这些值，但我无法获取代码来读取 sharedPreference 文件并设置开关

我已经搜索过，但我的问题非常独特，我找不到解决方案。

class CheckList extends StatefulWidget {
  @override
  _CheckListState createState() => _CheckListState();
}
bool isSwitched = false;

class _CheckListState extends State<CheckList> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Card(
        margin: EdgeInsets.symmetric(vertical: 15.0, horizontal: 35.0),
        child: ListView(
              children: <Widget>[
                SizedBox(height: 20,),
                Text('Check List', style: TextStyle(fontSize: 25,     color: Colors.green), textAlign: TextAlign.center,),
                SizedBox(height: 10),
                CheckItem('Deposit Paid', 'Deposit'),
                SizedBox(height: 10),
                CheckItem('Balance Paid', 'Balance'),
                SizedBox(height: 10),
                CheckItem('Uploaded Team Name','Team'),
                SizedBox(height: 10),
                CheckItem('Uploaded Charity','Charity'),
                SizedBox(height: 10),
                CheckItem('Sent Copy of Leader Passport','Passport'),
                SizedBox(height: 10),
                CheckItem('Log book in Team Members name','LogBook'),
                SizedBox(height: 10),
                CheckItem('Rally Insurance Printed out','Insurance'),
                SizedBox(height: 10),
                CheckItem('MOT printed out', 'Mot'),
                SizedBox(height: 10),
                CheckItem('Fueled up and Ready to go', 'Ready'),
                SizedBox(height: 10),

              ],
            )
        ),
    );
  }
}



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

class CheckItem extends StatefulWidget {
  CheckItem(this.txt, this.checkKey);
  final String txt;
  final String checkKey;


  @override
  _CheckItemState createState() => _CheckItemState();
}

bool isSwitched = false;


class _CheckItemState extends State<CheckItem> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 10, horizontal: 25),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Expanded(
              child: Text(
            widget.txt,
            style: TextStyle(
              fontFamily: 'sans pro',
              color: Colors.white,
              letterSpacing: 2.0,
              fontWeight: FontWeight.bold,
              fontSize: 15.0,
            ),
          )),
          SizedBox(
            width: 20.0,
          ),
          Switch(
            value: isSwitched,
            onChanged: (value) {
              setState(() {
                isSwitched = value;

                putShared(widget.checkKey, value);
              });
        },
        activeTrackColor: Colors.lightGreenAccent,
        activeColor: Colors.green,
          ),
        ],
      ),
    );
  }
}

void putShared(String key, bool val) async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  prefs.setBool(key, val);
}

Future getShared(String key) async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  bool val = prefs.getBool(key);
  return val;
}

代码似乎有效，但我无法确定，因为我无法读取共享首选项并设置开关。

Answer 1

考虑您的代码。 每次使用 setState 时都需要加载记录的值，因此需要将 Switch 的构造更改为 Futurebuilder，因为 SharePreference 是异步的。如果还没有 sharePreferences，则更改 getShared() 以返回默认值“false”。

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

void main() => runApp(MyApp());

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

class CheckList extends StatefulWidget {
  @override
  _CheckListState createState() => _CheckListState();
}

class _CheckListState extends State<CheckList> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Card(
          color: Colors.redAccent,
          margin: EdgeInsets.symmetric(vertical: 15.0, horizontal: 35.0),
          child: ListView(
            children: <Widget>[
              SizedBox(
                height: 20,
              ),
              Text(
                'Check List',
                style: TextStyle(fontSize: 25, color: Colors.green),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 10),
              CheckItem('Deposit Paid', 'Deposit'),
              SizedBox(height: 10),
              CheckItem('Balance Paid', 'Balance'),
              SizedBox(height: 10),
              CheckItem('Uploaded Team Name', 'Team'),
              SizedBox(height: 10),
              CheckItem('Uploaded Charity', 'Charity'),
              SizedBox(height: 10),
              CheckItem('Sent Copy of Leader Passport', 'Passport'),
              SizedBox(height: 10),
              CheckItem('Log book in Team Members name', 'LogBook'),
              SizedBox(height: 10),
              CheckItem('Rally Insurance Printed out', 'Insurance'),
              SizedBox(height: 10),
              CheckItem('MOT printed out', 'Mot'),
              SizedBox(height: 10),
              CheckItem('Fueled up and Ready to go', 'Ready'),
              SizedBox(height: 10),
            ],
          )),
    );
  }
}

class CheckItem extends StatefulWidget {
  CheckItem(this.txt, this.checkKey);
  final String txt;
  final String checkKey;

  @override
  _CheckItemState createState() => _CheckItemState();
}

class _CheckItemState extends State<CheckItem> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 10, horizontal: 25),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Expanded(
              child: Text(
            widget.txt,
            style: TextStyle(
              fontFamily: 'sans pro',
              color: Colors.white,
              letterSpacing: 2.0,
              fontWeight: FontWeight.bold,
              fontSize: 15.0,
            ),
          )),
          SizedBox(
            width: 20.0,
          ),

          ///////// CHANGES HERE
          FutureBuilder(
              future: getShared(widget.checkKey),
              initialData: false,
              builder: (context, snapshot) {
                return Switch(
                  value: snapshot.data,
                  onChanged: (value) {
                    setState(() {
                      putShared(widget.checkKey, value);
                    });
                  },
                  activeTrackColor: Colors.lightGreenAccent,
                  activeColor: Colors.green,
                );
              })
        ],
      ),
    );
  }
}

void putShared(String key, bool val) async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  prefs.setBool(key, val);
}

Future getShared(String key) async {
  SharedPreferences prefs = await SharedPreferences.getInstance();

  ///////// CHANGES HERE
  bool val = prefs.getBool(key) == null ? false : (prefs.getBool(key));
  return val;
}