Flutter中如何用SharedPreferences持久化Checkbox选中状态？

你的代码核心问题在于读取SharedPreferences值时没有正确更新复选框状态，另外存在一些无效代码，以下是修复后的完整代码及说明：

问题点说明 #

• _getDataAgree方法中，获取到存储的布尔值后，仅写了isChecked;，未将读取到的值赋值给isChecked，导致重启应用后无法恢复状态
• valueAgree变量及initState中的valueAgree;属于无效代码，无实际用途可删除

修复后的代码 #

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

class AgreeScreen extends StatefulWidget {
  const AgreeScreen({Key? key}) : super(key: key);

  @override
  State<AgreeScreen> createState() => _AgreeScreenState();
}

class _AgreeScreenState extends State<AgreeScreen> {
  bool isChecked = false;

  @override
  void initState() {
    super.initState();
    _getDataAgree();
  }

  _saveDataAgree(bool isChecked) async {
    SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
    await sharedPreferences.setBool("Agree", isChecked);
  }

  _getDataAgree() async {
    SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
    // 将读取到的值赋值给isChecked，默认值设为false（如果未存储过）
    bool? savedValue = sharedPreferences.getBool("Agree");
    setState(() {
      isChecked = savedValue ?? false;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 100, left: 15.0),
              child: Row(
                children: <Widget>[
                  const Icon(
                    Icons.brightness_1,
                    color: Colors.black,
                    size: 10,
                  ),
                  const Padding(
                    padding: EdgeInsets.only(left: 15.0),
                    child: Text(
                      "Are you agree",
                      style: TextStyle(fontSize: 16, fontWeight: FontWeight.w500),
                    ),
                  ),
                  const Padding(
                    padding: EdgeInsets.only(left: 30),
                    child: Text(
                      'yes',
                      style: TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                    ),
                  ),
                  Checkbox(
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(8.0),
                    ),
                    side: MaterialStateBorderSide.resolveWith(
                      (states) => BorderSide(width: 3.0, color: Colors.blueAccent),
                    ),
                    value: isChecked,
                    onChanged: (bool? value) {
                      setState(() {
                        isChecked = value!;
                      });
                      // 可选：实时保存状态，无需点击next按钮
                      _saveDataAgree(isChecked);
                    },
                  ),
                ],
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(bottom: 0.0, top: 150),
              child: SizedBox(
                width: 160.0,
                height: 35.0,
                child: ElevatedButton(
                    style: ButtonStyle(
                      shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                        RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(18.0),
                          side: const BorderSide(color: Colors.blueAccent),
                        ),
                      ),
                    ),
                    onPressed: () {
                      // 如果不需要实时保存，保留点击next时保存的逻辑
                      _saveDataAgree(isChecked);
                    },
                    child: const Text('next')),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

关键修改说明 #

1. 修复状态读取逻辑：在_getDataAgree中，将SharedPreferences读取到的值赋值给isChecked，并通过setState更新UI，同时处理未存储过值的情况（默认设为false）
2. 删除无效代码：移除了无用的valueAgree变量及initState中的无效语句
3. 可选优化：在复选框onChanged回调中调用_saveDataAgree，实现状态实时持久化；如果需求是必须点击next按钮才保存，可删除这行代码，保留原按钮的保存逻辑

内容的提问来源于stack exchange，提问作者Dasun Dola